diff --git a/docs/200.html b/docs/200.html index ed26b59..3657ddb 100644 --- a/docs/200.html +++ b/docs/200.html @@ -1,6 +1,6 @@ - -
+
\ No newline at end of file diff --git a/docs/404.html b/docs/404.html index ed26b59..3657ddb 100644 --- a/docs/404.html +++ b/docs/404.html @@ -1,6 +1,6 @@ - -
+
\ No newline at end of file diff --git a/docs/_payload.js b/docs/_payload.js index 9d3b173..4227a8d 100644 --- a/docs/_payload.js +++ b/docs/_payload.js @@ -1 +1 @@ -export default {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}]},prerenderedAt:1711020221374} \ No newline at end of file +export default {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}]},prerenderedAt:1711020853948} \ No newline at end of file diff --git a/docs/about/_payload.js b/docs/about/_payload.js index 8190e49..9ebb90e 100644 --- a/docs/about/_payload.js +++ b/docs/about/_payload.js @@ -1 +1 @@ -export default {data:{},prerenderedAt:1711020221148} \ No newline at end of file +export default {data:{},prerenderedAt:1711020853747} \ No newline at end of file diff --git a/docs/about/index.html b/docs/about/index.html index 3fc1ffe..6ae91e7 100644 --- a/docs/about/index.html +++ b/docs/about/index.html @@ -1,12 +1,12 @@ -About Me -

Howdy!

My name is Fedor Katurov, I'm a fullstack developer from Siberia.

I develop frontend applications with React, Vue and numerous other frameworks as a job and a hobby. I'm also capable of doing Typescript and Golang backends, services, and integrations.

Skills

React

Classes and FC-s, hooks, context, redux, redux-saga, mobx

Typescript

For both frontend and backend development: generics, guards, infers

SSR (Next, Gatsby)

Automated generation, incremental, static, and dynamic rendering

Vue.js & Nuxt

Common SPA-s and SSR blogs like this one, with composition API, and Vuex

React Native

Basic developing and releasing experience without native modules

Golang

Monolith and microservice apps with REST, GraphQL, and GRPC

Docker

Docker, docker-compose, private registries, gitlab-ci, and drone-ci

HTML, CSS, SVG

Adaptive markup, all modern techniques, preprocessors, and CSS-in-JS

Linux Shell

Linux user since 2003, can write scripts to automate my work. BTW, I use Arch!

GraphQL

Both server- and client-side. Queries, mutations, cache manipulation

REST API

With Axios, fetch, express, gorilla-mux, and gin-gonic

SQL

Base queries, JOIN-s, indexes and simpl query optimizations

Pet Projects

Vault48
Community blog with a long 13-year history, features photo, video and audio embedding. +

Howdy!

My name is Fedor Katurov, I'm a fullstack developer from Siberia.

I develop frontend applications with React, Vue and numerous other frameworks as a job and a hobby. I'm also capable of doing Typescript and Golang backends, services, and integrations.

Skills

React

Classes and FC-s, hooks, context, redux, redux-saga, mobx

Typescript

For both frontend and backend development: generics, guards, infers

SSR (Next, Gatsby)

Automated generation, incremental, static, and dynamic rendering

Vue.js & Nuxt

Common SPA-s and SSR blogs like this one, with composition API, and Vuex

React Native

Basic developing and releasing experience without native modules

Golang

Monolith and microservice apps with REST, GraphQL, and GRPC

Docker

Docker, docker-compose, private registries, gitlab-ci, and drone-ci

HTML, CSS, SVG

Adaptive markup, all modern techniques, preprocessors, and CSS-in-JS

Linux Shell

Linux user since 2003, can write scripts to automate my work. BTW, I use Arch!

GraphQL

Both server- and client-side. Queries, mutations, cache manipulation

REST API

With Axios, fetch, express, gorilla-mux, and gin-gonic

SQL

Base queries, JOIN-s, indexes and simpl query optimizations

Pet Projects

Vault48
Community blog with a long 13-year history, features photo, video and audio embedding. Beeing initially written with Drupal 5, went through refactoring to Laravel + Vue and then, nowadays works on React and Golang stack.
Orchid Map
Local cycling community Web Maps made with React, Leaflet, and Golang. Implements automatic route building with OSRM and map rasterization with canvas. Used by users in local cycling communities for ride sharing.
Obsidian Garden
Frontend for personal knowledge database managed by Obsidian.md software. -Made with nuxt3, nuxt-content plugin and some customizations. Deployed with drone-ci directly to github-pages.
btw, have a nice day
(2018 - 2024) muerwre
+Made with nuxt3, nuxt-content plugin and some customizations. Deployed with drone-ci directly to github-pages.
\ No newline at end of file diff --git a/docs/api/_content/cache.json b/docs/api/_content/cache.json index 5324261..d82b3ac 100644 --- a/docs/api/_content/cache.json +++ b/docs/api/_content/cache.json @@ -1 +1 @@ -{"generatedAt":1711020226355,"generateTime":57,"contents":[{"_path":"/blockchain/common-typescript-examples","_dir":"blockchain","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Common Typescript Examples","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Simple #dapp example for tests: "},{"type":"element","tag":"a","props":{"href":"https://metamask.github.io/test-dapp/","rel":["nofollow"]},"children":[{"type":"text","value":"https://metamask.github.io/test-dapp/"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Interaction with smart contracts described in "},{"type":"element","tag":"a","props":{"href":"Smart%20contracts"},"children":[{"type":"text","value":"Smart contracts"}]}]}]},{"type":"element","tag":"h2","props":{"id":"connecting-to-node"},"children":[{"type":"text","value":"Connecting to node"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If #Metamask extension installed, "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Web3.givenProvider"}]},{"type":"text","value":" is available in global window. You can use "},{"type":"element","tag":"a","props":{"href":"https://infura.io","rel":["nofollow"]},"children":[{"type":"text","value":"Infura"}]},{"type":"text","value":" or your node instead:"}]},{"type":"element","tag":"code","props":{"code":"import Web3 from 'web3';\n\n// URL of your node\nconst PROVIDER_URL = 'https://...';\n\nexport const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import Web3 from 'web3';\n\n// URL of your node\nconst PROVIDER_URL = 'https://...';\n\nexport const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"getting-wallet-balance"},"children":[{"type":"text","value":"Getting wallet balance"}]},{"type":"element","tag":"code","props":{"code":"const getBalance = async (address: string) => {\n return await web3.eth.getBalance(address);\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const getBalance = async (address: string) => {\n return await web3.eth.getBalance(address);\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"getting-wallet-address"},"children":[{"type":"text","value":"Getting wallet address"}]},{"type":"element","tag":"code","props":{"code":"// first we need to authorize\nconst authorize = async () => {\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n}\n\n// then we can get wallet address\nconst getCurrentAddressUser = () => {\n return web3.currentProvider.selectedAddress;\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// first we need to authorize\nconst authorize = async () => {\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n}\n\n// then we can get wallet address\nconst getCurrentAddressUser = () => {\n return web3.currentProvider.selectedAddress;\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"sending-transaction"},"children":[{"type":"text","value":"Sending transaction"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sending "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"value"}]},{"type":"text","value":" tokens with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"memo"}]},{"type":"text","value":" as value:"}]},{"type":"element","tag":"code","props":{"code":"\nconst transfer = async ({ \n from, \n to, \n value, \n memo, \n privateKey, \n gasLimit = 44000 \n}) => {\n const nonce = await web3.eth.getTransactionCount(from);\n const gasPrice = await web3.eth.getGasPrice();\n \n const rawTx = {\n from,\n to,\n value: web3.utils.toHex(Web3.utils.toWei(value, 'ether')),\n gasLimit: web3.utils.toHex(gasLimit),\n gasPrice: web3.utils.toHex(gasPrice),\n nonce: web3.utils.toHex(nonce),\n data: memo,\n };\n \n const privateKeyBuffer = EthUtil.toBuffer(privateKey);\n \n const tx = new Transaction(rawTx);\n \n tx.sign(privateKeyBuffer);\n const serializedTx = tx.serialize();\n \n return this.web3.eth.sendSignedTransaction(\n `0x${serializedTx.toString('hex')}`\n );\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"\nconst transfer = async ({ \n from, \n to, \n value, \n memo, \n privateKey, \n gasLimit = 44000 \n}) => {\n const nonce = await web3.eth.getTransactionCount(from);\n const gasPrice = await web3.eth.getGasPrice();\n \n const rawTx = {\n from,\n to,\n value: web3.utils.toHex(Web3.utils.toWei(value, 'ether')),\n gasLimit: web3.utils.toHex(gasLimit),\n gasPrice: web3.utils.toHex(gasPrice),\n nonce: web3.utils.toHex(nonce),\n data: memo,\n };\n \n const privateKeyBuffer = EthUtil.toBuffer(privateKey);\n \n const tx = new Transaction(rawTx);\n \n tx.sign(privateKeyBuffer);\n const serializedTx = tx.serialize();\n \n return this.web3.eth.sendSignedTransaction(\n `0x${serializedTx.toString('hex')}`\n );\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"estimating-transaction-fee"},"children":[{"type":"text","value":"Estimating transaction FEE"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful to get fixed amount of tokens from user with pre-estimated fee."}]},{"type":"element","tag":"code","props":{"code":"import { web3 } from '.';\n\nconst estimateFee = async ({\n from,\n to,\n value,\n memo,\n}) => {\n const gasPrice = await web3.eth.getGasPrice();\n const gasLimit = await web3.eth.estimateGas({\n from,\n to,\n value: web3.utils.toHex(web3.utils.toWei(value, 'ether')),\n data: web3.utils.asciiToHex(memo),\n }).call();\n \n return web3.utils.fromWei(\n BigInt(gasPrice.toString())\n .multiply(BigInt(gasLimit.toString()))\n .toString()\n );\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { web3 } from '.';\n\nconst estimateFee = async ({\n from,\n to,\n value,\n memo,\n}) => {\n const gasPrice = await web3.eth.getGasPrice();\n const gasLimit = await web3.eth.estimateGas({\n from,\n to,\n value: web3.utils.toHex(web3.utils.toWei(value, 'ether')),\n data: web3.utils.asciiToHex(memo),\n }).call();\n \n return web3.utils.fromWei(\n BigInt(gasPrice.toString())\n .multiply(BigInt(gasLimit.toString()))\n .toString()\n );\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"subscribing-to-wallet-address-change"},"children":[{"type":"text","value":"Subscribing to wallet address change"}]},{"type":"element","tag":"code","props":{"code":"import { web3 } from '.';\n\nweb3.currentProvider.on('accountsChanged', callback);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { web3 } from '.';\n\nweb3.currentProvider.on('accountsChanged', callback);\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"watching-network-change"},"children":[{"type":"text","value":"Watching network change"}]},{"type":"element","tag":"code","props":{"code":"ethereum.on('chainChanged', handler: (chainId: string) => void);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"ethereum.on('chainChanged', handler: (chainId: string) => void);\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"adding-custom-token-to-wallet"},"children":[{"type":"text","value":"Adding custom token to wallet"}]},{"type":"element","tag":"code","props":{"code":"window.ethereum\n .request({\n method: 'wallet_watchAsset',\n params: {\n type: 'ERC20',\n options: {\n address: '0xb60e8dd61c5d32be8058bb8eb970870f07233155',\n symbol: 'FOO',\n decimals: 18,\n image: 'https://foo.io/token-image.svg',\n },\n },\n })\n .then((success) => {\n if (success) {\n console.log('FOO successfully added to wallet!')\n } else {\n throw new Error('Something went wrong.')\n }\n })\n .catch(console.error)\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"window.ethereum\n .request({\n method: 'wallet_watchAsset',\n params: {\n type: 'ERC20',\n options: {\n address: '0xb60e8dd61c5d32be8058bb8eb970870f07233155',\n symbol: 'FOO',\n decimals: 18,\n image: 'https://foo.io/token-image.svg',\n },\n },\n })\n .then((success) => {\n if (success) {\n console.log('FOO successfully added to wallet!')\n } else {\n throw new Error('Something went wrong.')\n }\n })\n .catch(console.error)\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"changing-network-to-custom"},"children":[{"type":"text","value":"Changing network to custom"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Checking current chainId:"}]},{"type":"element","tag":"code","props":{"code":"const getChainID = async () => {\n return ethereum.request({ method: 'eth_chainId' })\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const getChainID = async () => {\n return ethereum.request({ method: 'eth_chainId' })\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Asking wallet to change current network:"}]},{"type":"element","tag":"code","props":{"code":"try {\n await window.ethereum.request({\n method: 'wallet_switchEthereumChain',\n params: [{ chainId: '0x03' }], // ropsten chainID (3) in hex\n });\n} catch (switchError) {\n // This error code indicates that the chain has not been added to MetaMask.\n if (error.code === 4902) {\n try {\n await window.ethereum.request({\n method: 'wallet_addEthereumChain',\n params: [{ \n chainId: '0x03', // ropsten chainID (3) in hex\n chainName: 'Ropsten Test Network', \n nativeCurrency: { \n name: 'ETH',\n symbol: 'ETH',\n decimals: 18\n }, \n rpcUrls: ['https://ropsten.infura.io/v3/9aa3d95b3bc440fa88ea12eaa4456161'], \n blockExplorerUrls: ['https://ropsten.etherscan.io'] \n }] ,\n });\n } catch (addError) {\n // handle \"add\" error\n }\n }\n // handle other \"switch\" errors\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"try {\n await window.ethereum.request({\n method: 'wallet_switchEthereumChain',\n params: [{ chainId: '0x03' }], // ropsten chainID (3) in hex\n });\n} catch (switchError) {\n // This error code indicates that the chain has not been added to MetaMask.\n if (error.code === 4902) {\n try {\n await window.ethereum.request({\n method: 'wallet_addEthereumChain',\n params: [{ \n chainId: '0x03', // ropsten chainID (3) in hex\n chainName: 'Ropsten Test Network', \n nativeCurrency: { \n name: 'ETH',\n symbol: 'ETH',\n decimals: 18\n }, \n rpcUrls: ['https://ropsten.infura.io/v3/9aa3d95b3bc440fa88ea12eaa4456161'], \n blockExplorerUrls: ['https://ropsten.etherscan.io'] \n }] ,\n });\n } catch (addError) {\n // handle \"add\" error\n }\n }\n // handle other \"switch\" errors\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Simple #dapp example for tests: "},{"type":"element","tag":"a","props":{"href":"https://metamask.github.io/test-dapp/","rel":["nofollow"]},"children":[{"type":"text","value":"https://metamask.github.io/test-dapp/"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Interaction with smart contracts described in "},{"type":"element","tag":"a","props":{"href":"Smart%20contracts"},"children":[{"type":"text","value":"Smart contracts"}]}]}]},{"type":"element","tag":"h2","props":{"id":"connecting-to-node"},"children":[{"type":"text","value":"Connecting to node"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If #Metamask extension installed, "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Web3.givenProvider"}]},{"type":"text","value":" is available in global window. You can use "},{"type":"element","tag":"a","props":{"href":"https://infura.io","rel":["nofollow"]},"children":[{"type":"text","value":"Infura"}]},{"type":"text","value":" or your node instead:"}]},{"type":"element","tag":"code","props":{"code":"import Web3 from 'web3';\n\n// URL of your node\nconst PROVIDER_URL = 'https://...';\n\nexport const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'web3'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-75e8dd"},"children":[{"type":"text","value":"// URL of your node"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"PROVIDER_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'https://...'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"givenProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"PROVIDER_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"getting-wallet-balance"},"children":[{"type":"text","value":"Getting wallet balance"}]},{"type":"element","tag":"code","props":{"code":"const getBalance = async (address: string) => {\n return await web3.eth.getBalance(address);\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a4ec55"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-2f2ea3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-adb89a"},"children":[{"type":"text","value":"getBalance"}]},{"type":"element","tag":"span","props":{"class":"ct-2f2ea3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a0c55"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-2f2ea3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a4ec55"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-2f2ea3"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-53baf5"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-6a0c55"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-2f2ea3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5949b"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-2f2ea3"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-a4ec55"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-2f2ea3"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"getBalance"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"getting-wallet-address"},"children":[{"type":"text","value":"Getting wallet address"}]},{"type":"element","tag":"code","props":{"code":"// first we need to authorize\nconst authorize = async () => {\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n}\n\n// then we can get wallet address\nconst getCurrentAddressUser = () => {\n return web3.currentProvider.selectedAddress;\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-75e8dd"},"children":[{"type":"text","value":"// first we need to authorize"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"({ method: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'eth_requestAccounts'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-75e8dd"},"children":[{"type":"text","value":"// then we can get wallet address"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"getCurrentAddressUser"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"selectedAddress"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"sending-transaction"},"children":[{"type":"text","value":"Sending transaction"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sending "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"value"}]},{"type":"text","value":" tokens with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"memo"}]},{"type":"text","value":" as value:"}]},{"type":"element","tag":"code","props":{"code":"\nconst transfer = async ({ \n from, \n to, \n value, \n memo, \n privateKey, \n gasLimit = 44000 \n}) => {\n const nonce = await web3.eth.getTransactionCount(from);\n const gasPrice = await web3.eth.getGasPrice();\n \n const rawTx = {\n from,\n to,\n value: web3.utils.toHex(Web3.utils.toWei(value, 'ether')),\n gasLimit: web3.utils.toHex(gasLimit),\n gasPrice: web3.utils.toHex(gasPrice),\n nonce: web3.utils.toHex(nonce),\n data: memo,\n };\n \n const privateKeyBuffer = EthUtil.toBuffer(privateKey);\n \n const tx = new Transaction(rawTx);\n \n tx.sign(privateKeyBuffer);\n const serializedTx = tx.serialize();\n \n return this.web3.eth.sendSignedTransaction(\n `0x${serializedTx.toString('hex')}`\n );\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"transfer"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" ({ "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"}) "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"nonce"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"getTransactionCount"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"getGasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"rawTx"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" value: "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toWei"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'ether'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":")),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" gasLimit: "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" gasPrice: "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" nonce: "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"nonce"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" data: "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"privateKeyBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"EthUtil"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"tx"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"Transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"rawTx"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"tx"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"sign"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"privateKeyBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"serializedTx"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"tx"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"serialize"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"this"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"sendSignedTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"`0x${"}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"serializedTx"}]},{"type":"element","tag":"span","props":{"class":"ct-4ab335"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-4ab335"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'hex'"}]},{"type":"element","tag":"span","props":{"class":"ct-4ab335"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"}`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"estimating-transaction-fee"},"children":[{"type":"text","value":"Estimating transaction FEE"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful to get fixed amount of tokens from user with pre-estimated fee."}]},{"type":"element","tag":"code","props":{"code":"import { web3 } from '.';\n\nconst estimateFee = async ({\n from,\n to,\n value,\n memo,\n}) => {\n const gasPrice = await web3.eth.getGasPrice();\n const gasLimit = await web3.eth.estimateGas({\n from,\n to,\n value: web3.utils.toHex(web3.utils.toWei(value, 'ether')),\n data: web3.utils.asciiToHex(memo),\n }).call();\n \n return web3.utils.fromWei(\n BigInt(gasPrice.toString())\n .multiply(BigInt(gasLimit.toString()))\n .toString()\n );\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"estimateFee"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" ({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"}) "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"getGasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"estimateGas"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" value: "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toWei"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'ether'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":")),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" data: "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"asciiToHex"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" })."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"call"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"fromWei"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f08b88"},"children":[{"type":"text","value":"BigInt"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"())"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"multiply"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f08b88"},"children":[{"type":"text","value":"BigInt"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"()))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"()"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"subscribing-to-wallet-address-change"},"children":[{"type":"text","value":"Subscribing to wallet address change"}]},{"type":"element","tag":"code","props":{"code":"import { web3 } from '.';\n\nweb3.currentProvider.on('accountsChanged', callback);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'accountsChanged'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"callback"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"watching-network-change"},"children":[{"type":"text","value":"Watching network change"}]},{"type":"element","tag":"code","props":{"code":"ethereum.on('chainChanged', handler: (chainId: string) => void);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'chainChanged'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"handler"}]},{"type":"element","tag":"span","props":{"class":"ct-78e6f9"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"adding-custom-token-to-wallet"},"children":[{"type":"text","value":"Adding custom token to wallet"}]},{"type":"element","tag":"code","props":{"code":"window.ethereum\n .request({\n method: 'wallet_watchAsset',\n params: {\n type: 'ERC20',\n options: {\n address: '0xb60e8dd61c5d32be8058bb8eb970870f07233155',\n symbol: 'FOO',\n decimals: 18,\n image: 'https://foo.io/token-image.svg',\n },\n },\n })\n .then((success) => {\n if (success) {\n console.log('FOO successfully added to wallet!')\n } else {\n throw new Error('Something went wrong.')\n }\n })\n .catch(console.error)\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"window"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"ethereum"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" method: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'wallet_watchAsset'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" params: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" type: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'ERC20'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" options: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" address: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'0xb60e8dd61c5d32be8058bb8eb970870f07233155'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" symbol: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'FOO'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" decimals: "}]},{"type":"element","tag":"span","props":{"class":"ct-9f9086"},"children":[{"type":"text","value":"18"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" image: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'https://foo.io/token-image.svg'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2f2ea3"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-adb89a"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-2f2ea3"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-53baf5"},"children":[{"type":"text","value":"success"}]},{"type":"element","tag":"span","props":{"class":"ct-2f2ea3"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-a4ec55"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-2f2ea3"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"success"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'FOO successfully added to wallet!'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"else"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f08b88"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'Something went wrong.'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":")"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"changing-network-to-custom"},"children":[{"type":"text","value":"Changing network to custom"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Checking current chainId:"}]},{"type":"element","tag":"code","props":{"code":"const getChainID = async () => {\n return ethereum.request({ method: 'eth_chainId' })\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"getChainID"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"({ method: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'eth_chainId'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Asking wallet to change current network:"}]},{"type":"element","tag":"code","props":{"code":"try {\n await window.ethereum.request({\n method: 'wallet_switchEthereumChain',\n params: [{ chainId: '0x03' }], // ropsten chainID (3) in hex\n });\n} catch (switchError) {\n // This error code indicates that the chain has not been added to MetaMask.\n if (error.code === 4902) {\n try {\n await window.ethereum.request({\n method: 'wallet_addEthereumChain',\n params: [{ \n chainId: '0x03', // ropsten chainID (3) in hex\n chainName: 'Ropsten Test Network', \n nativeCurrency: { \n name: 'ETH',\n symbol: 'ETH',\n decimals: 18\n }, \n rpcUrls: ['https://ropsten.infura.io/v3/9aa3d95b3bc440fa88ea12eaa4456161'], \n blockExplorerUrls: ['https://ropsten.etherscan.io'] \n }] ,\n });\n } catch (addError) {\n // handle \"add\" error\n }\n }\n // handle other \"switch\" errors\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"window"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" method: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'wallet_switchEthereumChain'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" params: [{ chainId: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'0x03'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" }], "}]},{"type":"element","tag":"span","props":{"class":"ct-75e8dd"},"children":[{"type":"text","value":"// ropsten chainID (3) in hex"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"} "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"switchError"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-75e8dd"},"children":[{"type":"text","value":"// This error code indicates that the chain has not been added to MetaMask."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"code"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9f9086"},"children":[{"type":"text","value":"4902"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"window"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" method: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'wallet_addEthereumChain'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" params: [{ "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" chainId: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'0x03'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-75e8dd"},"children":[{"type":"text","value":"// ropsten chainID (3) in hex"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" chainName: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'Ropsten Test Network'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" nativeCurrency: { "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" name: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'ETH'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" symbol: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'ETH'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" decimals: "}]},{"type":"element","tag":"span","props":{"class":"ct-9f9086"},"children":[{"type":"text","value":"18"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" }, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" rpcUrls: ["}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'https://ropsten.infura.io/v3/9aa3d95b3bc440fa88ea12eaa4456161'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"], "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" blockExplorerUrls: ["}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'https://ropsten.etherscan.io'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"] "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" }] ,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"addError"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-75e8dd"},"children":[{"type":"text","value":"// handle \"add\" error"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-75e8dd"},"children":[{"type":"text","value":"// handle other \"switch\" errors"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-9f9086{color:#79C0FF}.ct-78e6f9{color:#C9D1D9}.ct-f08b88{color:#79C0FF}.ct-4ab335{color:#A5D6FF}.ct-c5949b{color:#79C0FF}.ct-53baf5{color:#FFA657}.ct-6a0c55{color:#FF7B72}.ct-adb89a{color:#D2A8FF}.ct-2f2ea3{color:#C9D1D9}.ct-a4ec55{color:#FF7B72}.ct-29697d{color:#D2A8FF}.ct-654ee1{color:#79C0FF}.ct-ac442e{color:#FF7B72}.ct-75e8dd{color:#8B949E}.ct-aaf828{color:#A5D6FF}.ct-7bd146{color:#C9D1D9}.ct-c2c078{color:#C9D1D9}.ct-eafdf1{color:#FF7B72}.light .ct-eafdf1{color:#859900}.light .ct-c2c078{color:#657B83}.light .ct-7bd146{color:#268BD2}.light .ct-aaf828{color:#2AA198}.light .ct-75e8dd{color:#93A1A1}.light .ct-ac442e{color:#073642}.light .ct-654ee1{color:#268BD2}.light .ct-29697d{color:#268BD2}.light .ct-a4ec55{color:#073642}.light .ct-2f2ea3{color:#657B83}.light .ct-adb89a{color:#268BD2}.light .ct-6a0c55{color:#859900}.light .ct-53baf5{color:#657B83}.light .ct-c5949b{color:#859900}.light .ct-4ab335{color:#657B83}.light .ct-f08b88{color:#859900}.light .ct-78e6f9{color:#859900}.light .ct-9f9086{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"connecting-to-node","depth":2,"text":"Connecting to node"},{"id":"getting-wallet-balance","depth":2,"text":"Getting wallet balance"},{"id":"getting-wallet-address","depth":2,"text":"Getting wallet address"},{"id":"sending-transaction","depth":2,"text":"Sending transaction"},{"id":"estimating-transaction-fee","depth":2,"text":"Estimating transaction FEE"},{"id":"subscribing-to-wallet-address-change","depth":2,"text":"Subscribing to wallet address change"},{"id":"watching-network-change","depth":2,"text":"Watching network change"},{"id":"adding-custom-token-to-wallet","depth":2,"text":"Adding custom token to wallet"},{"id":"changing-network-to-custom","depth":2,"text":"Changing network to custom"}]}},"_type":"markdown","_id":"content:Blockchain:Common typescript examples.md","_source":"content","_file":"Blockchain/Common typescript examples.md","_extension":"md"},{"_path":"/blockchain/smart-contracts","_dir":"blockchain","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Smart Contracts","description":"For common functions see Common typescript examples.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For common functions see "},{"type":"element","tag":"a","props":{"href":"Common%20typescript%20examples"},"children":[{"type":"text","value":"Common typescript examples"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"getting-smart-contract-instance"},"children":[{"type":"text","value":"Getting smart contract instance"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful for calling smart contract methods:"}]},{"type":"element","tag":"code","props":{"code":"import { Contract } from 'web3-eth-contract';\nimport { web3 } from '.';\n\nconst getContract = (abi: object, address?: string): Contract => {\n const abiFromJson = JSON.parse(JSON.stringify(abi));\n return new web3.eth.Contract(abiFromJson, address);\n};\n\nexport default getContract;\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { Contract } from 'web3-eth-contract';\nimport { web3 } from '.';\n\nconst getContract = (abi: object, address?: string): Contract => {\n const abiFromJson = JSON.parse(JSON.stringify(abi));\n return new web3.eth.Contract(abiFromJson, address);\n};\n\nexport default getContract;\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"executing-contract-method"},"children":[{"type":"text","value":"Executing contract method"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Contract has "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"read"}]},{"type":"text","value":" and "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"write"}]},{"type":"text","value":" methods. To get a list of methods, you can paste contract address on "},{"type":"element","tag":"a","props":{"href":"https://etherscan.io/token/0xdac17f958d2ee523a2206206994597c13d831ec7#readContract","rel":["nofollow"]},"children":[{"type":"text","value":"https://etherscan.io/ ETH"}]},{"type":"text","value":" or any other service."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Read"}]},{"type":"text","value":" methods doesn't require spending "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"gas"}]},{"type":"text","value":". "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Write"}]},{"type":"text","value":" methods cost some amount of "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"gas"}]},{"type":"text","value":", hence they will be executed with confirmation from user."}]},{"type":"element","tag":"h3","props":{"id":"example-for-metamask-without-private-key"},"children":[{"type":"text","value":"Example for #Metamask without private key"}]},{"type":"element","tag":"code","props":{"code":"// see example below\nimport { getContract } from '.';\n\n// ABI of contract\nconst CONTRACT_ABI = { /* ... */ };\n // address for contract\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n\nexport const executeContractMethod = async ({}) => {\n // getting contract\n const contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n \n // Calling write method\n try {\n // authorizing with Metamask\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n // getting wallet address\n const addressUser = web3.currentProvider.selectedAddress;\n // calling \"store\" store method for contract\n // payload should include `from` address, that matches\n // current user's wallet\n await contract.methods.store(0, 'Parameter').send({\n from: addressUser,\n });\n } catch (e) {\n throw new Error(e);\n }\n \n // calling read method\n try {\n // this method can return data\n const result = await contract.methods.retrieve().call();\n } catch (e) {\n throw new Error(e);\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// see example below\nimport { getContract } from '.';\n\n// ABI of contract\nconst CONTRACT_ABI = { /* ... */ };\n // address for contract\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n\nexport const executeContractMethod = async ({}) => {\n // getting contract\n const contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n \n // Calling write method\n try {\n // authorizing with Metamask\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n // getting wallet address\n const addressUser = web3.currentProvider.selectedAddress;\n // calling \"store\" store method for contract\n // payload should include `from` address, that matches\n // current user's wallet\n await contract.methods.store(0, 'Parameter').send({\n from: addressUser,\n });\n } catch (e) {\n throw new Error(e);\n }\n \n // calling read method\n try {\n // this method can return data\n const result = await contract.methods.retrieve().call();\n } catch (e) {\n throw new Error(e);\n }\n}\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"nodejs-and-react-native-example"},"children":[{"type":"text","value":"Node.js and React Native example"}]},{"type":"element","tag":"code","props":{"code":"// see example below\nimport { getContract } from '.';\n\n// ABI контракта\nconst CONTRACT_ABI = { /* ... */ };\n// contract address\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n// getting contract\nconst contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n// account's private key\nconst privateKey = '...';\n\n// write-methods requires private key\nconst executeContractMethod = async (val: number) => {\n const transaction = contract.methods.store(val);\n const account = web3.eth.accounts.privateKeyToAccount(privateKey);\n const options = {\n to: CONTRACT_ADDRESS,\n data: transaction.encodeABI(),\n gas: await transaction.estimateGas({ from: account.address }),\n gasPrice: await web3.eth.getGasPrice(),\n };\n const signed = await web3.eth.accounts.signTransaction(\n options,\n privateKey,\n );\n await web3.eth.sendSignedTransaction(signed.rawTransaction!);\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// see example below\nimport { getContract } from '.';\n\n// ABI контракта\nconst CONTRACT_ABI = { /* ... */ };\n// contract address\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n// getting contract\nconst contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n// account's private key\nconst privateKey = '...';\n\n// write-methods requires private key\nconst executeContractMethod = async (val: number) => {\n const transaction = contract.methods.store(val);\n const account = web3.eth.accounts.privateKeyToAccount(privateKey);\n const options = {\n to: CONTRACT_ADDRESS,\n data: transaction.encodeABI(),\n gas: await transaction.estimateGas({ from: account.address }),\n gasPrice: await web3.eth.getGasPrice(),\n };\n const signed = await web3.eth.accounts.signTransaction(\n options,\n privateKey,\n );\n await web3.eth.sendSignedTransaction(signed.rawTransaction!);\n};\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"calling-a-batch-of-contracts-methods"},"children":[{"type":"text","value":"Calling a batch of contract's methods"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Function calls batch of requests, returning array of results. For example:"}]},{"type":"element","tag":"code","props":{"code":" const requests = [\n contract.method.balanceOf().call,\n contract.method.getStaked().call\n ]\n\n const result = await makeBatchRequest(request);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" const requests = [\n contract.method.balanceOf().call,\n contract.method.getStaked().call\n ]\n\n const result = await makeBatchRequest(request);\n"}]}]}]},{"type":"element","tag":"code","props":{"code":"const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n\nconst makeBatchRequest = (calls: any[]) => {\n try {\n const web3 = getWeb3NoAccount();\n const batch = new web3.BatchRequest();\n\n const promises = calls.map((call) => {\n return new Promise((resolve, reject) => {\n batch.add(\n call.request({}, (err, result) => {\n if (err) {\n reject(err);\n } else {\n resolve(result);\n }\n })\n );\n });\n });\n\n batch.execute();\n\n return Promise.all(promises);\n } catch {\n return null;\n }\n};\n\nexport default makeBatchRequest;\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n\nconst makeBatchRequest = (calls: any[]) => {\n try {\n const web3 = getWeb3NoAccount();\n const batch = new web3.BatchRequest();\n\n const promises = calls.map((call) => {\n return new Promise((resolve, reject) => {\n batch.add(\n call.request({}, (err, result) => {\n if (err) {\n reject(err);\n } else {\n resolve(result);\n }\n })\n );\n });\n });\n\n batch.execute();\n\n return Promise.all(promises);\n } catch {\n return null;\n }\n};\n\nexport default makeBatchRequest;\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"subscribing-to-smart-contract-events"},"children":[{"type":"text","value":"Subscribing to smart contract events"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There're different ways to subscribe for contract events. For all of them you will need following variables:"}]},{"type":"element","tag":"code","props":{"code":" import Web3 from 'web3';\n const web3 = new Web3('YOUR_RPC_ENDPOINT_HERE');\n const ABI = 'YOUR ABI HERE';\n const CONTRACT_ADDRESS = 'YOUR CONTRACT ADDRESS HERE';\n const myContract = new Web3.Contract(ABI, CONTRACT_ADDRESS);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" import Web3 from 'web3';\n const web3 = new Web3('YOUR_RPC_ENDPOINT_HERE');\n const ABI = 'YOUR ABI HERE';\n const CONTRACT_ADDRESS = 'YOUR CONTRACT ADDRESS HERE';\n const myContract = new Web3.Contract(ABI, CONTRACT_ADDRESS);\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"by-accessing-contractevents"},"children":[{"type":"text","value":"By accessing contract.events"}]},{"type":"element","tag":"code","props":{"code":"referralProgramContract.events\n .RegisterUser()\n .on('connected', (subscriptionId: string) => {\n console.log(`| UserRegistered | events | ${subscriptionId}`);\n })\n .on(\n 'data',\n async (event: {\n removed: boolean;\n returnValues: RegisterUserResponseInterface;\n }) => {\n try {\n if (event.removed) {\n return;\n }\n const { user, referrer } = event.returnValues;\n console.log(user, referrer);\n } catch (e) {\n console.log(`| ONCE | ${e}`);\n }\n },\n )\n .on('error', (error: ErrnoException) => {\n console.log(error);\n });\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"referralProgramContract.events\n .RegisterUser()\n .on('connected', (subscriptionId: string) => {\n console.log(`| UserRegistered | events | ${subscriptionId}`);\n })\n .on(\n 'data',\n async (event: {\n removed: boolean;\n returnValues: RegisterUserResponseInterface;\n }) => {\n try {\n if (event.removed) {\n return;\n }\n const { user, referrer } = event.returnValues;\n console.log(user, referrer);\n } catch (e) {\n console.log(`| ONCE | ${e}`);\n }\n },\n )\n .on('error', (error: ErrnoException) => {\n console.log(error);\n });\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"with-filtering"},"children":[{"type":"text","value":"With filtering"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We're listening to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Transfer"}]},{"type":"text","value":" event here:"}]},{"type":"element","tag":"code","props":{"code":" let options = {\n filter: {\n value: [],\n },\n fromBlock: 0\n };\n\n myContract.events.Transfer(options)\n .on('data', event => console.log(event))\n .on('changed', changed => console.log(changed))\n .on('error', err => throw err)\n .on('connected', str => console.log(str))\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" let options = {\n filter: {\n value: [],\n },\n fromBlock: 0\n };\n\n myContract.events.Transfer(options)\n .on('data', event => console.log(event))\n .on('changed', changed => console.log(changed))\n .on('error', err => throw err)\n .on('connected', str => console.log(str))\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"common-subscribe-method"},"children":[{"type":"text","value":"Common Subscribe method"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Filtering options can also be specified:"}]},{"type":"element","tag":"code","props":{"code":" let options = {\n fromBlock: 0,\n address: ['address-1', 'address-2'], //Only get events from specific addresses\n topics: [] //What topics to subscribe to\n };\n\n let subscription = ('logs', options, (err,event) => {\n if (!err)\n console.log(event)\n });\n\n subscription.on('data', event => console.log(event))\n subscription.on('changed', changed => console.log(changed))\n subscription.on('error', err => { throw err })\n subscription.on('connected', nr => console.log(nr))\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" let options = {\n fromBlock: 0,\n address: ['address-1', 'address-2'], //Only get events from specific addresses\n topics: [] //What topics to subscribe to\n };\n\n let subscription = ('logs', options, (err,event) => {\n if (!err)\n console.log(event)\n });\n\n subscription.on('data', event => console.log(event))\n subscription.on('changed', changed => console.log(changed))\n subscription.on('error', err => { throw err })\n subscription.on('connected', nr => console.log(nr))\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"getting-event-history"},"children":[{"type":"text","value":"Getting event history"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Getting history for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Transfer"}]},{"type":"text","value":" events for specific values. More info can be found "},{"type":"element","tag":"a","props":{"href":"https://web3js.readthedocs.io/en/v1.2.11/web3-eth-subscribe.html#","rel":["nofollow"]},"children":[{"type":"text","value":"here"}]}]},{"type":"element","tag":"code","props":{"code":" //example options(optional)\n let options = {\n filter: {\n // only get events where transfer value was 1000 or 1337\n value: ['1000', '1337'] \n },\n // number | \"earliest\" | \"pending\" | \"latest\"\n fromBlock: 0, \n toBlock: 'latest'\n };\n\n myContract.getPastEvents('Transfer', options)\n .then(results => console.log(results))\n .catch(err => throw err);\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" //example options(optional)\n let options = {\n filter: {\n // only get events where transfer value was 1000 or 1337\n value: ['1000', '1337'] \n },\n // number | \"earliest\" | \"pending\" | \"latest\"\n fromBlock: 0, \n toBlock: 'latest'\n };\n\n myContract.getPastEvents('Transfer', options)\n .then(results => console.log(results))\n .catch(err => throw err);\n\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For common functions see "},{"type":"element","tag":"a","props":{"href":"Common%20typescript%20examples"},"children":[{"type":"text","value":"Common typescript examples"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"getting-smart-contract-instance"},"children":[{"type":"text","value":"Getting smart contract instance"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful for calling smart contract methods:"}]},{"type":"element","tag":"code","props":{"code":"import { Contract } from 'web3-eth-contract';\nimport { web3 } from '.';\n\nconst getContract = (abi: object, address?: string): Contract => {\n const abiFromJson = JSON.parse(JSON.stringify(abi));\n return new web3.eth.Contract(abiFromJson, address);\n};\n\nexport default getContract;\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"Contract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'web3-eth-contract'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0e2e0"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-60ccc9"},"children":[{"type":"text","value":"abi"}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-353508"},"children":[{"type":"text","value":"object"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-60ccc9"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":"?:"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-353508"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7d4034"},"children":[{"type":"text","value":"abiFromJson"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2e4590"},"children":[{"type":"text","value":"JSON"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7d4034"},"children":[{"type":"text","value":"parse"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"Contract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"abiFromJson"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-680997"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-680997"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"executing-contract-method"},"children":[{"type":"text","value":"Executing contract method"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Contract has "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"read"}]},{"type":"text","value":" and "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"write"}]},{"type":"text","value":" methods. To get a list of methods, you can paste contract address on "},{"type":"element","tag":"a","props":{"href":"https://etherscan.io/token/0xdac17f958d2ee523a2206206994597c13d831ec7#readContract","rel":["nofollow"]},"children":[{"type":"text","value":"https://etherscan.io/ ETH"}]},{"type":"text","value":" or any other service."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Read"}]},{"type":"text","value":" methods doesn't require spending "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"gas"}]},{"type":"text","value":". "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Write"}]},{"type":"text","value":" methods cost some amount of "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"gas"}]},{"type":"text","value":", hence they will be executed with confirmation from user."}]},{"type":"element","tag":"h3","props":{"id":"example-for-metamask-without-private-key"},"children":[{"type":"text","value":"Example for #Metamask without private key"}]},{"type":"element","tag":"code","props":{"code":"// see example below\nimport { getContract } from '.';\n\n// ABI of contract\nconst CONTRACT_ABI = { /* ... */ };\n // address for contract\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n\nexport const executeContractMethod = async ({}) => {\n // getting contract\n const contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n \n // Calling write method\n try {\n // authorizing with Metamask\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n // getting wallet address\n const addressUser = web3.currentProvider.selectedAddress;\n // calling \"store\" store method for contract\n // payload should include `from` address, that matches\n // current user's wallet\n await contract.methods.store(0, 'Parameter').send({\n from: addressUser,\n });\n } catch (e) {\n throw new Error(e);\n }\n \n // calling read method\n try {\n // this method can return data\n const result = await contract.methods.retrieve().call();\n } catch (e) {\n throw new Error(e);\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// see example below"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// ABI of contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"/* ... */"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// address for contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'0xdea164f67df4dbfe675d5271c9d404e0260f33bb'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"executeContractMethod"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ({}) "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// getting contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// Calling write method"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// authorizing with Metamask"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"({ method: "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'eth_requestAccounts'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// getting wallet address"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"addressUser"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"selectedAddress"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// calling \"store\" store method for contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// payload should include `from` address, that matches"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// current user's wallet"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"methods"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"store"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d7c5e5"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'Parameter'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"send"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" from: "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"addressUser"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3a9681"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// calling read method"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// this method can return data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"methods"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"retrieve"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"()."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"call"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3a9681"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"nodejs-and-react-native-example"},"children":[{"type":"text","value":"Node.js and React Native example"}]},{"type":"element","tag":"code","props":{"code":"// see example below\nimport { getContract } from '.';\n\n// ABI контракта\nconst CONTRACT_ABI = { /* ... */ };\n// contract address\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n// getting contract\nconst contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n// account's private key\nconst privateKey = '...';\n\n// write-methods requires private key\nconst executeContractMethod = async (val: number) => {\n const transaction = contract.methods.store(val);\n const account = web3.eth.accounts.privateKeyToAccount(privateKey);\n const options = {\n to: CONTRACT_ADDRESS,\n data: transaction.encodeABI(),\n gas: await transaction.estimateGas({ from: account.address }),\n gasPrice: await web3.eth.getGasPrice(),\n };\n const signed = await web3.eth.accounts.signTransaction(\n options,\n privateKey,\n );\n await web3.eth.sendSignedTransaction(signed.rawTransaction!);\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// see example below"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// ABI контракта"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"/* ... */"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// contract address"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'0xdea164f67df4dbfe675d5271c9d404e0260f33bb'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// getting contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// account's private key"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// write-methods requires private key"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0e2e0"},"children":[{"type":"text","value":"executeContractMethod"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-60ccc9"},"children":[{"type":"text","value":"val"}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-353508"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"methods"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"store"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"val"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"account"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"accounts"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"privateKeyToAccount"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" to: "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" data: "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"encodeABI"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"(),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" gas: "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"estimateGas"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"({ from: "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"account"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" gasPrice: "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"getGasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"(),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"signed"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"accounts"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"signTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"sendSignedTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"signed"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"rawTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"calling-a-batch-of-contracts-methods"},"children":[{"type":"text","value":"Calling a batch of contract's methods"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Function calls batch of requests, returning array of results. For example:"}]},{"type":"element","tag":"code","props":{"code":" const requests = [\n contract.method.balanceOf().call,\n contract.method.getStaked().call\n ]\n\n const result = await makeBatchRequest(request);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"requests"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"method"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"balanceOf"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"()."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"call"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"method"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"getStaked"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"()."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"call"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"makeBatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"code","props":{"code":"const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n\nconst makeBatchRequest = (calls: any[]) => {\n try {\n const web3 = getWeb3NoAccount();\n const batch = new web3.BatchRequest();\n\n const promises = calls.map((call) => {\n return new Promise((resolve, reject) => {\n batch.add(\n call.request({}, (err, result) => {\n if (err) {\n reject(err);\n } else {\n resolve(result);\n }\n })\n );\n });\n });\n\n batch.execute();\n\n return Promise.all(promises);\n } catch {\n return null;\n }\n};\n\nexport default makeBatchRequest;\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"givenProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"PROVIDER_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0e2e0"},"children":[{"type":"text","value":"makeBatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-60ccc9"},"children":[{"type":"text","value":"calls"}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-353508"},"children":[{"type":"text","value":"any"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":"[]) "}]},{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"getWeb3NoAccount"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"batch"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"BatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"promises"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"calls"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"map"}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-353508"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-60ccc9"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-60ccc9"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"batch"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"add"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"else"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"batch"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"execute"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3a9681"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"all"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"promises"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a950c2"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-680997"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-680997"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"makeBatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"subscribing-to-smart-contract-events"},"children":[{"type":"text","value":"Subscribing to smart contract events"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There're different ways to subscribe for contract events. For all of them you will need following variables:"}]},{"type":"element","tag":"code","props":{"code":" import Web3 from 'web3';\n const web3 = new Web3('YOUR_RPC_ENDPOINT_HERE');\n const ABI = 'YOUR ABI HERE';\n const CONTRACT_ADDRESS = 'YOUR CONTRACT ADDRESS HERE';\n const myContract = new Web3.Contract(ABI, CONTRACT_ADDRESS);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'web3'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'YOUR_RPC_ENDPOINT_HERE'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'YOUR ABI HERE'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'YOUR CONTRACT ADDRESS HERE'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"myContract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"Contract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"by-accessing-contractevents"},"children":[{"type":"text","value":"By accessing contract.events"}]},{"type":"element","tag":"code","props":{"code":"referralProgramContract.events\n .RegisterUser()\n .on('connected', (subscriptionId: string) => {\n console.log(`| UserRegistered | events | ${subscriptionId}`);\n })\n .on(\n 'data',\n async (event: {\n removed: boolean;\n returnValues: RegisterUserResponseInterface;\n }) => {\n try {\n if (event.removed) {\n return;\n }\n const { user, referrer } = event.returnValues;\n console.log(user, referrer);\n } catch (e) {\n console.log(`| ONCE | ${e}`);\n }\n },\n )\n .on('error', (error: ErrnoException) => {\n console.log(error);\n });\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"referralProgramContract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"events"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"RegisterUser"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"()"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-b0e2e0"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5bc21b"},"children":[{"type":"text","value":"'connected'"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":", ("}]},{"type":"element","tag":"span","props":{"class":"ct-60ccc9"},"children":[{"type":"text","value":"subscriptionId"}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-353508"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"`| UserRegistered | events | ${"}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"subscriptionId"}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'data'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-60ccc9"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-60ccc9"},"children":[{"type":"text","value":"removed"}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-353508"},"children":[{"type":"text","value":"boolean"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-60ccc9"},"children":[{"type":"text","value":"returnValues"}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0479b3"},"children":[{"type":"text","value":"RegisterUserResponseInterface"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"removed"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"user"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"referrer"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"returnValues"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"user"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"referrer"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"`| ONCE | ${"}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" )"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-b0e2e0"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5bc21b"},"children":[{"type":"text","value":"'error'"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":", ("}]},{"type":"element","tag":"span","props":{"class":"ct-60ccc9"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0479b3"},"children":[{"type":"text","value":"ErrnoException"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" });"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"with-filtering"},"children":[{"type":"text","value":"With filtering"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We're listening to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Transfer"}]},{"type":"text","value":" event here:"}]},{"type":"element","tag":"code","props":{"code":" let options = {\n filter: {\n value: [],\n },\n fromBlock: 0\n };\n\n myContract.events.Transfer(options)\n .on('data', event => console.log(event))\n .on('changed', changed => console.log(changed))\n .on('error', err => throw err)\n .on('connected', str => console.log(str))\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" filter: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" value: [],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" fromBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-d7c5e5"},"children":[{"type":"text","value":"0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"myContract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"events"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"Transfer"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'data'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'changed'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"changed"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'error'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'connected'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"str"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"))"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"common-subscribe-method"},"children":[{"type":"text","value":"Common Subscribe method"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Filtering options can also be specified:"}]},{"type":"element","tag":"code","props":{"code":" let options = {\n fromBlock: 0,\n address: ['address-1', 'address-2'], //Only get events from specific addresses\n topics: [] //What topics to subscribe to\n };\n\n let subscription = ('logs', options, (err,event) => {\n if (!err)\n console.log(event)\n });\n\n subscription.on('data', event => console.log(event))\n subscription.on('changed', changed => console.log(changed))\n subscription.on('error', err => { throw err })\n subscription.on('connected', nr => console.log(nr))\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" fromBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-d7c5e5"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" address: ["}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'address-1'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'address-2'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"], "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"//Only get events from specific addresses"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" topics: [] "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"//What topics to subscribe to"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'logs'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'data'"}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'changed'"}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"changed"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'error'"}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'connected'"}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"nr"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"))"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"getting-event-history"},"children":[{"type":"text","value":"Getting event history"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Getting history for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Transfer"}]},{"type":"text","value":" events for specific values. More info can be found "},{"type":"element","tag":"a","props":{"href":"https://web3js.readthedocs.io/en/v1.2.11/web3-eth-subscribe.html#","rel":["nofollow"]},"children":[{"type":"text","value":"here"}]}]},{"type":"element","tag":"code","props":{"code":" //example options(optional)\n let options = {\n filter: {\n // only get events where transfer value was 1000 or 1337\n value: ['1000', '1337'] \n },\n // number | \"earliest\" | \"pending\" | \"latest\"\n fromBlock: 0, \n toBlock: 'latest'\n };\n\n myContract.getPastEvents('Transfer', options)\n .then(results => console.log(results))\n .catch(err => throw err);\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"//example options(optional)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" filter: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// only get events where transfer value was 1000 or 1337"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" value: ["}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'1000'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'1337'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"] "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// number | \"earliest\" | \"pending\" | \"latest\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" fromBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-d7c5e5"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" toBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'latest'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"myContract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"getPastEvents"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'Transfer'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"results"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-0479b3{color:#FFA657}.ct-5bc21b{color:#A5D6FF}.ct-a950c2{color:#79C0FF}.ct-3a9681{color:#79C0FF}.ct-d7c5e5{color:#79C0FF}.ct-61fe70{color:#79C0FF}.ct-50d99e{color:#FF7B72}.ct-7fbf47{color:#8B949E}.ct-680997{color:#FFA657}.ct-975d2d{color:#D2A8FF}.ct-2e4590{color:#79C0FF}.ct-7d4034{color:#79C0FF}.ct-353508{color:#79C0FF}.ct-60ccc9{color:#FFA657}.ct-163897{color:#FF7B72}.ct-b0e2e0{color:#D2A8FF}.ct-78ac5e{color:#C9D1D9}.ct-91fca1{color:#FF7B72}.ct-b4da57{color:#A5D6FF}.ct-c91467{color:#C9D1D9}.ct-949cf0{color:#C9D1D9}.ct-c5cafe{color:#FF7B72}.light .ct-c5cafe{color:#859900}.light .ct-949cf0{color:#657B83}.light .ct-c91467{color:#268BD2}.light .ct-b4da57{color:#2AA198}.light .ct-91fca1{color:#073642}.light .ct-78ac5e{color:#657B83}.light .ct-b0e2e0{color:#268BD2}.light .ct-163897{color:#859900}.light .ct-60ccc9{color:#657B83}.light .ct-353508{color:#859900}.light .ct-7d4034{color:#268BD2}.light .ct-2e4590{color:#657B83}.light .ct-975d2d{color:#268BD2}.light .ct-680997{color:#657B83}.light .ct-7fbf47{color:#93A1A1}.light .ct-50d99e{color:#073642}.light .ct-61fe70{color:#268BD2}.light .ct-d7c5e5{color:#D33682}.light .ct-3a9681{color:#859900}.light .ct-a950c2{color:#B58900}.light .ct-5bc21b{color:#2AA198}.light .ct-0479b3{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"getting-smart-contract-instance","depth":2,"text":"Getting smart contract instance"},{"id":"executing-contract-method","depth":2,"text":"Executing contract method","children":[{"id":"example-for-metamask-without-private-key","depth":3,"text":"Example for #Metamask without private key"},{"id":"nodejs-and-react-native-example","depth":3,"text":"Node.js and React Native example"},{"id":"calling-a-batch-of-contracts-methods","depth":3,"text":"Calling a batch of contract's methods"}]},{"id":"subscribing-to-smart-contract-events","depth":2,"text":"Subscribing to smart contract events","children":[{"id":"by-accessing-contractevents","depth":3,"text":"By accessing contract.events"},{"id":"with-filtering","depth":3,"text":"With filtering"},{"id":"common-subscribe-method","depth":3,"text":"Common Subscribe method"},{"id":"getting-event-history","depth":3,"text":"Getting event history"}]}]}},"_type":"markdown","_id":"content:Blockchain:Smart contracts.md","_source":"content","_file":"Blockchain/Smart contracts.md","_extension":"md"},{"_path":"/css/automatic-grid-like-masonry-with-pure-css","_dir":"css","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Automatic Grid Like Masonry With Pure CSS","description":"Grid, that places items by density. Pure #css solution. Can be used with items, that take different amount of rows/columns.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Grid, that places items by density. Pure #css solution. Can be used with items, that take different amount of rows/columns."}]},{"type":"element","tag":"code","props":{"code":"$cell: 250px;\n$gap: 20px;\n\n.grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax($cell, 1fr));\n grid-auto-rows: 256px;\n grid-auto-flow: row dense;\n grid-column-gap: $gap;\n grid-row-gap: $gap;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"$cell: 250px;\n$gap: 20px;\n\n.grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax($cell, 1fr));\n grid-auto-rows: 256px;\n grid-auto-flow: row dense;\n grid-column-gap: $gap;\n grid-row-gap: $gap;\n}\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"basic-elements-with-double-height-or-width"},"children":[{"type":"text","value":"Basic elements with double height or width"}]},{"type":"element","tag":"code","props":{"code":".h-2 { // takes 2 columns\n grid-column-end: span 2;\n}\n\n.v-2 { // takes 2 rows\n grid-row-end: span 2;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":".h-2 { // takes 2 columns\n grid-column-end: span 2;\n}\n\n.v-2 { // takes 2 rows\n grid-row-end: span 2;\n}\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"header-that-fills-all-columns"},"children":[{"type":"text","value":"Header, that fills all columns"}]},{"type":"element","tag":"code","props":{"code":".full-width {\n grid-row: 1 / 2; // height: 1 row\n grid-column: 1 / -1;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":".full-width {\n grid-row: 1 / 2; // height: 1 row\n grid-column: 1 / -1;\n}\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"stamp-element-that-takes-3-rows-in-the-top-right-corner"},"children":[{"type":"text","value":"Stamp element, that takes 3 rows in the top right corner"}]},{"type":"element","tag":"code","props":{"code":".top-right {\n grid-row: 1 / 3; // height here\n grid-column: -2 / -1; // width here\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":".top-right {\n grid-row: 1 / 3; // height here\n grid-column: -2 / -1; // width here\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Grid, that places items by density. Pure #css solution. Can be used with items, that take different amount of rows/columns."}]},{"type":"element","tag":"code","props":{"code":"$cell: 250px;\n$gap: 20px;\n\n.grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax($cell, 1fr));\n grid-auto-rows: 256px;\n grid-auto-flow: row dense;\n grid-column-gap: $gap;\n grid-row-gap: $gap;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-056ebb"},"children":[{"type":"text","value":"$cell: "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"250"}]},{"type":"element","tag":"span","props":{"class":"ct-c67ab6"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-056ebb"},"children":[{"type":"text","value":"$gap: "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"20"}]},{"type":"element","tag":"span","props":{"class":"ct-c67ab6"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-afae65"},"children":[{"type":"text","value":".grid"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-46c41a"},"children":[{"type":"text","value":"display"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-5445d1"},"children":[{"type":"text","value":"grid"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-46c41a"},"children":[{"type":"text","value":"grid-template-columns"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a411fb"},"children":[{"type":"text","value":"repeat"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-0e1737"},"children":[{"type":"text","value":"auto-fit"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-a411fb"},"children":[{"type":"text","value":"minmax"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-0e1737"},"children":[{"type":"text","value":"$cell"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-473b07"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-a21da7"},"children":[{"type":"text","value":"fr"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a351a6"},"children":[{"type":"text","value":"grid-auto-rows"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"256"}]},{"type":"element","tag":"span","props":{"class":"ct-c67ab6"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-46c41a"},"children":[{"type":"text","value":"grid-auto-flow"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-5445d1"},"children":[{"type":"text","value":"row"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5445d1"},"children":[{"type":"text","value":"dense"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-46c41a"},"children":[{"type":"text","value":"grid-column-gap"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0e1737"},"children":[{"type":"text","value":"$gap"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-46c41a"},"children":[{"type":"text","value":"grid-row-gap"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0e1737"},"children":[{"type":"text","value":"$gap"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"basic-elements-with-double-height-or-width"},"children":[{"type":"text","value":"Basic elements with double height or width"}]},{"type":"element","tag":"code","props":{"code":".h-2 { // takes 2 columns\n grid-column-end: span 2;\n}\n\n.v-2 { // takes 2 rows\n grid-row-end: span 2;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-afae65"},"children":[{"type":"text","value":".h-2"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-aeae87"},"children":[{"type":"text","value":"// takes 2 columns"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a351a6"},"children":[{"type":"text","value":"grid-column-end"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a351a6"},"children":[{"type":"text","value":"span"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-afae65"},"children":[{"type":"text","value":".v-2"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-aeae87"},"children":[{"type":"text","value":"// takes 2 rows"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a351a6"},"children":[{"type":"text","value":"grid-row-end"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a351a6"},"children":[{"type":"text","value":"span"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"header-that-fills-all-columns"},"children":[{"type":"text","value":"Header, that fills all columns"}]},{"type":"element","tag":"code","props":{"code":".full-width {\n grid-row: 1 / 2; // height: 1 row\n grid-column: 1 / -1;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-afae65"},"children":[{"type":"text","value":".full-width"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a351a6"},"children":[{"type":"text","value":"grid-row"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c67ab6"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-aeae87"},"children":[{"type":"text","value":"// height: 1 row"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a351a6"},"children":[{"type":"text","value":"grid-column"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" / "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"-1"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"stamp-element-that-takes-3-rows-in-the-top-right-corner"},"children":[{"type":"text","value":"Stamp element, that takes 3 rows in the top right corner"}]},{"type":"element","tag":"code","props":{"code":".top-right {\n grid-row: 1 / 3; // height here\n grid-column: -2 / -1; // width here\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-afae65"},"children":[{"type":"text","value":".top-right"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a351a6"},"children":[{"type":"text","value":"grid-row"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c67ab6"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-aeae87"},"children":[{"type":"text","value":"// height here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a351a6"},"children":[{"type":"text","value":"grid-column"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"-2"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" / "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"-1"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-aeae87"},"children":[{"type":"text","value":"// width here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-aeae87{color:#8B949E}.ct-a351a6{color:#79C0FF}.ct-a21da7{color:#FF7B72}.ct-473b07{color:#79C0FF}.ct-0e1737{color:#FFA657}.ct-a411fb{color:#79C0FF}.ct-5445d1{color:#79C0FF}.ct-46c41a{color:#79C0FF}.ct-880855{color:#C9D1D9}.ct-afae65{color:#79C0FF}.ct-b56a0d{color:#C9D1D9}.ct-c67ab6{color:#FF7B72}.ct-9ec046{color:#79C0FF}.ct-056ebb{color:#FFA657}.light .ct-056ebb{color:#657B83}.light .ct-9ec046{color:#D33682}.light .ct-c67ab6{color:#859900}.light .ct-b56a0d{color:#657B83}.light .ct-afae65{color:#93A1A1}.light .ct-880855{color:#657B83}.light .ct-46c41a{color:#859900}.light .ct-5445d1{color:#657B83}.light .ct-a411fb{color:#268BD2}.light .ct-0e1737{color:#657B83}.light .ct-473b07{color:#D33682}.light .ct-a21da7{color:#859900}.light .ct-a351a6{color:#859900}.light .ct-aeae87{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"basic-elements-with-double-height-or-width","depth":3,"text":"Basic elements with double height or width"},{"id":"header-that-fills-all-columns","depth":3,"text":"Header, that fills all columns"},{"id":"stamp-element-that-takes-3-rows-in-the-top-right-corner","depth":3,"text":"Stamp element, that takes 3 rows in the top right corner"}]}},"_type":"markdown","_id":"content:CSS:Automatic Grid like Masonry with pure CSS.md","_source":"content","_file":"CSS/Automatic Grid like Masonry with pure CSS.md","_extension":"md"},{"_path":"/css/sass-nth-child-iterate-mixin","_dir":"css","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Sass Nth Child Iterate Mixin","description":"Say, we need to color n items by specific colors, which depend on its position. #SCSS supports iteration over lists for that purposes:","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say, we need to color "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"n"}]},{"type":"text","value":" items by specific colors, which depend on its position. #SCSS supports "},{"type":"element","tag":"a","props":{"href":"https://sass-lang.com/documentation/at-rules/control/each","rel":["nofollow"]},"children":[{"type":"text","value":"iteration over lists"}]},{"type":"text","value":" for that purposes:"}]},{"type":"element","tag":"code","props":{"code":"@mixin color-per-child($colors) {\n @each $color in $colors {\n &:nth-child(#{index(($colors), ($color))}) {\n color: $color;\n }\n }\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"@mixin color-per-child($colors) {\n @each $color in $colors {\n &:nth-child(#{index(($colors), ($color))}) {\n color: $color;\n }\n }\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Usage is simple:"}]},{"type":"element","tag":"code","props":{"code":".item {\n @include color_per_child((#ded187, #dbde87, #bade87, #9cde87, #87deaa));\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":".item {\n @include color_per_child((#ded187, #dbde87, #bade87, #9cde87, #87deaa));\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say, we need to color "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"n"}]},{"type":"text","value":" items by specific colors, which depend on its position. #SCSS supports "},{"type":"element","tag":"a","props":{"href":"https://sass-lang.com/documentation/at-rules/control/each","rel":["nofollow"]},"children":[{"type":"text","value":"iteration over lists"}]},{"type":"text","value":" for that purposes:"}]},{"type":"element","tag":"code","props":{"code":"@mixin color-per-child($colors) {\n @each $color in $colors {\n &:nth-child(#{index(($colors), ($color))}) {\n color: $color;\n }\n }\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-41b004"},"children":[{"type":"text","value":"@mixin"}]},{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-304886"},"children":[{"type":"text","value":"color-per-child"}]},{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-432e38"},"children":[{"type":"text","value":"$colors"}]},{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-41b004"},"children":[{"type":"text","value":"@each"}]},{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-432e38"},"children":[{"type":"text","value":"$color"}]},{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-41b004"},"children":[{"type":"text","value":"in"}]},{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-432e38"},"children":[{"type":"text","value":"$colors"}]},{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b6c16d"},"children":[{"type":"text","value":"&"}]},{"type":"element","tag":"span","props":{"class":"ct-ed78e4"},"children":[{"type":"text","value":":nth-child"}]},{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-432e38"},"children":[{"type":"text","value":"#{"}]},{"type":"element","tag":"span","props":{"class":"ct-577ace"},"children":[{"type":"text","value":"index"}]},{"type":"element","tag":"span","props":{"class":"ct-432e38"},"children":[{"type":"text","value":"(($colors), ($color))}"}]},{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a45440"},"children":[{"type":"text","value":"color"}]},{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-432e38"},"children":[{"type":"text","value":"$color"}]},{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Usage is simple:"}]},{"type":"element","tag":"code","props":{"code":".item {\n @include color_per_child((#ded187, #dbde87, #bade87, #9cde87, #87deaa));\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-17b220"},"children":[{"type":"text","value":".item"}]},{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-889b48"},"children":[{"type":"text","value":"@include"}]},{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-93a1a4"},"children":[{"type":"text","value":"color_per_child"}]},{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-042456"},"children":[{"type":"text","value":"#ded187"}]},{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-042456"},"children":[{"type":"text","value":"#dbde87"}]},{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-042456"},"children":[{"type":"text","value":"#bade87"}]},{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-042456"},"children":[{"type":"text","value":"#9cde87"}]},{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-042456"},"children":[{"type":"text","value":"#87deaa"}]},{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-042456{color:#79C0FF}.ct-93a1a4{color:#D2A8FF}.ct-889b48{color:#FF7B72}.ct-17b220{color:#79C0FF}.ct-f78f84{color:#C9D1D9}.ct-a45440{color:#79C0FF}.ct-577ace{color:#79C0FF}.ct-ed78e4{color:#79C0FF}.ct-b6c16d{color:#7EE787}.ct-432e38{color:#FFA657}.ct-304886{color:#D2A8FF}.ct-091587{color:#C9D1D9}.ct-41b004{color:#FF7B72}.light .ct-41b004{color:#859900}.light .ct-091587{color:#657B83}.light .ct-304886{color:#268BD2}.light .ct-432e38{color:#657B83}.light .ct-b6c16d{color:#268BD2}.light .ct-ed78e4{color:#93A1A1}.light .ct-577ace{color:#268BD2}.light .ct-a45440{color:#859900}.light .ct-f78f84{color:#657B83}.light .ct-17b220{color:#93A1A1}.light .ct-889b48{color:#859900}.light .ct-93a1a4{color:#268BD2}.light .ct-042456{color:#CB4B16}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:CSS:Sass nth-child iterate mixin.md","_source":"content","_file":"CSS/Sass nth-child iterate mixin.md","_extension":"md"},{"_path":"/css/test-if-browser-supports-css-rules","_dir":"css","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Test If Browser Supports CSS Rules","description":"To test if browser supports some #CSS rules, do following:","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To test if browser supports some #CSS rules, do following:"}]},{"type":"element","tag":"code","props":{"code":"@supports (backdrop-filter: blur(5px)) {\n backdrop-filter: blur(5px);\n}\n","language":"css"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"@supports (backdrop-filter: blur(5px)) {\n backdrop-filter: blur(5px);\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"@mixin"}]},{"type":"text","value":" will only apply rule if browser support backdrop filtering:"}]},{"type":"element","tag":"code","props":{"code":"@mixin can_backdrop {\n @supports (\n (-webkit-backdrop-filter: blur(5px)) or \n (backdrop-filter: blur(5px))\n ) {\n @content;\n }\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"@mixin can_backdrop {\n @supports (\n (-webkit-backdrop-filter: blur(5px)) or \n (backdrop-filter: blur(5px))\n ) {\n @content;\n }\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To test if browser supports some #CSS rules, do following:"}]},{"type":"element","tag":"code","props":{"code":"@supports (backdrop-filter: blur(5px)) {\n backdrop-filter: blur(5px);\n}\n","language":"css"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a0ae9b"},"children":[{"type":"text","value":"@supports"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-112c18"},"children":[{"type":"text","value":"backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-226639"},"children":[{"type":"text","value":"blur"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-899a6f"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-a0ae9b"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-509371"},"children":[{"type":"text","value":"backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":": blur(5px);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"@mixin"}]},{"type":"text","value":" will only apply rule if browser support backdrop filtering:"}]},{"type":"element","tag":"code","props":{"code":"@mixin can_backdrop {\n @supports (\n (-webkit-backdrop-filter: blur(5px)) or \n (backdrop-filter: blur(5px))\n ) {\n @content;\n }\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a0ae9b"},"children":[{"type":"text","value":"@mixin"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0500fd"},"children":[{"type":"text","value":"can_backdrop"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a0ae9b"},"children":[{"type":"text","value":"@supports"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8b2965"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-6c59f3"},"children":[{"type":"text","value":"-webkit-backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-8b2965"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8e2b82"},"children":[{"type":"text","value":"blur"}]},{"type":"element","tag":"span","props":{"class":"ct-8b2965"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ad4b38"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-7461e6"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-8b2965"},"children":[{"type":"text","value":")) "}]},{"type":"element","tag":"span","props":{"class":"ct-1c5c15"},"children":[{"type":"text","value":"or"}]},{"type":"element","tag":"span","props":{"class":"ct-8b2965"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-112c18"},"children":[{"type":"text","value":"backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-226639"},"children":[{"type":"text","value":"blur"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-899a6f"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-a0ae9b"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a0ae9b"},"children":[{"type":"text","value":"@content"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-1c5c15{color:#79C0FF}.ct-7461e6{color:#FF7B72}.ct-ad4b38{color:#79C0FF}.ct-8e2b82{color:#79C0FF}.ct-6c59f3{color:#79C0FF}.ct-8b2965{color:#C9D1D9}.ct-0500fd{color:#D2A8FF}.ct-509371{color:#7EE787}.ct-899a6f{color:#79C0FF}.ct-226639{color:#79C0FF}.ct-112c18{color:#79C0FF}.ct-c4faf2{color:#C9D1D9}.ct-a0ae9b{color:#FF7B72}.light .ct-a0ae9b{color:#859900}.light .ct-c4faf2{color:#657B83}.light .ct-112c18{color:#859900}.light .ct-226639{color:#268BD2}.light .ct-899a6f{color:#D33682}.light .ct-509371{color:#268BD2}.light .ct-0500fd{color:#268BD2}.light .ct-8b2965{color:#657B83}.light .ct-6c59f3{color:#859900}.light .ct-8e2b82{color:#268BD2}.light .ct-ad4b38{color:#D33682}.light .ct-7461e6{color:#859900}.light .ct-1c5c15{color:#657B83}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:CSS:Test if browser supports CSS rules.md","_source":"content","_file":"CSS/Test if browser supports CSS rules.md","_extension":"md"},{"_path":"/docker/building-static-pages-with-docker","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Building Static Pages With Docker","description":"Sample #Dockerfile for static Typescript builds such a #nextjs, #gatsby or #nuxt:","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sample #Dockerfile for static Typescript builds such a #nextjs, #gatsby or #nuxt:"}]},{"type":"element","tag":"code","props":{"code":"FROM node:16-alpine as builder\nWORKDIR /app\nCOPY package.json yarn.lock ./\nRUN yarn\nCOPY . .\n\n# your generate command here\nRUN yarn generate\n\nFROM nginx\nCOPY --from=builder /app/dist /usr/share/nginx/html\n","language":"Dockerfile"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"FROM node:16-alpine as builder\nWORKDIR /app\nCOPY package.json yarn.lock ./\nRUN yarn\nCOPY . .\n\n# your generate command here\nRUN yarn generate\n\nFROM nginx\nCOPY --from=builder /app/dist /usr/share/nginx/html\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sample #Dockerfile for static Typescript builds such a #nextjs, #gatsby or #nuxt:"}]},{"type":"element","tag":"code","props":{"code":"FROM node:16-alpine as builder\nWORKDIR /app\nCOPY package.json yarn.lock ./\nRUN yarn\nCOPY . .\n\n# your generate command here\nRUN yarn generate\n\nFROM nginx\nCOPY --from=builder /app/dist /usr/share/nginx/html\n","language":"Dockerfile"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"FROM node:16-alpine as builder\nWORKDIR /app\nCOPY package.json yarn.lock ./\nRUN yarn\nCOPY . .\n\n# your generate command here\nRUN yarn generate\n\nFROM nginx\nCOPY --from=builder /app/dist /usr/share/nginx/html"}]}]}]}]}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Docker:Building static pages with Docker.md","_source":"content","_file":"Docker/Building static pages with Docker.md","_extension":"md"},{"_path":"/docker/common-things-with-docker-mailserver","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Common Things With Docker Mailserver","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"1-docker-mailserver-ssl-alert-number-42"},"children":[{"type":"text","value":"1. docker-mailserver SSL alert number 42"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"I was getting following error after setting up TLS certificates in docker-mailserver after setting it up with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"letsencrypt"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"TLS handshaking: SSL_accept() failed: error:14094412:SSL routines:ssl3_read_bytes:sslv3 alert bad certificate: SSL alert number 42\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"TLS handshaking: SSL_accept() failed: error:14094412:SSL routines:ssl3_read_bytes:sslv3 alert bad certificate: SSL alert number 42\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The problem was caused by two reasons"}]},{"type":"element","tag":"h3","props":{"id":"11-letsencrypt-and-wildcard-domains"},"children":[{"type":"text","value":"1.1. Letsencrypt and wildcard domains"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"My "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"MX"}]},{"type":"text","value":" domain was "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"example.com"}]},{"type":"text","value":", bu "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"letsencrypt"}]},{"type":"text","value":" have been set up with wildcard certificate on "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"*.example.com"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"So, specifying "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_MODE=letsencrypt"}]},{"type":"text","value":" made it searching for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/letsencrypt/mail.example.com"}]},{"type":"text","value":", when it was just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/letsencrypt/example.com"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION"}]},{"type":"text","value":":"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change .env file to:"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_MODE=manual"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_KEY_PATH=/etc/letsencrypt/example.com/fullchain.pem"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_KEY_PATH=/etc/letsencrypt/example.com/privkey.pem"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to modify "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-compose"}]},{"type":"text","value":" volumes and pass certs from host filesystem. Note: they're not "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail.example.com"}]},{"type":"text","value":", they're just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"example.com"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"a","props":{"href":"https://github.com/docker-mailserver/docker-mailserver/issues/1607","rel":["nofollow"]},"children":[{"type":"text","value":"ticket"}]},{"type":"text","value":" describes it well."}]},{"type":"element","tag":"h3","props":{"id":"12-docker-was-using-internal-hostname-of-docker-mailserver"},"children":[{"type":"text","value":"1.2. Docker was using internal hostname of docker-mailserver"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Internal hostname for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-mailserver"}]},{"type":"text","value":" was just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail"}]},{"type":"text","value":", and other container tried to send emails to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail:25"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION:"}]},{"type":"text","value":" change internal hostname in your app settings to actual, specified in your certificates and MX record."}]},{"type":"element","tag":"h3","props":{"id":"2-docker-mailserver-not-listening-on-25-port-smtp"},"children":[{"type":"text","value":"2. docker-mailserver not listening on 25 port (SMTP)"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Solution was to add quotes in your docker compose, just like that:"}]},{"type":"element","tag":"code","props":{"code":" ports:\n - \"25:25\"\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" ports:\n - \"25:25\"\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"a","props":{"href":"https://github.com/docker-mailserver/docker-mailserver/issues/684#issuecomment-322029794","rel":["nofollow"]},"children":[{"type":"text","value":"ticket"}]},{"type":"text","value":" solved it"}]},{"type":"element","tag":"h3","props":{"id":"3-connect-to-docker-mailserver-from-other-docker-compose"},"children":[{"type":"text","value":"3. Connect to docker-mailserver from other docker-compose"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"I've had "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mailserver/compose.yaml"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"application/compose.yaml"}]},{"type":"text","value":" and needed to connect "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"application"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mailserver"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"// application/compose.yaml\napp:\n networks:\n - shared\nnetworks:\n shared:\n driver: bridge\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// application/compose.yaml\napp:\n networks:\n - shared\nnetworks:\n shared:\n driver: bridge\n"}]}]}]},{"type":"element","tag":"code","props":{"code":"/// mailserver/compose.yaml\nmail:\n networks:\n - \"application_shared\"\nnetworks:\n application_shared:\n external: true\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"/// mailserver/compose.yaml\nmail:\n networks:\n - \"application_shared\"\nnetworks:\n application_shared:\n external: true\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"4-how-to-convert-dkim-mailtxt-to-dns-record"},"children":[{"type":"text","value":"4. How to convert DKIM mail.txt to DNS record"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"My "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail.txt"}]},{"type":"text","value":" was like:"}]},{"type":"element","tag":"code","props":{"code":"mail._domainkey IN TXT ( \"v=DKIM1; h=sha256; k=rsa; \"\n \"p=sOmEJuNkLiKeRaNdOmOrLikeThat\"\n \"eVeNmOrERANdOmStuFf\" ) ; ----- DKIM key mail for example.com\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"mail._domainkey IN TXT ( \"v=DKIM1; h=sha256; k=rsa; \"\n \"p=sOmEJuNkLiKeRaNdOmOrLikeThat\"\n \"eVeNmOrERANdOmStuFf\" ) ; ----- DKIM key mail for example.com\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION"}]},{"type":"text","value":": concatenate all strings inside round brackets:"}]},{"type":"element","tag":"code","props":{"code":"v=DKIM1; h=sha256; k=rsa; p=sOmEJuNkLiKeRaNdOmOrLikeThateVeNmOrERANdOmStuFf\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"v=DKIM1; h=sha256; k=rsa; p=sOmEJuNkLiKeRaNdOmOrLikeThateVeNmOrERANdOmStuFf\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"And add them as a "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"TXT"}]},{"type":"text","value":" record on my DNS provider control panel under "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail._domainkey"}]},{"type":"text","value":" record."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Solution was right in "},{"type":"element","tag":"a","props":{"href":"https://docker-mailserver.github.io/docker-mailserver/edge/config/best-practices/dkim_dmarc_spf/#dkim-dns","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]},{"type":"text","value":", just hidden a little bit."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"1-docker-mailserver-ssl-alert-number-42"},"children":[{"type":"text","value":"1. docker-mailserver SSL alert number 42"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"I was getting following error after setting up TLS certificates in docker-mailserver after setting it up with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"letsencrypt"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"TLS handshaking: SSL_accept() failed: error:14094412:SSL routines:ssl3_read_bytes:sslv3 alert bad certificate: SSL alert number 42\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"TLS handshaking: SSL_accept() failed: error:14094412:SSL routines:ssl3_read_bytes:sslv3 alert bad certificate: SSL alert number 42"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The problem was caused by two reasons"}]},{"type":"element","tag":"h3","props":{"id":"11-letsencrypt-and-wildcard-domains"},"children":[{"type":"text","value":"1.1. Letsencrypt and wildcard domains"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"My "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"MX"}]},{"type":"text","value":" domain was "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"example.com"}]},{"type":"text","value":", bu "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"letsencrypt"}]},{"type":"text","value":" have been set up with wildcard certificate on "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"*.example.com"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"So, specifying "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_MODE=letsencrypt"}]},{"type":"text","value":" made it searching for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/letsencrypt/mail.example.com"}]},{"type":"text","value":", when it was just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/letsencrypt/example.com"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION"}]},{"type":"text","value":":"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change .env file to:"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_MODE=manual"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_KEY_PATH=/etc/letsencrypt/example.com/fullchain.pem"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_KEY_PATH=/etc/letsencrypt/example.com/privkey.pem"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to modify "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-compose"}]},{"type":"text","value":" volumes and pass certs from host filesystem. Note: they're not "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail.example.com"}]},{"type":"text","value":", they're just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"example.com"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"a","props":{"href":"https://github.com/docker-mailserver/docker-mailserver/issues/1607","rel":["nofollow"]},"children":[{"type":"text","value":"ticket"}]},{"type":"text","value":" describes it well."}]},{"type":"element","tag":"h3","props":{"id":"12-docker-was-using-internal-hostname-of-docker-mailserver"},"children":[{"type":"text","value":"1.2. Docker was using internal hostname of docker-mailserver"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Internal hostname for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-mailserver"}]},{"type":"text","value":" was just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail"}]},{"type":"text","value":", and other container tried to send emails to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail:25"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION:"}]},{"type":"text","value":" change internal hostname in your app settings to actual, specified in your certificates and MX record."}]},{"type":"element","tag":"h3","props":{"id":"2-docker-mailserver-not-listening-on-25-port-smtp"},"children":[{"type":"text","value":"2. docker-mailserver not listening on 25 port (SMTP)"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Solution was to add quotes in your docker compose, just like that:"}]},{"type":"element","tag":"code","props":{"code":" ports:\n - \"25:25\"\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a3d48f"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-b4fc78"},"children":[{"type":"text","value":"\"25:25\""}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"a","props":{"href":"https://github.com/docker-mailserver/docker-mailserver/issues/684#issuecomment-322029794","rel":["nofollow"]},"children":[{"type":"text","value":"ticket"}]},{"type":"text","value":" solved it"}]},{"type":"element","tag":"h3","props":{"id":"3-connect-to-docker-mailserver-from-other-docker-compose"},"children":[{"type":"text","value":"3. Connect to docker-mailserver from other docker-compose"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"I've had "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mailserver/compose.yaml"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"application/compose.yaml"}]},{"type":"text","value":" and needed to connect "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"application"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mailserver"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"// application/compose.yaml\napp:\n networks:\n - shared\nnetworks:\n shared:\n driver: bridge\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b4fc78"},"children":[{"type":"text","value":"// application/compose.yaml"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a3d48f"},"children":[{"type":"text","value":"app"}]},{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a3d48f"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-b4fc78"},"children":[{"type":"text","value":"shared"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a3d48f"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a3d48f"},"children":[{"type":"text","value":"shared"}]},{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a3d48f"},"children":[{"type":"text","value":"driver"}]},{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-b4fc78"},"children":[{"type":"text","value":"bridge"}]}]}]}]}]},{"type":"element","tag":"code","props":{"code":"/// mailserver/compose.yaml\nmail:\n networks:\n - \"application_shared\"\nnetworks:\n application_shared:\n external: true\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b4fc78"},"children":[{"type":"text","value":"/// mailserver/compose.yaml"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a3d48f"},"children":[{"type":"text","value":"mail"}]},{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a3d48f"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-b4fc78"},"children":[{"type":"text","value":"\"application_shared\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a3d48f"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a3d48f"},"children":[{"type":"text","value":"application_shared"}]},{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a3d48f"},"children":[{"type":"text","value":"external"}]},{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ed00fb"},"children":[{"type":"text","value":"true"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"4-how-to-convert-dkim-mailtxt-to-dns-record"},"children":[{"type":"text","value":"4. How to convert DKIM mail.txt to DNS record"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"My "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail.txt"}]},{"type":"text","value":" was like:"}]},{"type":"element","tag":"code","props":{"code":"mail._domainkey IN TXT ( \"v=DKIM1; h=sha256; k=rsa; \"\n \"p=sOmEJuNkLiKeRaNdOmOrLikeThat\"\n \"eVeNmOrERANdOmStuFf\" ) ; ----- DKIM key mail for example.com\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"mail._domainkey IN TXT ( \"v=DKIM1; h=sha256; k=rsa; \"\n \"p=sOmEJuNkLiKeRaNdOmOrLikeThat\"\n \"eVeNmOrERANdOmStuFf\" ) ; ----- DKIM key mail for example.com"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION"}]},{"type":"text","value":": concatenate all strings inside round brackets:"}]},{"type":"element","tag":"code","props":{"code":"v=DKIM1; h=sha256; k=rsa; p=sOmEJuNkLiKeRaNdOmOrLikeThateVeNmOrERANdOmStuFf\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"v=DKIM1; h=sha256; k=rsa; p=sOmEJuNkLiKeRaNdOmOrLikeThateVeNmOrERANdOmStuFf"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"And add them as a "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"TXT"}]},{"type":"text","value":" record on my DNS provider control panel under "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail._domainkey"}]},{"type":"text","value":" record."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Solution was right in "},{"type":"element","tag":"a","props":{"href":"https://docker-mailserver.github.io/docker-mailserver/edge/config/best-practices/dkim_dmarc_spf/#dkim-dns","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]},{"type":"text","value":", just hidden a little bit."}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-ed00fb{color:#79C0FF}.ct-b4fc78{color:#A5D6FF}.ct-a3d48f{color:#7EE787}.ct-28f9a0{color:#C9D1D9}.light .ct-28f9a0{color:#657B83}.light .ct-a3d48f{color:#268BD2}.light .ct-b4fc78{color:#2AA198}.light .ct-ed00fb{color:#B58900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"1-docker-mailserver-ssl-alert-number-42","depth":2,"text":"1. docker-mailserver SSL alert number 42","children":[{"id":"11-letsencrypt-and-wildcard-domains","depth":3,"text":"1.1. Letsencrypt and wildcard domains"},{"id":"12-docker-was-using-internal-hostname-of-docker-mailserver","depth":3,"text":"1.2. Docker was using internal hostname of docker-mailserver"},{"id":"2-docker-mailserver-not-listening-on-25-port-smtp","depth":3,"text":"2. docker-mailserver not listening on 25 port (SMTP)"},{"id":"3-connect-to-docker-mailserver-from-other-docker-compose","depth":3,"text":"3. Connect to docker-mailserver from other docker-compose"},{"id":"4-how-to-convert-dkim-mailtxt-to-dns-record","depth":3,"text":"4. How to convert DKIM mail.txt to DNS record"}]}]}},"_type":"markdown","_id":"content:Docker:Common things with docker-mailserver.md","_source":"content","_file":"Docker/Common things with docker-mailserver.md","_extension":"md"},{"_path":"/docker/drone-ci","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Drone Ci","description":"Can be used with Private docker registry to deploy things using #docker.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Can be used with "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"Private docker registry"}]},{"type":"text","value":" to deploy things using #docker."}]},{"type":"element","tag":"h2","props":{"id":"pushing-to-private-docker_registry"},"children":[{"type":"text","value":"Pushing to private docker_registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should specify "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_login"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_password"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_registry"}]},{"type":"text","value":" organizations variables in your "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"drone"}]},{"type":"text","value":". And "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker_repo"}]},{"type":"text","value":" variable for your repo as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker.yourdomain.com/your-image"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is example of "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".droneci"}]},{"type":"text","value":" for "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"private docker registry"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build-master\n image: plugins/docker\n when:\n branch:\n - master\n settings:\n dockerfile: Dockerfile\n tag:\n - ${DRONE_BRANCH}\n username:\n from_secret: global_docker_login\n password:\n from_secret: global_docker_password\n registry:\n from_secret: global_docker_registry\n repo:\n from_secret: docker_repo\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build-master\n image: plugins/docker\n when:\n branch:\n - master\n settings:\n dockerfile: Dockerfile\n tag:\n - ${DRONE_BRANCH}\n username:\n from_secret: global_docker_login\n password:\n from_secret: global_docker_password\n registry:\n from_secret: global_docker_registry\n repo:\n from_secret: docker_repo\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"docker-compose-file-for-drone-ci"},"children":[{"type":"text","value":"Docker-compose file for drone-ci"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone"}]},{"type":"text","value":" service is ui itself and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone-agent"}]},{"type":"text","value":" is runner for builds, that can be started on different machine (or machines)."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"secret_id"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"rpc_secret"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone.url"}]},{"type":"text","value":" to something you like."}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nservices:\n drone:\n container_name: drone\n image: drone/drone:latest\n environment:\n - DRONE_GITHUB_CLIENT_ID=secret_id\n - DRONE_GITHUB_CLIENT_SECRET=client_secret\n - DRONE_RPC_SECRET=rpc_secret\n - DRONE_SERVER_HOST=drone.url\n - DRONE_USER_CREATE=\"username:user,admin:true\"\n - DRONE_SERVER_PROTO=https\n - DRONE_TLS_AUTOCERT=false\n - DRONE_GIT_ALWAYS_AUTH=false\n - DRONE_LOGS_DEBUG=true\n - DRONE_LOGS_TRACE=true\n restart: always\n volumes:\n - ./data:/data\n ports:\n - 8090:80\n drone-agent:\n container_name: drone__agent\n image: drone/agent:latest\n command: agent\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n environment:\n - DRONE_RPC_SERVER=https://drone.url\n - DRONE_RPC_SECRET=rpc_secret\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: \"3\"\n\nservices:\n drone:\n container_name: drone\n image: drone/drone:latest\n environment:\n - DRONE_GITHUB_CLIENT_ID=secret_id\n - DRONE_GITHUB_CLIENT_SECRET=client_secret\n - DRONE_RPC_SECRET=rpc_secret\n - DRONE_SERVER_HOST=drone.url\n - DRONE_USER_CREATE=\"username:user,admin:true\"\n - DRONE_SERVER_PROTO=https\n - DRONE_TLS_AUTOCERT=false\n - DRONE_GIT_ALWAYS_AUTH=false\n - DRONE_LOGS_DEBUG=true\n - DRONE_LOGS_TRACE=true\n restart: always\n volumes:\n - ./data:/data\n ports:\n - 8090:80\n drone-agent:\n container_name: drone__agent\n image: drone/agent:latest\n command: agent\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n environment:\n - DRONE_RPC_SERVER=https://drone.url\n - DRONE_RPC_SECRET=rpc_secret\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"caching-builds"},"children":[{"type":"text","value":"Caching builds"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Haven't checked that yet, but there's a "},{"type":"element","tag":"a","props":{"href":"https://laszlo.cloud/the-ultimate-droneci-caching-guide","rel":["nofollow"]},"children":[{"type":"text","value":"manual"}]},{"type":"text","value":" from "},{"type":"element","tag":"a","props":{"href":"https://laszlo.cloud/","rel":["nofollow"]},"children":[{"type":"text","value":"Laszlo Fogas"}]},{"type":"text","value":" about that."}]},{"type":"element","tag":"h2","props":{"id":"get-user-info"},"children":[{"type":"text","value":"Get user info"}]},{"type":"element","tag":"code","props":{"code":"export DRONE_SERVER=https://drone.url\nexport DRONE_TOKEN=password\ndrone info\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"export DRONE_SERVER=https://drone.url\nexport DRONE_TOKEN=password\ndrone info\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"mark-user-as-trusted"},"children":[{"type":"text","value":"Mark user as trusted"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes it won't help, then connect to drone database with sqlite and change user's trusted flag to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"1"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"drone repo update $1 --trusted=true && drone repo info $1\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"drone repo update $1 --trusted=true && drone repo info $1\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Can be used with "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"Private docker registry"}]},{"type":"text","value":" to deploy things using #docker."}]},{"type":"element","tag":"h2","props":{"id":"pushing-to-private-docker_registry"},"children":[{"type":"text","value":"Pushing to private docker_registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should specify "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_login"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_password"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_registry"}]},{"type":"text","value":" organizations variables in your "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"drone"}]},{"type":"text","value":". And "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker_repo"}]},{"type":"text","value":" variable for your repo as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker.yourdomain.com/your-image"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is example of "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".droneci"}]},{"type":"text","value":" for "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"private docker registry"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build-master\n image: plugins/docker\n when:\n branch:\n - master\n settings:\n dockerfile: Dockerfile\n tag:\n - ${DRONE_BRANCH}\n username:\n from_secret: global_docker_login\n password:\n from_secret: global_docker_password\n registry:\n from_secret: global_docker_registry\n repo:\n from_secret: docker_repo\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"kind"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"pipeline"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"build"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"docker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"platform"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"os"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"linux"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"arch"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"amd64"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"steps"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"build-master"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"plugins/docker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"when"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"branch"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"master"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"settings"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"dockerfile"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"Dockerfile"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"tag"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"${DRONE_BRANCH}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"username"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"global_docker_login"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"password"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"global_docker_password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"registry"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"global_docker_registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"repo"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"docker_repo"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"docker-compose-file-for-drone-ci"},"children":[{"type":"text","value":"Docker-compose file for drone-ci"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone"}]},{"type":"text","value":" service is ui itself and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone-agent"}]},{"type":"text","value":" is runner for builds, that can be started on different machine (or machines)."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"secret_id"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"rpc_secret"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone.url"}]},{"type":"text","value":" to something you like."}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nservices:\n drone:\n container_name: drone\n image: drone/drone:latest\n environment:\n - DRONE_GITHUB_CLIENT_ID=secret_id\n - DRONE_GITHUB_CLIENT_SECRET=client_secret\n - DRONE_RPC_SECRET=rpc_secret\n - DRONE_SERVER_HOST=drone.url\n - DRONE_USER_CREATE=\"username:user,admin:true\"\n - DRONE_SERVER_PROTO=https\n - DRONE_TLS_AUTOCERT=false\n - DRONE_GIT_ALWAYS_AUTH=false\n - DRONE_LOGS_DEBUG=true\n - DRONE_LOGS_TRACE=true\n restart: always\n volumes:\n - ./data:/data\n ports:\n - 8090:80\n drone-agent:\n container_name: drone__agent\n image: drone/agent:latest\n command: agent\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n environment:\n - DRONE_RPC_SERVER=https://drone.url\n - DRONE_RPC_SECRET=rpc_secret\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"\"3\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"drone"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"drone"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"drone/drone:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_GITHUB_CLIENT_ID=secret_id"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_GITHUB_CLIENT_SECRET=client_secret"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_RPC_SECRET=rpc_secret"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_SERVER_HOST=drone.url"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_USER_CREATE=\"username:user,admin:true\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_SERVER_PROTO=https"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_TLS_AUTOCERT=false"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_GIT_ALWAYS_AUTH=false"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_LOGS_DEBUG=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_LOGS_TRACE=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"./data:/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"8090:80"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"drone-agent"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"drone__agent"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"drone/agent:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"command"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"agent"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"/var/run/docker.sock:/var/run/docker.sock"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_RPC_SERVER=https://drone.url"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_RPC_SECRET=rpc_secret"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"caching-builds"},"children":[{"type":"text","value":"Caching builds"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Haven't checked that yet, but there's a "},{"type":"element","tag":"a","props":{"href":"https://laszlo.cloud/the-ultimate-droneci-caching-guide","rel":["nofollow"]},"children":[{"type":"text","value":"manual"}]},{"type":"text","value":" from "},{"type":"element","tag":"a","props":{"href":"https://laszlo.cloud/","rel":["nofollow"]},"children":[{"type":"text","value":"Laszlo Fogas"}]},{"type":"text","value":" about that."}]},{"type":"element","tag":"h2","props":{"id":"get-user-info"},"children":[{"type":"text","value":"Get user info"}]},{"type":"element","tag":"code","props":{"code":"export DRONE_SERVER=https://drone.url\nexport DRONE_TOKEN=password\ndrone info\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-18f58a"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" DRONE_SERVER=https://drone.url"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-18f58a"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" DRONE_TOKEN=password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":"drone info"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"mark-user-as-trusted"},"children":[{"type":"text","value":"Mark user as trusted"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes it won't help, then connect to drone database with sqlite and change user's trusted flag to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"1"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"drone repo update $1 --trusted=true && drone repo info $1\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":"drone repo update "}]},{"type":"element","tag":"span","props":{"class":"ct-3cdac0"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-327cdc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" --trusted=true "}]},{"type":"element","tag":"span","props":{"class":"ct-f84443"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" drone repo info "}]},{"type":"element","tag":"span","props":{"class":"ct-3cdac0"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-327cdc"},"children":[{"type":"text","value":"1"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-f84443{color:#FF7B72}.ct-327cdc{color:#C9D1D9}.ct-3cdac0{color:#C9D1D9}.ct-18f58a{color:#FF7B72}.ct-dd39ce{color:#A5D6FF}.ct-f2462a{color:#C9D1D9}.ct-2411f6{color:#7EE787}.light .ct-2411f6{color:#268BD2}.light .ct-f2462a{color:#657B83}.light .ct-dd39ce{color:#2AA198}.light .ct-18f58a{color:#073642}.light .ct-3cdac0{color:#859900}.light .ct-327cdc{color:#268BD2}.light .ct-f84443{color:#859900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"pushing-to-private-docker_registry","depth":2,"text":"Pushing to private docker_registry"},{"id":"docker-compose-file-for-drone-ci","depth":2,"text":"Docker-compose file for drone-ci"},{"id":"caching-builds","depth":2,"text":"Caching builds"},{"id":"get-user-info","depth":2,"text":"Get user info"},{"id":"mark-user-as-trusted","depth":2,"text":"Mark user as trusted"}]}},"_type":"markdown","_id":"content:Docker:Drone-ci.md","_source":"content","_file":"Docker/Drone-ci.md","_extension":"md"},{"_path":"/docker/github-pages-with-drone-ci","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Github Pages With Drone Ci","description":"To deploy github pages with Drone-ci you will need .drone.yml as specified below. You also should define secrets github_username and github_token (get it here) in your drone's repository setup.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To deploy github pages with "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":" you will need "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".drone.yml"}]},{"type":"text","value":" as specified below. You also should define secrets "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"github_username"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"github_token"}]},{"type":"text","value":" (get it "},{"type":"element","tag":"a","props":{"href":"https://github.com/settings/tokens","rel":["nofollow"]},"children":[{"type":"text","value":"here"}]},{"type":"text","value":") in your drone's repository setup."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Github repository should be named as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"yourname.github.io"}]},{"type":"text","value":" and it could be accessed at "},{"type":"element","tag":"a","props":{"href":"https://yourname.github.io/","rel":["nofollow"]},"children":[{"type":"text","value":"https://yourname.github.io/"}]},{"type":"text","value":". Otherwise it'll be available at "},{"type":"element","tag":"a","props":{"href":"https://yourname.github.io/repo-name/","rel":["nofollow"]},"children":[{"type":"text","value":"https://yourname.github.io/repo-name/"}]},{"type":"text","value":", what you might not like."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should create branch named "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gh-pages"}]},{"type":"text","value":" in that repo and setup GH Pages at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https://github.com//.github.io/settings/pages"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This config will update "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gh-pages"}]},{"type":"text","value":" branch in your project, which will contain only generated content. I know, that's bad, but there's no better way to do that with generic drone plugins."}]},{"type":"element","tag":"code","props":{"code":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build\n image: node:16\n commands:\n - yarn\n - yarn generate\n - rm -rf ./docs\n - mv ./.output/public ./docs\n - touch ./docs/.nojekyll\n - name: publish\n image: plugins/gh-pages\n settings:\n target_branch: gh-pages\n username:\n from_secret: github_username\n password:\n from_secret: github_token\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build\n image: node:16\n commands:\n - yarn\n - yarn generate\n - rm -rf ./docs\n - mv ./.output/public ./docs\n - touch ./docs/.nojekyll\n - name: publish\n image: plugins/gh-pages\n settings:\n target_branch: gh-pages\n username:\n from_secret: github_username\n password:\n from_secret: github_token\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Here we're moving "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./.output/public"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./docs"}]},{"type":"text","value":", because #nuxt creates symlink for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docs"}]},{"type":"text","value":" and git can't work with that."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Also we create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".nojekyll"}]},{"type":"text","value":" at the root of repo, so github's internal engine won't "},{"type":"element","tag":"a","props":{"href":"https://github.blog/2009-12-29-bypassing-jekyll-on-github-pages/","rel":["nofollow"]},"children":[{"type":"text","value":"ignore files that start with underscore"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"additional-reading"},"children":[{"type":"text","value":"Additional reading"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://plugins.drone.io/plugins/gh-pages","rel":["nofollow"]},"children":[{"type":"text","value":"Drone Github Pages Documentation"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.blog/2009-12-29-bypassing-jekyll-on-github-pages/","rel":["nofollow"]},"children":[{"type":"text","value":"Bypassing Jekyll on GitHub Pages"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To deploy github pages with "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":" you will need "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".drone.yml"}]},{"type":"text","value":" as specified below. You also should define secrets "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"github_username"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"github_token"}]},{"type":"text","value":" (get it "},{"type":"element","tag":"a","props":{"href":"https://github.com/settings/tokens","rel":["nofollow"]},"children":[{"type":"text","value":"here"}]},{"type":"text","value":") in your drone's repository setup."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Github repository should be named as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"yourname.github.io"}]},{"type":"text","value":" and it could be accessed at "},{"type":"element","tag":"a","props":{"href":"https://yourname.github.io/","rel":["nofollow"]},"children":[{"type":"text","value":"https://yourname.github.io/"}]},{"type":"text","value":". Otherwise it'll be available at "},{"type":"element","tag":"a","props":{"href":"https://yourname.github.io/repo-name/","rel":["nofollow"]},"children":[{"type":"text","value":"https://yourname.github.io/repo-name/"}]},{"type":"text","value":", what you might not like."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should create branch named "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gh-pages"}]},{"type":"text","value":" in that repo and setup GH Pages at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https://github.com//.github.io/settings/pages"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This config will update "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gh-pages"}]},{"type":"text","value":" branch in your project, which will contain only generated content. I know, that's bad, but there's no better way to do that with generic drone plugins."}]},{"type":"element","tag":"code","props":{"code":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build\n image: node:16\n commands:\n - yarn\n - yarn generate\n - rm -rf ./docs\n - mv ./.output/public ./docs\n - touch ./docs/.nojekyll\n - name: publish\n image: plugins/gh-pages\n settings:\n target_branch: gh-pages\n username:\n from_secret: github_username\n password:\n from_secret: github_token\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"kind"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"pipeline"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"build"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"docker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"platform"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"os"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"linux"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"arch"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"amd64"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"steps"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"build"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"node:16"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"commands"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"yarn"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"yarn generate"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"rm -rf ./docs"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"mv ./.output/public ./docs"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"touch ./docs/.nojekyll"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"publish"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"plugins/gh-pages"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"settings"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"target_branch"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"gh-pages"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"username"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"github_username"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"password"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"github_token"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Here we're moving "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./.output/public"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./docs"}]},{"type":"text","value":", because #nuxt creates symlink for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docs"}]},{"type":"text","value":" and git can't work with that."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Also we create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".nojekyll"}]},{"type":"text","value":" at the root of repo, so github's internal engine won't "},{"type":"element","tag":"a","props":{"href":"https://github.blog/2009-12-29-bypassing-jekyll-on-github-pages/","rel":["nofollow"]},"children":[{"type":"text","value":"ignore files that start with underscore"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"additional-reading"},"children":[{"type":"text","value":"Additional reading"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://plugins.drone.io/plugins/gh-pages","rel":["nofollow"]},"children":[{"type":"text","value":"Drone Github Pages Documentation"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.blog/2009-12-29-bypassing-jekyll-on-github-pages/","rel":["nofollow"]},"children":[{"type":"text","value":"Bypassing Jekyll on GitHub Pages"}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-660a6f{color:#A5D6FF}.ct-7fc260{color:#C9D1D9}.ct-ff0620{color:#7EE787}.light .ct-ff0620{color:#268BD2}.light .ct-7fc260{color:#657B83}.light .ct-660a6f{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"additional-reading","depth":2,"text":"Additional reading"}]}},"_type":"markdown","_id":"content:Docker:Github pages with drone-ci.md","_source":"content","_file":"Docker/Github pages with drone-ci.md","_extension":"md"},{"_path":"/docker/private-docker-registry","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Private Docker Registry","description":"Suitable to work with Drone-ci for hosting private #docker images.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Suitable to work with "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":" for hosting private #docker images."}]},{"type":"element","tag":"h2","props":{"id":"sample-docker-compose-for-custom-docker-registry"},"children":[{"type":"text","value":"Sample docker-compose for custom docker registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This one brings up private docker registry with ui. First you'll need to generate password for it:"}]},{"type":"element","tag":"code","props":{"code":"docker run \\\n --entrypoint htpasswd registry:2 \\\n -Bbn user mypassword > auth/registry.password\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"docker run \\\n --entrypoint htpasswd registry:2 \\\n -Bbn user mypassword > auth/registry.password\n"}]}]}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\nservices:\n registry:\n container_name: docker__registry\n image: registry:2\n ports:\n - 5000:5000\n restart: always\n environment:\n - REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=/data\n - REGISTRY_AUTH=htpasswd\n - REGISTRY_AUTH_HTPASSWD_REALM=Registry\n - REGISTRY_AUTH_HTPASSWD_PATH=/auth/registry.password\n - REGISTRY_HTTP_SECRET=password\n - REGISTRY_STORAGE_DELETE_ENABLED=true\n volumes:\n - ./registry/auth:/auth\n - ./registry/data:/data\n ui:\n container_name: docker__ui\n image: parabuzzle/craneoperator:latest\n ports:\n - 80:80\n restart: always\n environment:\n - REGISTRY_HOST=registry\n - REGISTRY_PORT=5000\n - REGISTRY_PROTOCOL=http\n - ALLOW_REGISTRY_LOGIN=true\n - REGISTRY_ALLOW_DELETE=true\n - USERNAME=registry\n - PASSWORD=password\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: \"3\"\nservices:\n registry:\n container_name: docker__registry\n image: registry:2\n ports:\n - 5000:5000\n restart: always\n environment:\n - REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=/data\n - REGISTRY_AUTH=htpasswd\n - REGISTRY_AUTH_HTPASSWD_REALM=Registry\n - REGISTRY_AUTH_HTPASSWD_PATH=/auth/registry.password\n - REGISTRY_HTTP_SECRET=password\n - REGISTRY_STORAGE_DELETE_ENABLED=true\n volumes:\n - ./registry/auth:/auth\n - ./registry/data:/data\n ui:\n container_name: docker__ui\n image: parabuzzle/craneoperator:latest\n ports:\n - 80:80\n restart: always\n environment:\n - REGISTRY_HOST=registry\n - REGISTRY_PORT=5000\n - REGISTRY_PROTOCOL=http\n - ALLOW_REGISTRY_LOGIN=true\n - REGISTRY_ALLOW_DELETE=true\n - USERNAME=registry\n - PASSWORD=password\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"squash-layers-on-registry"},"children":[{"type":"text","value":"Squash layers on registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you need to squash all layers in docker registry to free up disk space."}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Run this command to mark oldest layers"}]}]},{"type":"element","tag":"code","props":{"code":"# Try this first\ndocker run \\\n --rm anoxis/registry-cli \\\n -r https://registry.url \\\n -l user:password \\\n --delete \\\n --num 2\n\n# Then this \ndocker run -it \\\n -v /path/to/registry/data:/registry \\\n -e REGISTRY_URL=https://registry.url \\\n -e DRY_RUN=\"false\" \\\n -e REGISTRY_AUTH=\"user:password\" \\\n mortensrasmussen/docker-registry-manifest-cleanup\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"# Try this first\ndocker run \\\n --rm anoxis/registry-cli \\\n -r https://registry.url \\\n -l user:password \\\n --delete \\\n --num 2\n\n# Then this \ndocker run -it \\\n -v /path/to/registry/data:/registry \\\n -e REGISTRY_URL=https://registry.url \\\n -e DRY_RUN=\"false\" \\\n -e REGISTRY_AUTH=\"user:password\" \\\n mortensrasmussen/docker-registry-manifest-cleanup\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Suitable to work with "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":" for hosting private #docker images."}]},{"type":"element","tag":"h2","props":{"id":"sample-docker-compose-for-custom-docker-registry"},"children":[{"type":"text","value":"Sample docker-compose for custom docker registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This one brings up private docker registry with ui. First you'll need to generate password for it:"}]},{"type":"element","tag":"code","props":{"code":"docker run \\\n --entrypoint htpasswd registry:2 \\\n -Bbn user mypassword > auth/registry.password\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":"docker run \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" --entrypoint htpasswd registry:2 \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" -Bbn user mypassword "}]},{"type":"element","tag":"span","props":{"class":"ct-8ef278"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" auth/registry.password"}]}]}]}]}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\nservices:\n registry:\n container_name: docker__registry\n image: registry:2\n ports:\n - 5000:5000\n restart: always\n environment:\n - REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=/data\n - REGISTRY_AUTH=htpasswd\n - REGISTRY_AUTH_HTPASSWD_REALM=Registry\n - REGISTRY_AUTH_HTPASSWD_PATH=/auth/registry.password\n - REGISTRY_HTTP_SECRET=password\n - REGISTRY_STORAGE_DELETE_ENABLED=true\n volumes:\n - ./registry/auth:/auth\n - ./registry/data:/data\n ui:\n container_name: docker__ui\n image: parabuzzle/craneoperator:latest\n ports:\n - 80:80\n restart: always\n environment:\n - REGISTRY_HOST=registry\n - REGISTRY_PORT=5000\n - REGISTRY_PROTOCOL=http\n - ALLOW_REGISTRY_LOGIN=true\n - REGISTRY_ALLOW_DELETE=true\n - USERNAME=registry\n - PASSWORD=password\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"\"3\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"registry"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"docker__registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"registry:2"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"5000:5000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"REGISTRY_AUTH=htpasswd"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"REGISTRY_AUTH_HTPASSWD_REALM=Registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"REGISTRY_AUTH_HTPASSWD_PATH=/auth/registry.password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"REGISTRY_HTTP_SECRET=password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"REGISTRY_STORAGE_DELETE_ENABLED=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"./registry/auth:/auth"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"./registry/data:/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"ui"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"docker__ui"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"parabuzzle/craneoperator:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"80:80"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"REGISTRY_HOST=registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"REGISTRY_PORT=5000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"REGISTRY_PROTOCOL=http"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"ALLOW_REGISTRY_LOGIN=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"REGISTRY_ALLOW_DELETE=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"USERNAME=registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"PASSWORD=password"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"squash-layers-on-registry"},"children":[{"type":"text","value":"Squash layers on registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you need to squash all layers in docker registry to free up disk space."}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Run this command to mark oldest layers"}]}]},{"type":"element","tag":"code","props":{"code":"# Try this first\ndocker run \\\n --rm anoxis/registry-cli \\\n -r https://registry.url \\\n -l user:password \\\n --delete \\\n --num 2\n\n# Then this \ndocker run -it \\\n -v /path/to/registry/data:/registry \\\n -e REGISTRY_URL=https://registry.url \\\n -e DRY_RUN=\"false\" \\\n -e REGISTRY_AUTH=\"user:password\" \\\n mortensrasmussen/docker-registry-manifest-cleanup\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-116223"},"children":[{"type":"text","value":"# Try this first"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":"docker run \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" --rm anoxis/registry-cli \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" -r https://registry.url \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" -l user:password \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" --delete \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" --num 2"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-116223"},"children":[{"type":"text","value":"# Then this "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":"docker run -it \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" -v /path/to/registry/data:/registry \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" -e REGISTRY_URL=https://registry.url \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" -e DRY_RUN="}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" -e REGISTRY_AUTH="}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"\"user:password\""}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" mortensrasmussen/docker-registry-manifest-cleanup"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-116223{color:#8B949E}.ct-8c53f0{color:#A5D6FF}.ct-5cf510{color:#7EE787}.ct-8ef278{color:#FF7B72}.ct-c7c611{color:#C9D1D9}.light .ct-c7c611{color:#657B83}.light .ct-8ef278{color:#859900}.light .ct-5cf510{color:#268BD2}.light .ct-8c53f0{color:#2AA198}.light .ct-116223{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"sample-docker-compose-for-custom-docker-registry","depth":2,"text":"Sample docker-compose for custom docker registry"},{"id":"squash-layers-on-registry","depth":2,"text":"Squash layers on registry"}]}},"_type":"markdown","_id":"content:Docker:Private docker registry.md","_source":"content","_file":"Docker/Private docker registry.md","_extension":"md"},{"_path":"/docker/refresh-containers-on-pull","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Refresh Containers On Pull","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"setting-up-watchtower"},"children":[{"type":"text","value":"Setting up watchtower"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://containrrr.dev/watchtower/","rel":["nofollow"]},"children":[{"type":"text","value":"Watchtower"}]},{"type":"text","value":" will automatically pull updated #docker containers. Can be used with "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"Private docker registry"}]},{"type":"text","value":" and "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nservices:\n watchtower:\n container_name: docker__watchtower\n image: v2tec/watchtower\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n - /home/user/.docker/config.json:/config.json\n command: --interval 60 image_1 image_2\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: \"3\"\n\nservices:\n watchtower:\n container_name: docker__watchtower\n image: v2tec/watchtower\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n - /home/user/.docker/config.json:/config.json\n command: --interval 60 image_1 image_2\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"setting-up-watchtower"},"children":[{"type":"text","value":"Setting up watchtower"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://containrrr.dev/watchtower/","rel":["nofollow"]},"children":[{"type":"text","value":"Watchtower"}]},{"type":"text","value":" will automatically pull updated #docker containers. Can be used with "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"Private docker registry"}]},{"type":"text","value":" and "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nservices:\n watchtower:\n container_name: docker__watchtower\n image: v2tec/watchtower\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n - /home/user/.docker/config.json:/config.json\n command: --interval 60 image_1 image_2\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5e83ab"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8f1978"},"children":[{"type":"text","value":"\"3\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5e83ab"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e83ab"},"children":[{"type":"text","value":"watchtower"}]},{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e83ab"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8f1978"},"children":[{"type":"text","value":"docker__watchtower"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e83ab"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8f1978"},"children":[{"type":"text","value":"v2tec/watchtower"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e83ab"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8f1978"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e83ab"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8f1978"},"children":[{"type":"text","value":"/var/run/docker.sock:/var/run/docker.sock"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8f1978"},"children":[{"type":"text","value":"/home/user/.docker/config.json:/config.json"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e83ab"},"children":[{"type":"text","value":"command"}]},{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8f1978"},"children":[{"type":"text","value":"--interval 60 image_1 image_2"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-8f1978{color:#A5D6FF}.ct-d50eff{color:#C9D1D9}.ct-5e83ab{color:#7EE787}.light .ct-5e83ab{color:#268BD2}.light .ct-d50eff{color:#657B83}.light .ct-8f1978{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"setting-up-watchtower","depth":2,"text":"Setting up watchtower"}]}},"_type":"markdown","_id":"content:Docker:Refresh containers on pull.md","_source":"content","_file":"Docker/Refresh containers on pull.md","_extension":"md"},{"_path":"/docker/seed-dump-inside-docker","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Seed Dump Inside Docker","description":"If you need to seed .sql dump in #docker container, just run this command. Also you can try to rsync file with SSH to get it from remote host.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If you need to seed "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".sql"}]},{"type":"text","value":" dump in #docker container, just run this command. Also you can try to "},{"type":"element","tag":"a","props":{"href":"/linux/Rsync%20file%20with%20SSH"},"children":[{"type":"text","value":"rsync file with SSH"}]},{"type":"text","value":" to get it from remote host."}]},{"type":"element","tag":"code","props":{"code":"#####\n# usage: ./script.sh \"/path/to/dump.sql\"\n#####\n\nDUMP_PATH=$1\nCONTAINER=\"db\"\nUSER=root\nPASSWORD=password\nDB=database\n\ncat \"$DUMP_PATH\" | docker exec -i $CONTAINER mysql -u$USER -p$PASSWORD $DB\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"#####\n# usage: ./script.sh \"/path/to/dump.sql\"\n#####\n\nDUMP_PATH=$1\nCONTAINER=\"db\"\nUSER=root\nPASSWORD=password\nDB=database\n\ncat \"$DUMP_PATH\" | docker exec -i $CONTAINER mysql -u$USER -p$PASSWORD $DB\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If you need to seed "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".sql"}]},{"type":"text","value":" dump in #docker container, just run this command. Also you can try to "},{"type":"element","tag":"a","props":{"href":"/linux/Rsync%20file%20with%20SSH"},"children":[{"type":"text","value":"rsync file with SSH"}]},{"type":"text","value":" to get it from remote host."}]},{"type":"element","tag":"code","props":{"code":"#####\n# usage: ./script.sh \"/path/to/dump.sql\"\n#####\n\nDUMP_PATH=$1\nCONTAINER=\"db\"\nUSER=root\nPASSWORD=password\nDB=database\n\ncat \"$DUMP_PATH\" | docker exec -i $CONTAINER mysql -u$USER -p$PASSWORD $DB\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-835db9"},"children":[{"type":"text","value":"#####"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-835db9"},"children":[{"type":"text","value":"# usage: ./script.sh \"/path/to/dump.sql\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-835db9"},"children":[{"type":"text","value":"#####"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":"DUMP_PATH="}]},{"type":"element","tag":"span","props":{"class":"ct-fb993e"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-0d02f9"},"children":[{"type":"text","value":"1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":"CONTAINER="}]},{"type":"element","tag":"span","props":{"class":"ct-192c0b"},"children":[{"type":"text","value":"\"db\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":"USER=root"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":"PASSWORD=password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":"DB=database"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":"cat "}]},{"type":"element","tag":"span","props":{"class":"ct-192c0b"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-fb993e"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-0d02f9"},"children":[{"type":"text","value":"DUMP_PATH"}]},{"type":"element","tag":"span","props":{"class":"ct-192c0b"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6812d8"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":" docker "}]},{"type":"element","tag":"span","props":{"class":"ct-d59a0f"},"children":[{"type":"text","value":"exec"}]},{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":" -i "}]},{"type":"element","tag":"span","props":{"class":"ct-fb993e"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-0d02f9"},"children":[{"type":"text","value":"CONTAINER"}]},{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":" mysql -u"}]},{"type":"element","tag":"span","props":{"class":"ct-fb993e"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-0d02f9"},"children":[{"type":"text","value":"USER"}]},{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":" -p"}]},{"type":"element","tag":"span","props":{"class":"ct-fb993e"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-0d02f9"},"children":[{"type":"text","value":"PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fb993e"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-0d02f9"},"children":[{"type":"text","value":"DB"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-d59a0f{color:#79C0FF}.ct-6812d8{color:#FF7B72}.ct-192c0b{color:#A5D6FF}.ct-0d02f9{color:#C9D1D9}.ct-fb993e{color:#C9D1D9}.ct-1df564{color:#C9D1D9}.ct-835db9{color:#8B949E}.light .ct-835db9{color:#93A1A1}.light .ct-1df564{color:#657B83}.light .ct-fb993e{color:#859900}.light .ct-0d02f9{color:#268BD2}.light .ct-192c0b{color:#2AA198}.light .ct-6812d8{color:#859900}.light .ct-d59a0f{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Docker:Seed dump inside docker.md","_source":"content","_file":"Docker/Seed dump inside docker.md","_extension":"md"},{"_path":"/docker/wait-for-mysql","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Wait For Mysql","description":"wait-for-it.sh doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before #mysql is ready to accept connections","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vishnubob/wait-for-it","rel":["nofollow"]},"children":[{"type":"text","value":"wait-for-it.sh"}]},{"type":"text","value":" doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before #mysql is ready to accept connections"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This script waits for first successful query from database or exits with non-zero status after timeout."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$query"}]},{"type":"text","value":" for the actually working one."}]},{"type":"element","tag":"code","props":{"code":"# Waits for mysql to become actually available\nwait_for_mysql() {\n query=\"SELECT count(*) FROM users\"\n \n timeout=180 # 3 minutes limit\n i=0\n \n while ! docker exec -it \"$1\" mysql --user=\"$2\" --password=\"$3\" -e \"$query\" $4 >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly query MySQL after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_mysql miin-mysql-dev root password database\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"# Waits for mysql to become actually available\nwait_for_mysql() {\n query=\"SELECT count(*) FROM users\"\n \n timeout=180 # 3 minutes limit\n i=0\n \n while ! docker exec -it \"$1\" mysql --user=\"$2\" --password=\"$3\" -e \"$query\" $4 >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly query MySQL after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_mysql miin-mysql-dev root password database\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Wait%20for%20redis"},"children":[{"type":"text","value":"Wait for redis"}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vishnubob/wait-for-it","rel":["nofollow"]},"children":[{"type":"text","value":"wait-for-it.sh"}]},{"type":"text","value":" doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before #mysql is ready to accept connections"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This script waits for first successful query from database or exits with non-zero status after timeout."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$query"}]},{"type":"text","value":" for the actually working one."}]},{"type":"element","tag":"code","props":{"code":"# Waits for mysql to become actually available\nwait_for_mysql() {\n query=\"SELECT count(*) FROM users\"\n \n timeout=180 # 3 minutes limit\n i=0\n \n while ! docker exec -it \"$1\" mysql --user=\"$2\" --password=\"$3\" -e \"$query\" $4 >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly query MySQL after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_mysql miin-mysql-dev root password database\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ee899c"},"children":[{"type":"text","value":"# Waits for mysql to become actually available"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fcae9b"},"children":[{"type":"text","value":"wait_for_mysql"}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":"() {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" query="}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":"\"SELECT count(*) FROM users\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" timeout=180 "}]},{"type":"element","tag":"span","props":{"class":"ct-ee899c"},"children":[{"type":"text","value":"# 3 minutes limit"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" i=0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":"while"}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" docker "}]},{"type":"element","tag":"span","props":{"class":"ct-5b78c6"},"children":[{"type":"text","value":"exec"}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" -it "}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-f2f437"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-32fef5"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" mysql --user="}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-f2f437"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-32fef5"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" -e "}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-f2f437"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-32fef5"},"children":[{"type":"text","value":"query"}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":"do"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" sleep 1"}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" i="}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":"$(("}]},{"type":"element","tag":"span","props":{"class":"ct-f2f437"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-32fef5"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-2c5bcb"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" [[ "}]},{"type":"element","tag":"span","props":{"class":"ct-f2f437"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-32fef5"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-f2f437"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":"-ge"}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f2f437"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-32fef5"},"children":[{"type":"text","value":"timeout"}]},{"type":"element","tag":"span","props":{"class":"ct-f2f437"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" ]]"}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":";"}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":"then"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5b78c6"},"children":[{"type":"text","value":"echo"}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":"\"[Error] can't properly query MySQL after "}]},{"type":"element","tag":"span","props":{"class":"ct-f2f437"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-32fef5"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-f2f437"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":" secs\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5b78c6"},"children":[{"type":"text","value":"exit"}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" 1"}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":"fi"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":"done"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ee899c"},"children":[{"type":"text","value":"# usage: wait_for_mysql miin-mysql-dev root password database"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Wait%20for%20redis"},"children":[{"type":"text","value":"Wait for redis"}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-2c5bcb{color:#79C0FF}.ct-32fef5{color:#C9D1D9}.ct-f2f437{color:#C9D1D9}.ct-5b78c6{color:#79C0FF}.ct-09cbe0{color:#FF7B72}.ct-30990b{color:#A5D6FF}.ct-088cdc{color:#C9D1D9}.ct-fcae9b{color:#D2A8FF}.ct-ee899c{color:#8B949E}.light .ct-ee899c{color:#93A1A1}.light .ct-fcae9b{color:#268BD2}.light .ct-088cdc{color:#657B83}.light .ct-30990b{color:#2AA198}.light .ct-09cbe0{color:#859900}.light .ct-5b78c6{color:#268BD2}.light .ct-f2f437{color:#859900}.light .ct-32fef5{color:#268BD2}.light .ct-2c5bcb{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Docker:Wait for mysql.md","_source":"content","_file":"Docker/Wait for mysql.md","_extension":"md"},{"_path":"/docker/wait-for-redis","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Wait For Redis","description":"wait-for-it.sh doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before redis is ready to accept connections","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vishnubob/wait-for-it","rel":["nofollow"]},"children":[{"type":"text","value":"wait-for-it.sh"}]},{"type":"text","value":" doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before redis is ready to accept connections"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This script waits for first successful ping or exits with non-zero status after 3 minutes."}]},{"type":"element","tag":"code","props":{"code":"# Waits for redis to become actually available\nwait_for_redis() {\n timeout=180 # 3 minutes\n i=0\n while ! docker exec -it \"$1\" redis-cli -h localhost -p 6379 -a \"$2\" ping | grep \"PONG\" >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly ping Redis container after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_redis miin-redis-dev password\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"# Waits for redis to become actually available\nwait_for_redis() {\n timeout=180 # 3 minutes\n i=0\n while ! docker exec -it \"$1\" redis-cli -h localhost -p 6379 -a \"$2\" ping | grep \"PONG\" >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly ping Redis container after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_redis miin-redis-dev password\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Wait%20for%20mysql"},"children":[{"type":"text","value":"Wait for mysql"}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vishnubob/wait-for-it","rel":["nofollow"]},"children":[{"type":"text","value":"wait-for-it.sh"}]},{"type":"text","value":" doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before redis is ready to accept connections"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This script waits for first successful ping or exits with non-zero status after 3 minutes."}]},{"type":"element","tag":"code","props":{"code":"# Waits for redis to become actually available\nwait_for_redis() {\n timeout=180 # 3 minutes\n i=0\n while ! docker exec -it \"$1\" redis-cli -h localhost -p 6379 -a \"$2\" ping | grep \"PONG\" >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly ping Redis container after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_redis miin-redis-dev password\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763b9c"},"children":[{"type":"text","value":"# Waits for redis to become actually available"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6003c4"},"children":[{"type":"text","value":"wait_for_redis"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":"() {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" timeout=180 "}]},{"type":"element","tag":"span","props":{"class":"ct-763b9c"},"children":[{"type":"text","value":"# 3 minutes"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" i=0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":"while"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" docker "}]},{"type":"element","tag":"span","props":{"class":"ct-f19cb2"},"children":[{"type":"text","value":"exec"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" -it "}]},{"type":"element","tag":"span","props":{"class":"ct-1a89b4"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-45c1f7"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-3c6a3e"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-1a89b4"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" redis-cli -h localhost -p 6379 -a "}]},{"type":"element","tag":"span","props":{"class":"ct-1a89b4"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-45c1f7"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-3c6a3e"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-1a89b4"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" ping "}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" grep "}]},{"type":"element","tag":"span","props":{"class":"ct-1a89b4"},"children":[{"type":"text","value":"\"PONG\""}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":"/dev/null "}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":"2>&1;"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":"do"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" sleep 1"}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" i="}]},{"type":"element","tag":"span","props":{"class":"ct-1a89b4"},"children":[{"type":"text","value":"$(("}]},{"type":"element","tag":"span","props":{"class":"ct-45c1f7"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-3c6a3e"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-300474"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-1a89b4"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" [[ "}]},{"type":"element","tag":"span","props":{"class":"ct-45c1f7"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-3c6a3e"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-45c1f7"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":"-ge"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-45c1f7"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-3c6a3e"},"children":[{"type":"text","value":"timeout"}]},{"type":"element","tag":"span","props":{"class":"ct-45c1f7"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" ]]"}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":";"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":"then"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f19cb2"},"children":[{"type":"text","value":"echo"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1a89b4"},"children":[{"type":"text","value":"\"[Error] can't properly ping Redis container after "}]},{"type":"element","tag":"span","props":{"class":"ct-45c1f7"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-3c6a3e"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-45c1f7"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-1a89b4"},"children":[{"type":"text","value":" secs\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f19cb2"},"children":[{"type":"text","value":"exit"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" 1"}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":"fi"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":"done"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763b9c"},"children":[{"type":"text","value":"# usage: wait_for_redis miin-redis-dev password"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Wait%20for%20mysql"},"children":[{"type":"text","value":"Wait for mysql"}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-300474{color:#79C0FF}.ct-3c6a3e{color:#C9D1D9}.ct-45c1f7{color:#C9D1D9}.ct-1a89b4{color:#A5D6FF}.ct-f19cb2{color:#79C0FF}.ct-8a1f59{color:#FF7B72}.ct-20f250{color:#C9D1D9}.ct-6003c4{color:#D2A8FF}.ct-763b9c{color:#8B949E}.light .ct-763b9c{color:#93A1A1}.light .ct-6003c4{color:#268BD2}.light .ct-20f250{color:#657B83}.light .ct-8a1f59{color:#859900}.light .ct-f19cb2{color:#268BD2}.light .ct-1a89b4{color:#2AA198}.light .ct-45c1f7{color:#859900}.light .ct-3c6a3e{color:#268BD2}.light .ct-300474{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Docker:Wait for redis.md","_source":"content","_file":"Docker/Wait for redis.md","_extension":"md"},{"_path":"/frontend/react-native/oauth2-login","_dir":"react-native","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"OAuth2 Login","description":"Use #oauth2 login with React-Native","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Use #oauth2 login with React-Native"}]},{"type":"element","tag":"h2","props":{"id":"common-oauth2-providers"},"children":[{"type":"text","value":"Common OAuth2 providers"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Can be handled by "},{"type":"element","tag":"a","props":{"href":"react-native-app-auth"},"children":[{"type":"text","value":"react-native-app-auth"}]},{"type":"text","value":" by redirecting to url "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"com.yourapp://oauth2provider"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h3","props":{"id":"example-for-google"},"children":[{"type":"text","value":"Example for #Google"}]},{"type":"element","tag":"code","props":{"code":"import { authorize } from 'react-native-app-auth';\n\nconst GOOGLE_OAUTH_CLIENT = '...';\n\n// ...\nconst authState = await authorize({\n issuer: 'https://accounts.google.com',\n clientId: `${GOOGLE_OAUTH_CLIENT}.apps.googleusercontent.com`,\n redirectUrl: `com.yourapp:/oauth2redirect/google`,\n scopes: ['openid', 'profile'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { authorize } from 'react-native-app-auth';\n\nconst GOOGLE_OAUTH_CLIENT = '...';\n\n// ...\nconst authState = await authorize({\n issuer: 'https://accounts.google.com',\n clientId: `${GOOGLE_OAUTH_CLIENT}.apps.googleusercontent.com`,\n redirectUrl: `com.yourapp:/oauth2redirect/google`,\n scopes: ['openid', 'profile'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"example-for-yandex"},"children":[{"type":"text","value":"Example for #Yandex"}]},{"type":"element","tag":"code","props":{"code":"const YANDEX_OAUTH_CLIENT = '...';\nconst YANDEX_OAUTH_SECRET = '...'; // better hide it somehow\nconst APP_ID = 'com.yourapp';\n\nconst authState = await authorize({\n serviceConfiguration: {\n authorizationEndpoint: `https://oauth.yandex.ru/authorize?response_type=code&client_id=${YANDEX_OAUTH_CLIENT}&redirect_uri=${APP_ID}:/oauth2redirect`,\n // TODO: replace it with your own backend to secure client_secret:\n tokenEndpoint: `https://oauth.yandex.ru/token?grant_type=authorization_code&client_id=${YANDEX_OAUTH_CLIENT}&client_secret=${YANDEX_OAUTH_SECRET}`,\n },\n clientId: YANDEX_OAUTH_CLIENT,\n redirectUrl: `${APP_ID}:/oauth2redirect`,\n scopes: ['login:info', 'login:avatar'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n\ncallback(authState.accessToken);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const YANDEX_OAUTH_CLIENT = '...';\nconst YANDEX_OAUTH_SECRET = '...'; // better hide it somehow\nconst APP_ID = 'com.yourapp';\n\nconst authState = await authorize({\n serviceConfiguration: {\n authorizationEndpoint: `https://oauth.yandex.ru/authorize?response_type=code&client_id=${YANDEX_OAUTH_CLIENT}&redirect_uri=${APP_ID}:/oauth2redirect`,\n // TODO: replace it with your own backend to secure client_secret:\n tokenEndpoint: `https://oauth.yandex.ru/token?grant_type=authorization_code&client_id=${YANDEX_OAUTH_CLIENT}&client_secret=${YANDEX_OAUTH_SECRET}`,\n },\n clientId: YANDEX_OAUTH_CLIENT,\n redirectUrl: `${APP_ID}:/oauth2redirect`,\n scopes: ['login:info', 'login:avatar'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n\ncallback(authState.accessToken);\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"apple-id-login"},"children":[{"type":"text","value":"Apple ID login"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/invertase/react-native-apple-authentication","rel":["nofollow"]},"children":[{"type":"text","value":"react-native-apple-authentication"}]},{"type":"text","value":" has its own "},{"type":"element","tag":"a","props":{"href":"https://github.com/invertase/react-native-apple-authentication/tree/main/docs","rel":["nofollow"]},"children":[{"type":"text","value":"documentation"}]},{"type":"text","value":" on setting up OAuth using Apple ID."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Use #oauth2 login with React-Native"}]},{"type":"element","tag":"h2","props":{"id":"common-oauth2-providers"},"children":[{"type":"text","value":"Common OAuth2 providers"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Can be handled by "},{"type":"element","tag":"a","props":{"href":"react-native-app-auth"},"children":[{"type":"text","value":"react-native-app-auth"}]},{"type":"text","value":" by redirecting to url "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"com.yourapp://oauth2provider"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h3","props":{"id":"example-for-google"},"children":[{"type":"text","value":"Example for #Google"}]},{"type":"element","tag":"code","props":{"code":"import { authorize } from 'react-native-app-auth';\n\nconst GOOGLE_OAUTH_CLIENT = '...';\n\n// ...\nconst authState = await authorize({\n issuer: 'https://accounts.google.com',\n clientId: `${GOOGLE_OAUTH_CLIENT}.apps.googleusercontent.com`,\n redirectUrl: `com.yourapp:/oauth2redirect/google`,\n scopes: ['openid', 'profile'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-eaff2e"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-868453"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-eaff2e"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"'react-native-app-auth'"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6e5da4"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"GOOGLE_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eaff2e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-719333"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6e5da4"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"authState"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eaff2e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eaff2e"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5d2b2"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" issuer: "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"'https://accounts.google.com'"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" clientId: "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"GOOGLE_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"}.apps.googleusercontent.com`"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" redirectUrl: "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"`com.yourapp:/oauth2redirect/google`"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" scopes: ["}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"'openid'"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"'profile'"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":"],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" dangerouslyAllowInsecureHttpRequests: "}]},{"type":"element","tag":"span","props":{"class":"ct-919484"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":"});"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"example-for-yandex"},"children":[{"type":"text","value":"Example for #Yandex"}]},{"type":"element","tag":"code","props":{"code":"const YANDEX_OAUTH_CLIENT = '...';\nconst YANDEX_OAUTH_SECRET = '...'; // better hide it somehow\nconst APP_ID = 'com.yourapp';\n\nconst authState = await authorize({\n serviceConfiguration: {\n authorizationEndpoint: `https://oauth.yandex.ru/authorize?response_type=code&client_id=${YANDEX_OAUTH_CLIENT}&redirect_uri=${APP_ID}:/oauth2redirect`,\n // TODO: replace it with your own backend to secure client_secret:\n tokenEndpoint: `https://oauth.yandex.ru/token?grant_type=authorization_code&client_id=${YANDEX_OAUTH_CLIENT}&client_secret=${YANDEX_OAUTH_SECRET}`,\n },\n clientId: YANDEX_OAUTH_CLIENT,\n redirectUrl: `${APP_ID}:/oauth2redirect`,\n scopes: ['login:info', 'login:avatar'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n\ncallback(authState.accessToken);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6e5da4"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eaff2e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6e5da4"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"YANDEX_OAUTH_SECRET"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eaff2e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-719333"},"children":[{"type":"text","value":"// better hide it somehow"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6e5da4"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"APP_ID"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eaff2e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"'com.yourapp'"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6e5da4"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"authState"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eaff2e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eaff2e"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5d2b2"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" serviceConfiguration: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" authorizationEndpoint: "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"`https://oauth.yandex.ru/authorize?response_type=code&client_id=${"}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"}&redirect_uri=${"}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"APP_ID"}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"}:/oauth2redirect`"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-719333"},"children":[{"type":"text","value":"// TODO: replace it with your own backend to secure client_secret:"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" tokenEndpoint: "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"`https://oauth.yandex.ru/token?grant_type=authorization_code&client_id=${"}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"}&client_secret=${"}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"YANDEX_OAUTH_SECRET"}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" clientId: "}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" redirectUrl: "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"APP_ID"}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"}:/oauth2redirect`"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" scopes: ["}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"'login:info'"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"'login:avatar'"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":"],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" dangerouslyAllowInsecureHttpRequests: "}]},{"type":"element","tag":"span","props":{"class":"ct-919484"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":"});"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d5d2b2"},"children":[{"type":"text","value":"callback"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-868453"},"children":[{"type":"text","value":"authState"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-868453"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"apple-id-login"},"children":[{"type":"text","value":"Apple ID login"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/invertase/react-native-apple-authentication","rel":["nofollow"]},"children":[{"type":"text","value":"react-native-apple-authentication"}]},{"type":"text","value":" has its own "},{"type":"element","tag":"a","props":{"href":"https://github.com/invertase/react-native-apple-authentication/tree/main/docs","rel":["nofollow"]},"children":[{"type":"text","value":"documentation"}]},{"type":"text","value":" on setting up OAuth using Apple ID."}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-919484{color:#79C0FF}.ct-d5d2b2{color:#D2A8FF}.ct-719333{color:#8B949E}.ct-b47256{color:#79C0FF}.ct-6e5da4{color:#FF7B72}.ct-e50739{color:#A5D6FF}.ct-868453{color:#C9D1D9}.ct-f06536{color:#C9D1D9}.ct-eaff2e{color:#FF7B72}.light .ct-eaff2e{color:#859900}.light .ct-f06536{color:#657B83}.light .ct-868453{color:#268BD2}.light .ct-e50739{color:#2AA198}.light .ct-6e5da4{color:#073642}.light .ct-b47256{color:#268BD2}.light .ct-719333{color:#93A1A1}.light .ct-d5d2b2{color:#268BD2}.light .ct-919484{color:#B58900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"common-oauth2-providers","depth":2,"text":"Common OAuth2 providers","children":[{"id":"example-for-google","depth":3,"text":"Example for #Google"},{"id":"example-for-yandex","depth":3,"text":"Example for #Yandex"}]},{"id":"apple-id-login","depth":2,"text":"Apple ID login"}]}},"_type":"markdown","_id":"content:Frontend:React Native:OAuth2 login.md","_source":"content","_file":"Frontend/React Native/OAuth2 login.md","_extension":"md"},{"_path":"/frontend/react-native/preserve-flatlist-scroll-position-in-react-native","_dir":"react-native","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Preserve FlatList Scroll Position In React Native","description":"Sometimes you need to keep scroll position of FlatList in React Native after some user interactions.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you need to keep scroll position of "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"FlatList"}]},{"type":"text","value":" in React Native after some user interactions."}]},{"type":"element","tag":"code","props":{"code":"// interact() is doing some stuff, that changes FlatList scroll size\ntype Props = { interact: () => void; }\n\nconst SomeList: FC = ({ interact }) => {\n const scrollPosition = useRef(0);\n const scrollHeight = useRef(0);\n \n // set it to `true` before interaction and back to `false` right after\n const shouldKeepScrollPosition = useRef(false);\n\n const onScroll = useCallback(\n (event: NativeSyntheticEvent) => {\n scrollPosition.current = event.nativeEvent.contentOffset.y;\n },\n [],\n );\n\n const onContentSizeChange = useCallback((_: number, h: number) => {\n if (!shouldKeepScrollPosition.current) {\n scrollHeight.current = h;\n return;\n }\n\n ref.current?.scrollToOffset({\n offset: scrollPosition.current + (h - scrollHeight.current),\n animated: false,\n });\n\n scrollHeight.current = h;\n }, []);\n\n // onInteraction wraps interaction to preserve scroll position\n const onInteraction = useCallback(\n () => {\n shouldKeepScrollPosition.current = true;\n\n setTimeout(() => {\n interact();\n }, 0);\n\n setTimeout(() => {\n shouldKeepScrollPosition.current = false;\n }, 500);\n },\n [setSelectedSubThemes],\n );\n \n return (\n \n )\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// interact() is doing some stuff, that changes FlatList scroll size\ntype Props = { interact: () => void; }\n\nconst SomeList: FC = ({ interact }) => {\n const scrollPosition = useRef(0);\n const scrollHeight = useRef(0);\n \n // set it to `true` before interaction and back to `false` right after\n const shouldKeepScrollPosition = useRef(false);\n\n const onScroll = useCallback(\n (event: NativeSyntheticEvent) => {\n scrollPosition.current = event.nativeEvent.contentOffset.y;\n },\n [],\n );\n\n const onContentSizeChange = useCallback((_: number, h: number) => {\n if (!shouldKeepScrollPosition.current) {\n scrollHeight.current = h;\n return;\n }\n\n ref.current?.scrollToOffset({\n offset: scrollPosition.current + (h - scrollHeight.current),\n animated: false,\n });\n\n scrollHeight.current = h;\n }, []);\n\n // onInteraction wraps interaction to preserve scroll position\n const onInteraction = useCallback(\n () => {\n shouldKeepScrollPosition.current = true;\n\n setTimeout(() => {\n interact();\n }, 0);\n\n setTimeout(() => {\n shouldKeepScrollPosition.current = false;\n }, 500);\n },\n [setSelectedSubThemes],\n );\n \n return (\n \n )\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you need to keep scroll position of "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"FlatList"}]},{"type":"text","value":" in React Native after some user interactions."}]},{"type":"element","tag":"code","props":{"code":"// interact() is doing some stuff, that changes FlatList scroll size\ntype Props = { interact: () => void; }\n\nconst SomeList: FC = ({ interact }) => {\n const scrollPosition = useRef(0);\n const scrollHeight = useRef(0);\n \n // set it to `true` before interaction and back to `false` right after\n const shouldKeepScrollPosition = useRef(false);\n\n const onScroll = useCallback(\n (event: NativeSyntheticEvent) => {\n scrollPosition.current = event.nativeEvent.contentOffset.y;\n },\n [],\n );\n\n const onContentSizeChange = useCallback((_: number, h: number) => {\n if (!shouldKeepScrollPosition.current) {\n scrollHeight.current = h;\n return;\n }\n\n ref.current?.scrollToOffset({\n offset: scrollPosition.current + (h - scrollHeight.current),\n animated: false,\n });\n\n scrollHeight.current = h;\n }, []);\n\n // onInteraction wraps interaction to preserve scroll position\n const onInteraction = useCallback(\n () => {\n shouldKeepScrollPosition.current = true;\n\n setTimeout(() => {\n interact();\n }, 0);\n\n setTimeout(() => {\n shouldKeepScrollPosition.current = false;\n }, 500);\n },\n [setSelectedSubThemes],\n );\n \n return (\n \n )\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c6b575"},"children":[{"type":"text","value":"// interact() is doing some stuff, that changes FlatList scroll size"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a145b1"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-244c86"},"children":[{"type":"text","value":"Props"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-a7b241"},"children":[{"type":"text","value":"interact"}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-a145b1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3ddc63"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"; }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2557c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fb9d68"},"children":[{"type":"text","value":"SomeList"}]},{"type":"element","tag":"span","props":{"class":"ct-52106b"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-623bef"},"children":[{"type":"text","value":"FC"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-623bef"},"children":[{"type":"text","value":"Props"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-52106b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" ({ "}]},{"type":"element","tag":"span","props":{"class":"ct-b1edfd"},"children":[{"type":"text","value":"interact"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-2557c5"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a145b1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-482fe5"},"children":[{"type":"text","value":"scrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a7b241"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-87df16"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a145b1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-482fe5"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a7b241"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-87df16"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6b575"},"children":[{"type":"text","value":"// set it to `true` before interaction and back to `false` right after"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a145b1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-482fe5"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a7b241"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-df769e"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a145b1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-482fe5"},"children":[{"type":"text","value":"onScroll"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a7b241"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-b1edfd"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-52106b"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-623bef"},"children":[{"type":"text","value":"NativeSyntheticEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-623bef"},"children":[{"type":"text","value":"NativeScrollEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":">) "}]},{"type":"element","tag":"span","props":{"class":"ct-2557c5"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"scrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"nativeEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"contentOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"y"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" [],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2557c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-428713"},"children":[{"type":"text","value":"onContentSizeChange"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-52106b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fb9d68"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-b1edfd"},"children":[{"type":"text","value":"_"}]},{"type":"element","tag":"span","props":{"class":"ct-52106b"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-481e50"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-b1edfd"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-52106b"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-481e50"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-2557c5"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"ref"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-a7b241"},"children":[{"type":"text","value":"scrollToOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" offset: "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"scrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" animated: "}]},{"type":"element","tag":"span","props":{"class":"ct-df769e"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" }, []);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6b575"},"children":[{"type":"text","value":"// onInteraction wraps interaction to preserve scroll position"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a145b1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-482fe5"},"children":[{"type":"text","value":"onInteraction"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a7b241"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-a145b1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-df769e"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-482fe5"},"children":[{"type":"text","value":"setTimeout"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-a145b1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a7b241"},"children":[{"type":"text","value":"interact"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" }, "}]},{"type":"element","tag":"span","props":{"class":"ct-87df16"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-482fe5"},"children":[{"type":"text","value":"setTimeout"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-a145b1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-df769e"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" }, "}]},{"type":"element","tag":"span","props":{"class":"ct-87df16"},"children":[{"type":"text","value":"500"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"setSelectedSubThemes"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-75fcd0"},"children":[{"type":"text","value":"FlatList"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6b575"},"children":[{"type":"text","value":"// ...required FlatList options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"ref"}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"ref"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"onContentSizeChange"}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"onContentSizeChange"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"onRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"onRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"onScroll"}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"onScroll"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"/>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" )"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-75fcd0{color:#FFA657}.ct-481e50{color:#79C0FF}.ct-428713{color:#79C0FF}.ct-2686a0{color:#C9D1D9}.ct-df769e{color:#79C0FF}.ct-87df16{color:#79C0FF}.ct-482fe5{color:#79C0FF}.ct-b1edfd{color:#FFA657}.ct-623bef{color:#FFA657}.ct-52106b{color:#FF7B72}.ct-fb9d68{color:#D2A8FF}.ct-86daaf{color:#C9D1D9}.ct-2557c5{color:#FF7B72}.ct-3ddc63{color:#79C0FF}.ct-a7b241{color:#D2A8FF}.ct-61ac67{color:#FF7B72}.ct-244c86{color:#FFA657}.ct-f062c5{color:#C9D1D9}.ct-a145b1{color:#FF7B72}.ct-c6b575{color:#8B949E}.light .ct-c6b575{color:#93A1A1}.light .ct-a145b1{color:#073642}.light .ct-f062c5{color:#657B83}.light .ct-244c86{color:#268BD2}.light .ct-61ac67{color:#859900}.light .ct-a7b241{color:#268BD2}.light .ct-3ddc63{color:#859900}.light .ct-2557c5{color:#073642}.light .ct-86daaf{color:#657B83}.light .ct-fb9d68{color:#268BD2}.light .ct-52106b{color:#859900}.light .ct-623bef{color:#268BD2}.light .ct-b1edfd{color:#657B83}.light .ct-482fe5{color:#268BD2}.light .ct-87df16{color:#D33682}.light .ct-df769e{color:#B58900}.light .ct-2686a0{color:#268BD2}.light .ct-428713{color:#268BD2}.light .ct-481e50{color:#859900}.light .ct-75fcd0{color:#657B83}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:React Native:Preserve FlatList scroll position in React Native.md","_source":"content","_file":"Frontend/React Native/Preserve FlatList scroll position in React Native.md","_extension":"md"},{"_path":"/frontend/react-native/useful-comands","_dir":"react-native","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Useful Comands","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"show-android-logcat"},"children":[{"type":"text","value":"Show android logcat"}]},{"type":"element","tag":"code","props":{"code":"adb logcat com.application:I \"*:S\"\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"adb logcat com.application:I \"*:S\"\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"get-apks-sha-256"},"children":[{"type":"text","value":"Get .apk's SHA-256"}]},{"type":"element","tag":"code","props":{"code":"keytool -printcert -jarfile \"$1\"\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"keytool -printcert -jarfile \"$1\"\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"assemble-debug-release-on-android"},"children":[{"type":"text","value":"Assemble debug release on Android"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Packages release with bundled resources."}]},{"type":"element","tag":"code","props":{"code":"npx react-native bundle \\\n --platform android \\\n --dev false \\\n --entry-file index.js \\\n --bundle-output android/app/src/main/assets/index.android.bundle \\\n --assets-dest android/app/src/main/res/\n\ncd android && ./gradlew assembleDebug\n\n# do your stuff\n\n./gradlew clean\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"npx react-native bundle \\\n --platform android \\\n --dev false \\\n --entry-file index.js \\\n --bundle-output android/app/src/main/assets/index.android.bundle \\\n --assets-dest android/app/src/main/res/\n\ncd android && ./gradlew assembleDebug\n\n# do your stuff\n\n./gradlew clean\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"send-release-to-android-device"},"children":[{"type":"text","value":"Send release to Android device"}]},{"type":"element","tag":"code","props":{"code":"cd ./android \\\n && ./gradlew assembleRelease \\\n && adb install ./app/build/outputs/apk/release/app-release.apk\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"cd ./android \\\n && ./gradlew assembleRelease \\\n && adb install ./app/build/outputs/apk/release/app-release.apk\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"deep-links"},"children":[{"type":"text","value":"Deep links"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://zarah.dev/2022/02/08/android12-deeplinks.html","rel":["nofollow"]},"children":[{"type":"text","value":"https://zarah.dev/2022/02/08/android12-deeplinks.html"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://developer.android.com/training/app-links/verify-site-associations#invoke-domain-verification","rel":["nofollow"]},"children":[{"type":"text","value":"https://developer.android.com/training/app-links/verify-site-associations#invoke-domain-verification"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://digitalassetlinks.googleapis.com/v1/statements:list?source.web.site=https://miin.ru&relation=delegate_permission/common.handle_all_urls","rel":["nofollow"]},"children":[{"type":"text","value":"https://digitalassetlinks.googleapis.com/v1/statements:list?source.web.site=https://miin.ru&relation=delegate_permission/common.handle_all_urls"}]}]}]},{"type":"element","tag":"h3","props":{"id":"open-deep-links"},"children":[{"type":"text","value":"Open deep links"}]},{"type":"element","tag":"code","props":{"code":"# ios \nxcrun simctl openurl booted $1\n\n# android\nadb shell am start -W -a android.intent.action.VIEW -d $1 \\\ncom.application\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"# ios \nxcrun simctl openurl booted $1\n\n# android\nadb shell am start -W -a android.intent.action.VIEW -d $1 \\\ncom.application\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"reverify-links-on-android"},"children":[{"type":"text","value":"Reverify links on Android"}]},{"type":"element","tag":"code","props":{"code":"PACKAGE=\"com.application\"\n\nadb shell pm set-app-links --package $PACKAGE 0 all && \\\n adb shell pm verify-app-links --re-verify $PACKAGE\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"PACKAGE=\"com.application\"\n\nadb shell pm set-app-links --package $PACKAGE 0 all && \\\n adb shell pm verify-app-links --re-verify $PACKAGE\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"show-android-logcat"},"children":[{"type":"text","value":"Show android logcat"}]},{"type":"element","tag":"code","props":{"code":"adb logcat com.application:I \"*:S\"\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":"adb logcat com.application:I "}]},{"type":"element","tag":"span","props":{"class":"ct-a26332"},"children":[{"type":"text","value":"\"*:S\""}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"get-apks-sha-256"},"children":[{"type":"text","value":"Get .apk's SHA-256"}]},{"type":"element","tag":"code","props":{"code":"keytool -printcert -jarfile \"$1\"\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":"keytool -printcert -jarfile "}]},{"type":"element","tag":"span","props":{"class":"ct-a26332"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-ccecdb"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-152964"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-a26332"},"children":[{"type":"text","value":"\""}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"assemble-debug-release-on-android"},"children":[{"type":"text","value":"Assemble debug release on Android"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Packages release with bundled resources."}]},{"type":"element","tag":"code","props":{"code":"npx react-native bundle \\\n --platform android \\\n --dev false \\\n --entry-file index.js \\\n --bundle-output android/app/src/main/assets/index.android.bundle \\\n --assets-dest android/app/src/main/res/\n\ncd android && ./gradlew assembleDebug\n\n# do your stuff\n\n./gradlew clean\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":"npx react-native bundle \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" --platform android \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" --dev "}]},{"type":"element","tag":"span","props":{"class":"ct-3ec95f"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" --entry-file index.js \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" --bundle-output android/app/src/main/assets/index.android.bundle \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" --assets-dest android/app/src/main/res/"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3ec95f"},"children":[{"type":"text","value":"cd"}]},{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" android "}]},{"type":"element","tag":"span","props":{"class":"ct-7aad02"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" ./gradlew assembleDebug"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-96a46f"},"children":[{"type":"text","value":"# do your stuff"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":"./gradlew clean"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"send-release-to-android-device"},"children":[{"type":"text","value":"Send release to Android device"}]},{"type":"element","tag":"code","props":{"code":"cd ./android \\\n && ./gradlew assembleRelease \\\n && adb install ./app/build/outputs/apk/release/app-release.apk\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3ec95f"},"children":[{"type":"text","value":"cd"}]},{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" ./android \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7aad02"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" ./gradlew assembleRelease \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7aad02"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" adb install ./app/build/outputs/apk/release/app-release.apk"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"deep-links"},"children":[{"type":"text","value":"Deep links"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://zarah.dev/2022/02/08/android12-deeplinks.html","rel":["nofollow"]},"children":[{"type":"text","value":"https://zarah.dev/2022/02/08/android12-deeplinks.html"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://developer.android.com/training/app-links/verify-site-associations#invoke-domain-verification","rel":["nofollow"]},"children":[{"type":"text","value":"https://developer.android.com/training/app-links/verify-site-associations#invoke-domain-verification"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://digitalassetlinks.googleapis.com/v1/statements:list?source.web.site=https://miin.ru&relation=delegate_permission/common.handle_all_urls","rel":["nofollow"]},"children":[{"type":"text","value":"https://digitalassetlinks.googleapis.com/v1/statements:list?source.web.site=https://miin.ru&relation=delegate_permission/common.handle_all_urls"}]}]}]},{"type":"element","tag":"h3","props":{"id":"open-deep-links"},"children":[{"type":"text","value":"Open deep links"}]},{"type":"element","tag":"code","props":{"code":"# ios \nxcrun simctl openurl booted $1\n\n# android\nadb shell am start -W -a android.intent.action.VIEW -d $1 \\\ncom.application\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-96a46f"},"children":[{"type":"text","value":"# ios "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":"xcrun simctl openurl booted "}]},{"type":"element","tag":"span","props":{"class":"ct-ccecdb"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-152964"},"children":[{"type":"text","value":"1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-96a46f"},"children":[{"type":"text","value":"# android"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":"adb shell am start -W -a android.intent.action.VIEW -d "}]},{"type":"element","tag":"span","props":{"class":"ct-ccecdb"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-152964"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":"com.application"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"reverify-links-on-android"},"children":[{"type":"text","value":"Reverify links on Android"}]},{"type":"element","tag":"code","props":{"code":"PACKAGE=\"com.application\"\n\nadb shell pm set-app-links --package $PACKAGE 0 all && \\\n adb shell pm verify-app-links --re-verify $PACKAGE\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":"PACKAGE="}]},{"type":"element","tag":"span","props":{"class":"ct-a26332"},"children":[{"type":"text","value":"\"com.application\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":"adb shell pm set-app-links --package "}]},{"type":"element","tag":"span","props":{"class":"ct-ccecdb"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-152964"},"children":[{"type":"text","value":"PACKAGE"}]},{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" 0 all "}]},{"type":"element","tag":"span","props":{"class":"ct-7aad02"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" adb shell pm verify-app-links --re-verify "}]},{"type":"element","tag":"span","props":{"class":"ct-ccecdb"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-152964"},"children":[{"type":"text","value":"PACKAGE"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-96a46f{color:#8B949E}.ct-7aad02{color:#FF7B72}.ct-3ec95f{color:#79C0FF}.ct-152964{color:#C9D1D9}.ct-ccecdb{color:#C9D1D9}.ct-a26332{color:#A5D6FF}.ct-e9d7d1{color:#C9D1D9}.light .ct-e9d7d1{color:#657B83}.light .ct-a26332{color:#2AA198}.light .ct-ccecdb{color:#859900}.light .ct-152964{color:#268BD2}.light .ct-3ec95f{color:#268BD2}.light .ct-7aad02{color:#859900}.light .ct-96a46f{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"show-android-logcat","depth":2,"text":"Show android logcat"},{"id":"get-apks-sha-256","depth":2,"text":"Get .apk's SHA-256"},{"id":"assemble-debug-release-on-android","depth":2,"text":"Assemble debug release on Android"},{"id":"send-release-to-android-device","depth":2,"text":"Send release to Android device"},{"id":"deep-links","depth":2,"text":"Deep links","children":[{"id":"open-deep-links","depth":3,"text":"Open deep links"},{"id":"reverify-links-on-android","depth":3,"text":"Reverify links on Android"}]}]}},"_type":"markdown","_id":"content:Frontend:React Native:Useful comands.md","_source":"content","_file":"Frontend/React Native/Useful comands.md","_extension":"md"},{"_path":"/frontend/react/axios-refresh-token-on-react","_dir":"react","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Axios Refresh Token On React","description":" component, that will handle token refresh if needed. Refresh function should, probably, be passed through component props.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":""}]},{"type":"text","value":" component, that will handle token refresh if needed. Refresh function should, probably, be passed through component props."}]},{"type":"element","tag":"code","props":{"code":"import axios from \"axios\";\nimport React, {\n createContext,\n FC,\n PropsWithChildren,\n useCallback,\n useContext,\n useEffect,\n useRef,\n} from \"react\";\n\ninterface APIProviderProps extends PropsWithChildren {\n tokens: {\n access: string;\n refresh: string;\n };\n logout: () => void;\n}\n\nconst APIContext = createContext({\n client: axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n }),\n});\n\nconst APIProvider: FC = ({ \n tokens, \n logout, \n children,\n}) => {\n const client = useRef(\n axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n })\n ).current;\n\n const refreshTokens = useCallback<() => string>(() => {\n // TODO: implement me\n throw new Error(\"not implemented\");\n }, []);\n\n useEffect(() => {\n if (!tokens.access) {\n return;\n }\n\n // append `access` token to all requests\n const req = client.interceptors.request.use(\n async (config) => {\n config.headers = {\n Authorization: `Bearer ${tokens.access}`,\n };\n return config;\n },\n (error) => {\n Promise.reject(error);\n }\n );\n\n // refreshing interceptor\n const resp = client.interceptors.response.use(\n (response) => {\n return response;\n },\n async function (error) {\n const originalRequest = error.config;\n\n if (error.response.status === 401 && !originalRequest._retry) {\n originalRequest._retry = true;\n\n const newToken = refreshTokens;\n\n return axios({\n ...originalRequest,\n headers: {\n ...originalRequest.headers,\n Authorization: \"Bearer \" + newToken,\n },\n });\n }\n\n logout();\n return Promise.reject(error);\n }\n );\n\n return () => {\n axios.interceptors.request.eject(req);\n axios.interceptors.request.eject(resp);\n };\n }, [client, tokens.access, tokens.refresh, refreshTokens, logout]);\n\n return (\n \n {children}\n \n );\n};\n\nexport const useAPI = () => useContext(APIContext).client;\n\nexport { APIProvider };\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import axios from \"axios\";\nimport React, {\n createContext,\n FC,\n PropsWithChildren,\n useCallback,\n useContext,\n useEffect,\n useRef,\n} from \"react\";\n\ninterface APIProviderProps extends PropsWithChildren {\n tokens: {\n access: string;\n refresh: string;\n };\n logout: () => void;\n}\n\nconst APIContext = createContext({\n client: axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n }),\n});\n\nconst APIProvider: FC = ({ \n tokens, \n logout, \n children,\n}) => {\n const client = useRef(\n axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n })\n ).current;\n\n const refreshTokens = useCallback<() => string>(() => {\n // TODO: implement me\n throw new Error(\"not implemented\");\n }, []);\n\n useEffect(() => {\n if (!tokens.access) {\n return;\n }\n\n // append `access` token to all requests\n const req = client.interceptors.request.use(\n async (config) => {\n config.headers = {\n Authorization: `Bearer ${tokens.access}`,\n };\n return config;\n },\n (error) => {\n Promise.reject(error);\n }\n );\n\n // refreshing interceptor\n const resp = client.interceptors.response.use(\n (response) => {\n return response;\n },\n async function (error) {\n const originalRequest = error.config;\n\n if (error.response.status === 401 && !originalRequest._retry) {\n originalRequest._retry = true;\n\n const newToken = refreshTokens;\n\n return axios({\n ...originalRequest,\n headers: {\n ...originalRequest.headers,\n Authorization: \"Bearer \" + newToken,\n },\n });\n }\n\n logout();\n return Promise.reject(error);\n }\n );\n\n return () => {\n axios.interceptors.request.eject(req);\n axios.interceptors.request.eject(resp);\n };\n }, [client, tokens.access, tokens.refresh, refreshTokens, logout]);\n\n return (\n \n {children}\n \n );\n};\n\nexport const useAPI = () => useContext(APIContext).client;\n\nexport { APIProvider };\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":""}]},{"type":"text","value":" component, that will handle token refresh if needed. Refresh function should, probably, be passed through component props."}]},{"type":"element","tag":"code","props":{"code":"import axios from \"axios\";\nimport React, {\n createContext,\n FC,\n PropsWithChildren,\n useCallback,\n useContext,\n useEffect,\n useRef,\n} from \"react\";\n\ninterface APIProviderProps extends PropsWithChildren {\n tokens: {\n access: string;\n refresh: string;\n };\n logout: () => void;\n}\n\nconst APIContext = createContext({\n client: axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n }),\n});\n\nconst APIProvider: FC = ({ \n tokens, \n logout, \n children,\n}) => {\n const client = useRef(\n axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n })\n ).current;\n\n const refreshTokens = useCallback<() => string>(() => {\n // TODO: implement me\n throw new Error(\"not implemented\");\n }, []);\n\n useEffect(() => {\n if (!tokens.access) {\n return;\n }\n\n // append `access` token to all requests\n const req = client.interceptors.request.use(\n async (config) => {\n config.headers = {\n Authorization: `Bearer ${tokens.access}`,\n };\n return config;\n },\n (error) => {\n Promise.reject(error);\n }\n );\n\n // refreshing interceptor\n const resp = client.interceptors.response.use(\n (response) => {\n return response;\n },\n async function (error) {\n const originalRequest = error.config;\n\n if (error.response.status === 401 && !originalRequest._retry) {\n originalRequest._retry = true;\n\n const newToken = refreshTokens;\n\n return axios({\n ...originalRequest,\n headers: {\n ...originalRequest.headers,\n Authorization: \"Bearer \" + newToken,\n },\n });\n }\n\n logout();\n return Promise.reject(error);\n }\n );\n\n return () => {\n axios.interceptors.request.eject(req);\n axios.interceptors.request.eject(resp);\n };\n }, [client, tokens.access, tokens.refresh, refreshTokens, logout]);\n\n return (\n \n {children}\n \n );\n};\n\nexport const useAPI = () => useContext(APIContext).client;\n\nexport { APIProvider };\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7514a2"},"children":[{"type":"text","value":"\"axios\""}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"React"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"createContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"FC"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"PropsWithChildren"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"useContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"} "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7514a2"},"children":[{"type":"text","value":"\"react\""}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44620b"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e481b8"},"children":[{"type":"text","value":"APIProviderProps"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-44620b"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-780082"},"children":[{"type":"text","value":"PropsWithChildren"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a371f4"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-3caf7d"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a371f4"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-3caf7d"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4aa59b"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a371f4"},"children":[{"type":"text","value":"refresh"}]},{"type":"element","tag":"span","props":{"class":"ct-3caf7d"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4aa59b"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e9f818"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4226d5"},"children":[{"type":"text","value":"APIContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"createContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" client: "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"create"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" baseURL: "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"process"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"env"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-4226d5"},"children":[{"type":"text","value":"NEXT_PUBLIC_API_ENDPOINT"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"});"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"APIProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c99834"},"children":[{"type":"text","value":"FC"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-c99834"},"children":[{"type":"text","value":"APIProviderProps"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" ({ "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"children"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"}) "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4226d5"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"create"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" baseURL: "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"process"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"env"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-4226d5"},"children":[{"type":"text","value":"NEXT_PUBLIC_API_ENDPOINT"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" )."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4226d5"},"children":[{"type":"text","value":"refreshTokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"<() "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e9f818"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":">(() "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5a9ff7"},"children":[{"type":"text","value":"// TODO: implement me"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e9f818"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7514a2"},"children":[{"type":"text","value":"\"not implemented\""}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" }, []);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5a9ff7"},"children":[{"type":"text","value":"// append `access` token to all requests"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4226d5"},"children":[{"type":"text","value":"req"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"use"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-44620b"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-a371f4"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-44620b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" Authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-7514a2"},"children":[{"type":"text","value":"`Bearer ${"}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-4724b7"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-7514a2"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-a371f4"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-44620b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e9f818"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5a9ff7"},"children":[{"type":"text","value":"// refreshing interceptor"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4226d5"},"children":[{"type":"text","value":"resp"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"use"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-a371f4"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-44620b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-44620b"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-44620b"},"children":[{"type":"text","value":"function"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-a371f4"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4226d5"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"status"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf9447"},"children":[{"type":"text","value":"401"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"_retry"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"_retry"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-292051"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4226d5"},"children":[{"type":"text","value":"newToken"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"refreshTokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" Authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-7514a2"},"children":[{"type":"text","value":"\"Bearer \""}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"newToken"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e9f818"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"eject"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"req"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"eject"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"resp"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" }, ["}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"refresh"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"refreshTokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"]);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"APIContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"Provider"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"{{ "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" }}"}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":">"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" {"}]},{"type":"element","tag":"span","props":{"class":"ct-a371f4"},"children":[{"type":"text","value":"children"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"useAPI"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"useContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"APIContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"APIProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" };"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-292051{color:#79C0FF}.ct-cf9447{color:#79C0FF}.ct-4724b7{color:#A5D6FF}.ct-5a9ff7{color:#8B949E}.ct-c99834{color:#FFA657}.ct-4226d5{color:#79C0FF}.ct-e9f818{color:#79C0FF}.ct-451a9f{color:#FF7B72}.ct-d6c589{color:#D2A8FF}.ct-4aa59b{color:#79C0FF}.ct-3caf7d{color:#FF7B72}.ct-a371f4{color:#FFA657}.ct-780082{color:#79C0FF}.ct-e481b8{color:#FFA657}.ct-836525{color:#C9D1D9}.ct-44620b{color:#FF7B72}.ct-7514a2{color:#A5D6FF}.ct-da557f{color:#C9D1D9}.ct-ec59ec{color:#C9D1D9}.ct-d1490f{color:#FF7B72}.light .ct-d1490f{color:#859900}.light .ct-ec59ec{color:#657B83}.light .ct-da557f{color:#268BD2}.light .ct-7514a2{color:#2AA198}.light .ct-44620b{color:#073642}.light .ct-836525{color:#657B83}.light .ct-e481b8{color:#268BD2}.light .ct-780082{color:#657B83}.light .ct-a371f4{color:#657B83}.light .ct-3caf7d{color:#859900}.light .ct-4aa59b{color:#859900}.light .ct-d6c589{color:#268BD2}.light .ct-451a9f{color:#073642}.light .ct-e9f818{color:#859900}.light .ct-4226d5{color:#268BD2}.light .ct-c99834{color:#268BD2}.light .ct-5a9ff7{color:#93A1A1}.light .ct-4724b7{color:#657B83}.light .ct-cf9447{color:#D33682}.light .ct-292051{color:#B58900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:React:Axios refresh token on React.md","_source":"content","_file":"Frontend/React/Axios refresh token on React.md","_extension":"md"},{"_path":"/frontend/react/axios-with-abortcontroller","_dir":"react","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Axios With AbortController","description":"If you need to cancel some request, use axios with AbortController. Previously axios used cancellation token, but now it's deprecated.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If you need to cancel some request, use "},{"type":"element","tag":"a","props":{"href":"https://axios-http.com/docs/cancellation","rel":["nofollow"]},"children":[{"type":"text","value":"axios with AbortController"}]},{"type":"text","value":". Previously axios used cancellation token, but now it's deprecated."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"AbortController"}]},{"type":"text","value":" can be used with a multiple requests to cancel them at once."}]},{"type":"element","tag":"code","props":{"code":"import { useCallback, useRef } from \"react\";\nimport axios from 'axios';\n\nconst client = axios.create();\n\nexport const useGetUsers = () => {\n const controller = useRef(new AbortController());\n \n const get = useCallback(async () => {\n const result = await client.get(\"/\", {\n // params and props here\n signal: controller.current.signal,\n });\n\n return result.data;\n }, []);\n\n const cancel = useCallback(() => {\n controller.current.abort();\n \n // controller should be rewritten or all requests will fail\n controller.current = new AbortController();\n }, [controller]);\n\n return { get, cancel };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { useCallback, useRef } from \"react\";\nimport axios from 'axios';\n\nconst client = axios.create();\n\nexport const useGetUsers = () => {\n const controller = useRef(new AbortController());\n \n const get = useCallback(async () => {\n const result = await client.get(\"/\", {\n // params and props here\n signal: controller.current.signal,\n });\n\n return result.data;\n }, []);\n\n const cancel = useCallback(() => {\n controller.current.abort();\n \n // controller should be rewritten or all requests will fail\n controller.current = new AbortController();\n }, [controller]);\n\n return { get, cancel };\n};\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If you need to cancel some request, use "},{"type":"element","tag":"a","props":{"href":"https://axios-http.com/docs/cancellation","rel":["nofollow"]},"children":[{"type":"text","value":"axios with AbortController"}]},{"type":"text","value":". Previously axios used cancellation token, but now it's deprecated."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"AbortController"}]},{"type":"text","value":" can be used with a multiple requests to cancel them at once."}]},{"type":"element","tag":"code","props":{"code":"import { useCallback, useRef } from \"react\";\nimport axios from 'axios';\n\nconst client = axios.create();\n\nexport const useGetUsers = () => {\n const controller = useRef(new AbortController());\n \n const get = useCallback(async () => {\n const result = await client.get(\"/\", {\n // params and props here\n signal: controller.current.signal,\n });\n\n return result.data;\n }, []);\n\n const cancel = useCallback(() => {\n controller.current.abort();\n \n // controller should be rewritten or all requests will fail\n controller.current = new AbortController();\n }, [controller]);\n\n return { get, cancel };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-509459"},"children":[{"type":"text","value":"\"react\""}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-509459"},"children":[{"type":"text","value":"'axios'"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-424511"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-34d3f4"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b9c34f"},"children":[{"type":"text","value":"create"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-424511"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9c34f"},"children":[{"type":"text","value":"useGetUsers"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-424511"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-424511"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-34d3f4"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9c34f"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9c34f"},"children":[{"type":"text","value":"AbortController"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"());"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-424511"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-34d3f4"},"children":[{"type":"text","value":"get"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9c34f"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-424511"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-424511"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-424511"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-34d3f4"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b9c34f"},"children":[{"type":"text","value":"get"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-509459"},"children":[{"type":"text","value":"\"/\""}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1fa0ed"},"children":[{"type":"text","value":"// params and props here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" signal: "}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"signal"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" }, []);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-424511"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-34d3f4"},"children":[{"type":"text","value":"cancel"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9c34f"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-424511"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b9c34f"},"children":[{"type":"text","value":"abort"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1fa0ed"},"children":[{"type":"text","value":"// controller should be rewritten or all requests will fail"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9c34f"},"children":[{"type":"text","value":"AbortController"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" }, ["}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"]);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"get"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"cancel"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-1fa0ed{color:#8B949E}.ct-b9c34f{color:#D2A8FF}.ct-34d3f4{color:#79C0FF}.ct-424511{color:#FF7B72}.ct-509459{color:#A5D6FF}.ct-b3c3b1{color:#C9D1D9}.ct-763991{color:#C9D1D9}.ct-20c8c4{color:#FF7B72}.light .ct-20c8c4{color:#859900}.light .ct-763991{color:#657B83}.light .ct-b3c3b1{color:#268BD2}.light .ct-509459{color:#2AA198}.light .ct-424511{color:#073642}.light .ct-34d3f4{color:#268BD2}.light .ct-b9c34f{color:#268BD2}.light .ct-1fa0ed{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:React:Axios with AbortController.md","_source":"content","_file":"Frontend/React/Axios with AbortController.md","_extension":"md"},{"_path":"/frontend/react/detect-hook-deps-changes-with-usewhatschanged","_dir":"react","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Detect Hook Deps Changes With UseWhatsChanged","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"code","props":{"code":"import { useEffect, useRef } from 'react';\n\n/** Pass dictionary of `props` as argument and it will\n * tell you, which one changed after rerender.\n * Use `prefix` to distinguish props of different components.\n */\nexport const useWhatsChanged = (\n props: Record,\n prefix = '',\n) => {\n const prevProps = useRef(props);\n\n useEffect(() => {\n Object.entries(props).forEach(([key, value]) => {\n if (\n !Object.prototype.hasOwnProperty.call(prevProps.current, key) ||\n prevProps.current[key] !== value\n ) {\n console.log(`${prefix} ${key} has changed`);\n }\n });\n\n prevProps.current = props;\n }, [props, prefix]);\n};\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { useEffect, useRef } from 'react';\n\n/** Pass dictionary of `props` as argument and it will\n * tell you, which one changed after rerender.\n * Use `prefix` to distinguish props of different components.\n */\nexport const useWhatsChanged = (\n props: Record,\n prefix = '',\n) => {\n const prevProps = useRef(props);\n\n useEffect(() => {\n Object.entries(props).forEach(([key, value]) => {\n if (\n !Object.prototype.hasOwnProperty.call(prevProps.current, key) ||\n prevProps.current[key] !== value\n ) {\n console.log(`${prefix} ${key} has changed`);\n }\n });\n\n prevProps.current = props;\n }, [props, prefix]);\n};\n\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"code","props":{"code":"import { useEffect, useRef } from 'react';\n\n/** Pass dictionary of `props` as argument and it will\n * tell you, which one changed after rerender.\n * Use `prefix` to distinguish props of different components.\n */\nexport const useWhatsChanged = (\n props: Record,\n prefix = '',\n) => {\n const prevProps = useRef(props);\n\n useEffect(() => {\n Object.entries(props).forEach(([key, value]) => {\n if (\n !Object.prototype.hasOwnProperty.call(prevProps.current, key) ||\n prevProps.current[key] !== value\n ) {\n console.log(`${prefix} ${key} has changed`);\n }\n });\n\n prevProps.current = props;\n }, [props, prefix]);\n};\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ca2f8e"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-ca2f8e"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-34dada"},"children":[{"type":"text","value":"'react'"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b09843"},"children":[{"type":"text","value":"/** Pass dictionary of `props` as argument and it will"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b09843"},"children":[{"type":"text","value":" * tell you, which one changed after rerender."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b09843"},"children":[{"type":"text","value":" * Use `prefix` to distinguish props of different components."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b09843"},"children":[{"type":"text","value":" */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ca2f8e"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a12dc4"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6e8da2"},"children":[{"type":"text","value":"useWhatsChanged"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ca2f8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e7e798"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2785b1"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-d5ec24"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-e7e798"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-520617"},"children":[{"type":"text","value":"Record"}]},{"type":"element","tag":"span","props":{"class":"ct-e7e798"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-ed0b46"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-e7e798"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-ed0b46"},"children":[{"type":"text","value":"unknown"}]},{"type":"element","tag":"span","props":{"class":"ct-e7e798"},"children":[{"type":"text","value":">,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"prefix"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ca2f8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-34dada"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-a12dc4"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a12dc4"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-692261"},"children":[{"type":"text","value":"prevProps"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ca2f8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6e8da2"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6e8da2"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-a12dc4"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e7e798"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed0b46"},"children":[{"type":"text","value":"Object"}]},{"type":"element","tag":"span","props":{"class":"ct-e7e798"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2412ed"},"children":[{"type":"text","value":"entries"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ca2f8e"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"prevProps"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":"] "}]},{"type":"element","tag":"span","props":{"class":"ct-ca2f8e"},"children":[{"type":"text","value":"!=="}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"value"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6e8da2"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-34dada"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"prefix"}]},{"type":"element","tag":"span","props":{"class":"ct-34dada"},"children":[{"type":"text","value":"} ${"}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-34dada"},"children":[{"type":"text","value":"} has changed`"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"prevProps"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ca2f8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" }, ["}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"prefix"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":"]);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-2412ed{color:#D2A8FF}.ct-692261{color:#79C0FF}.ct-ed0b46{color:#79C0FF}.ct-520617{color:#FFA657}.ct-d5ec24{color:#FF7B72}.ct-2785b1{color:#FFA657}.ct-e7e798{color:#C9D1D9}.ct-6e8da2{color:#D2A8FF}.ct-a12dc4{color:#FF7B72}.ct-b09843{color:#8B949E}.ct-34dada{color:#A5D6FF}.ct-4d5aa5{color:#C9D1D9}.ct-20cbd5{color:#C9D1D9}.ct-ca2f8e{color:#FF7B72}.light .ct-ca2f8e{color:#859900}.light .ct-20cbd5{color:#657B83}.light .ct-4d5aa5{color:#268BD2}.light .ct-34dada{color:#2AA198}.light .ct-b09843{color:#93A1A1}.light .ct-a12dc4{color:#073642}.light .ct-6e8da2{color:#268BD2}.light .ct-e7e798{color:#657B83}.light .ct-2785b1{color:#657B83}.light .ct-d5ec24{color:#859900}.light .ct-520617{color:#268BD2}.light .ct-ed0b46{color:#859900}.light .ct-692261{color:#268BD2}.light .ct-2412ed{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:React:Detect hook deps changes with useWhatsChanged.md","_source":"content","_file":"Frontend/React/Detect hook deps changes with useWhatsChanged.md","_extension":"md"},{"_path":"/frontend/vue/adding-global-properties-to-component","_dir":"vue","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Adding Global Properties To Component","description":"The topic's fully covered in the official documentation and in Add global variable to window.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The topic's fully covered in the "},{"type":"element","tag":"a","props":{"href":"https://vuejs.org/guide/typescript/options-api.html#augmenting-global-properties","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]},{"type":"text","value":" and in "},{"type":"element","tag":"a","props":{"href":"Add%20global%20variable%20to%20window"},"children":[{"type":"text","value":"Add global variable to window"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For example, you want to add global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$http"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$translate"}]},{"type":"text","value":" services to all of project's components:"}]},{"type":"element","tag":"code","props":{"code":"// ~/index.d.ts or ~/custom.d.ts\n\nimport axios from 'axios'\n\ndeclare module 'vue' {\n interface ComponentCustomProperties {\n $http: typeof axios\n $translate: (key: string) => string\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// ~/index.d.ts or ~/custom.d.ts\n\nimport axios from 'axios'\n\ndeclare module 'vue' {\n interface ComponentCustomProperties {\n $http: typeof axios\n $translate: (key: string) => string\n }\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The topic's fully covered in the "},{"type":"element","tag":"a","props":{"href":"https://vuejs.org/guide/typescript/options-api.html#augmenting-global-properties","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]},{"type":"text","value":" and in "},{"type":"element","tag":"a","props":{"href":"Add%20global%20variable%20to%20window"},"children":[{"type":"text","value":"Add global variable to window"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For example, you want to add global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$http"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$translate"}]},{"type":"text","value":" services to all of project's components:"}]},{"type":"element","tag":"code","props":{"code":"// ~/index.d.ts or ~/custom.d.ts\n\nimport axios from 'axios'\n\ndeclare module 'vue' {\n interface ComponentCustomProperties {\n $http: typeof axios\n $translate: (key: string) => string\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-026e23"},"children":[{"type":"text","value":"// ~/index.d.ts or ~/custom.d.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3204ed"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bada2"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3204ed"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-318f96"},"children":[{"type":"text","value":"'axios'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a2afa"},"children":[{"type":"text","value":"declare"}]},{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1a2afa"},"children":[{"type":"text","value":"module"}]},{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-318f96"},"children":[{"type":"text","value":"'vue'"}]},{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1a2afa"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-772f4e"},"children":[{"type":"text","value":"ComponentCustomProperties"}]},{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-07f096"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b5f651"},"children":[{"type":"text","value":"$translate"}]},{"type":"element","tag":"span","props":{"class":"ct-4eb8ad"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-07f096"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-3f2b67"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-4eb8ad"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-07f096"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-41a6a6"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-07f096"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-cd10b7"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-07f096"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-41a6a6"},"children":[{"type":"text","value":"string"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-cd10b7{color:#FF7B72}.ct-41a6a6{color:#79C0FF}.ct-3f2b67{color:#FFA657}.ct-4eb8ad{color:#FF7B72}.ct-b5f651{color:#D2A8FF}.ct-07f096{color:#C9D1D9}.ct-772f4e{color:#FFA657}.ct-1a2afa{color:#FF7B72}.ct-318f96{color:#A5D6FF}.ct-7bada2{color:#C9D1D9}.ct-720b32{color:#C9D1D9}.ct-3204ed{color:#FF7B72}.ct-026e23{color:#8B949E}.light .ct-026e23{color:#93A1A1}.light .ct-3204ed{color:#859900}.light .ct-720b32{color:#657B83}.light .ct-7bada2{color:#268BD2}.light .ct-318f96{color:#2AA198}.light .ct-1a2afa{color:#073642}.light .ct-772f4e{color:#268BD2}.light .ct-07f096{color:#657B83}.light .ct-b5f651{color:#268BD2}.light .ct-4eb8ad{color:#859900}.light .ct-3f2b67{color:#657B83}.light .ct-41a6a6{color:#859900}.light .ct-cd10b7{color:#073642}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:Vue:Adding global properties to component.md","_source":"content","_file":"Frontend/Vue/Adding global properties to component.md","_extension":"md"},{"_path":"/frontend/vue/make-nuxt-handle-obsidian-highlights","_dir":"vue","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Make Nuxt Handle Obsidian Highlights","description":"By default Nuxt Content Plugin not handling highlight links. To fix that we will create Nitro plugin:","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"By default "},{"type":"element","tag":"a","props":{"href":"https://content.nuxtjs.org","rel":["nofollow"]},"children":[{"type":"text","value":"Nuxt Content Plugin"}]},{"type":"text","value":" not handling "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"highlight"}]},{"type":"text","value":" links. To fix that we will create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Nitro"}]},{"type":"text","value":" plugin:"}]},{"type":"element","tag":"code","props":{"code":"// ~/server/plugins/highlight.ts\nexport default defineNitroPlugin((nitroApp) => {\n nitroApp.hooks.hook(\"content:file:beforeParse\", (file) => {\n if (file._id.endsWith(\".md\")) {\n file.body = file.body.replace(\n /==([^=]+)==/gs,\n `$1`\n );\n }\n });\n});\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// ~/server/plugins/highlight.ts\nexport default defineNitroPlugin((nitroApp) => {\n nitroApp.hooks.hook(\"content:file:beforeParse\", (file) => {\n if (file._id.endsWith(\".md\")) {\n file.body = file.body.replace(\n /==([^=]+)==/gs,\n `$1`\n );\n }\n });\n});\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"By default "},{"type":"element","tag":"a","props":{"href":"https://content.nuxtjs.org","rel":["nofollow"]},"children":[{"type":"text","value":"Nuxt Content Plugin"}]},{"type":"text","value":" not handling "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"highlight"}]},{"type":"text","value":" links. To fix that we will create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Nitro"}]},{"type":"text","value":" plugin:"}]},{"type":"element","tag":"code","props":{"code":"// ~/server/plugins/highlight.ts\nexport default defineNitroPlugin((nitroApp) => {\n nitroApp.hooks.hook(\"content:file:beforeParse\", (file) => {\n if (file._id.endsWith(\".md\")) {\n file.body = file.body.replace(\n /==([^=]+)==/gs,\n `$1`\n );\n }\n });\n});\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2ddfc7"},"children":[{"type":"text","value":"// ~/server/plugins/highlight.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-69d133"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-56b7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-69d133"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-56b7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-de9555"},"children":[{"type":"text","value":"defineNitroPlugin"}]},{"type":"element","tag":"span","props":{"class":"ct-56b7c0"},"children":[{"type":"text","value":"((nitroApp) "}]},{"type":"element","tag":"span","props":{"class":"ct-a255e4"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-56b7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4e7048"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86abab"},"children":[{"type":"text","value":"nitroApp"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-86abab"},"children":[{"type":"text","value":"hooks"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-1a3ebb"},"children":[{"type":"text","value":"hook"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-382167"},"children":[{"type":"text","value":"\"content:file:beforeParse\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f787a"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-86abab"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-86abab"},"children":[{"type":"text","value":"_id"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-1a3ebb"},"children":[{"type":"text","value":"endsWith"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-382167"},"children":[{"type":"text","value":"\".md\""}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86abab"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-86abab"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f787a"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86abab"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-86abab"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-1a3ebb"},"children":[{"type":"text","value":"replace"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a4f28"},"children":[{"type":"text","value":"/==("}]},{"type":"element","tag":"span","props":{"class":"ct-0a6144"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-0f787a"},"children":[{"type":"text","value":"^"}]},{"type":"element","tag":"span","props":{"class":"ct-0a6144"},"children":[{"type":"text","value":"=]"}]},{"type":"element","tag":"span","props":{"class":"ct-0f787a"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-6a4f28"},"children":[{"type":"text","value":")==/"}]},{"type":"element","tag":"span","props":{"class":"ct-0f787a"},"children":[{"type":"text","value":"gs"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-382167"},"children":[{"type":"text","value":"`$1`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e7048"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-56b7c0"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-4e7048"},"children":[{"type":"text","value":";"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-0a6144{color:#79C0FF}.ct-6a4f28{color:#A5D6FF}.ct-0f787a{color:#FF7B72}.ct-382167{color:#A5D6FF}.ct-1a3ebb{color:#D2A8FF}.ct-86abab{color:#C9D1D9}.ct-7ad72d{color:#C9D1D9}.ct-4e7048{color:#C9D1D9}.ct-a255e4{color:#FF7B72}.ct-de9555{color:#D2A8FF}.ct-56b7c0{color:#FFA657}.ct-69d133{color:#FF7B72}.ct-2ddfc7{color:#8B949E}.light .ct-2ddfc7{color:#93A1A1}.light .ct-69d133{color:#859900}.light .ct-56b7c0{color:#657B83}.light .ct-de9555{color:#268BD2}.light .ct-a255e4{color:#073642}.light .ct-4e7048{color:#657B83}.light .ct-7ad72d{color:#657B83}.light .ct-86abab{color:#268BD2}.light .ct-1a3ebb{color:#268BD2}.light .ct-382167{color:#2AA198}.light .ct-0f787a{color:#859900}.light .ct-6a4f28{color:#D30102}.light .ct-0a6144{color:#CB4B16}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:Vue:Make Nuxt handle Obsidian highlights.md","_source":"content","_file":"Frontend/Vue/Make Nuxt handle Obsidian highlights.md","_extension":"md"},{"_path":"/frontend/webgl/basics-of-webgl-(drawing-a-cube)","_dir":"webgl","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Basics Of WebGL (Drawing A Cube)","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"helpful-documentation"},"children":[{"type":"text","value":"Helpful documentation"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://open.gl/","rel":["nofollow"]},"children":[{"type":"text","value":"https://open.gl/"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"This youtube series: "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=kB0ZVUrI4Aw","rel":["nofollow"]},"children":[{"type":"text","value":"Basics"}]},{"type":"text","value":", "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=3yLL9ADo-ko","rel":["nofollow"]},"children":[{"type":"text","value":"Making a cube, applying transformations"}]},{"type":"text","value":", "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=hpnd11doMgc&t=52s","rel":["nofollow"]},"children":[{"type":"text","value":"Texturing"}]}]}]},{"type":"element","tag":"h2","props":{"id":"vertices-and-indices"},"children":[{"type":"text","value":"Vertices and Indices"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertices"}]},{"type":"text","value":" are points with specific coordinates "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"{x,y,z}"}]},{"type":"text","value":" in a 3D-space. We can build any figure by connecting "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"vertices"}]},{"type":"text","value":" in triangles with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"indices"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"shaders"},"children":[{"type":"text","value":"Shaders"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shaders are functions, written in C, which describe how to draw and color polygons to Graphic Card."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" describe "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"vertice"}]},{"type":"text","value":" positions, so Graphic Card can position them by connecting with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"indices"}]},{"type":"text","value":" and project to 2D canvas."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" describe the way polygons should be colored by assigning colors to Vertices or by applying textures to polygons."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shaders can have parameters passed from Javascript code ("},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniforms"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"attributes"}]},{"type":"text","value":"). "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" can also access data from "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" (that ones called "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":")."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"img","props":{"alt":"","src":"https://open.gl/media/img/c2_pipeline.png"},"children":[]}]},{"type":"element","tag":"h2","props":{"id":"program"},"children":[{"type":"text","value":"Program"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Program, as far as I understand, is a scene, that's described with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertices"}]},{"type":"text","value":", "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Indices"}]},{"type":"text","value":", specific "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" and "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"applying-transformations"},"children":[{"type":"text","value":"Applying transformations"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The best way to change positions inside "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" or color in "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" is to pass parameters (also called "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniforms"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":")."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read about that at "},{"type":"element","tag":"a","props":{"href":"https://open.gl/transformations","rel":["nofollow"]},"children":[{"type":"text","value":"open.gl"}]},{"type":"text","value":" and at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"source-code-with-explanations"},"children":[{"type":"text","value":"Source code with explanations"}]},{"type":"element","tag":"code","props":{"code":"// render-a-cube.ts\nimport { createShader } from \"./create-shader\";\nimport vxShader from \"./vertex.glsl?raw\";\nimport fgShader from \"./fragment.glsl?raw\";\n\nconst canvas = document.getElementyId('view');\nconst ctx = canvas.getRenderingContext('webgl');\n\n// should be put inside requestAnimationFrame\ndrawCube(ctx)(); \n\nfunction drawCube (\n gl: WebGL2RenderingContext, \n width: number,\n height: number\n) {\n // Initializing viewport\n gl.viewport(0, 0, width, height);\n gl.clearColor(0, 0, 0, 0);\n gl.clear(gl.COLOR_BUFFER_BIT);\n\n const prg = gl.createProgram();\n if (!prg) {\n throw new Error(\"Can't init programm\");\n }\n\n // Setting up VERTEX and FRAGMENT shaders\n const vx = createShader(gl, vxShader, gl.VERTEX_SHADER);\n gl.attachShader(prg, vx);\n const fx = createShader(gl, fgShader, gl.FRAGMENT_SHADER);\n gl.attachShader(prg, fx);\n gl.linkProgram(prg);\n if (!gl.getProgramParameter(prg, gl.LINK_STATUS)) {\n throw new Error(\"Could not initialise shaders\");\n }\n\n // Cube's vertices Array<[x,y,z]>, 8 items\n const vertices = [\n -1, -1, -1, // 0\n 1, -1, -1, // 1\n 1, 1, -1, // 2\n -1, 1, -1, // 3\n -1, -1, 1, // 4\n 1, -1, 1, // 5\n 1, 1, 1, // 6\n -1, 1, 1, // 7\n ];\n\n // indices, that form triangles, that form cube sides\n const indices = [\n 2, 1, 0, // side 0 (first triangle)\n 0, 3, 2, // side 0 (second triangle)\n 0, 4, 7, // side 1 (first triangle)\n 7, 3, 0, // side 1 (second triangle)\n 0, 1, 5, // ...\n 5, 4, 0, \n 1, 2, 6, \n 6, 5, 1, \n 2, 3, 7, \n 7, 6, 2, \n 4, 5, 6, \n 6, 7, 4,\n ];\n\n // createe a vertex buffer and bind vertices to it\n const squareVertexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);\n gl.bindBuffer(gl.ARRAY_BUFFER, null);\n\n // create a vertex buffer and bind indices to it\n const squareIndexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, squareIndexBuffer);\n gl.bufferData(\n gl.ELEMENT_ARRAY_BUFFER,\n new Uint16Array(indices),\n gl.STATIC_DRAW\n );\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, null);\n\n // initial drawing\n gl.clearColor(0.0, 0.0, 0.0, 0.0);\n gl.enable(gl.DEPTH_TEST);\n gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);\n gl.viewport(0, 0, width, height);\n\n // bind squareVertexBuffer as vertex positions buffer\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n \n // send every 3 bytes from squareVertexBuffer as {x,y,z} for each verticle\n gl.vertexAttribPointer(\n gl.getAttribLocation(prg, \"aVertexPosition\"), \n 3, // 3 bytes-long\n gl.FLOAT,\n false, // don't normalize (int to float)\n 0, \n 0\n );\n // send vertice buffer as `aVertexPosition` attribute inside vertex shader\n gl.enableVertexAttribArray(\n gl.getAttribLocation(prg, \"aVertexPosition\")\n );\n\n let i = 0;\n let speed = 0.01;\n\n // that's the main rendering callback\n return () => {\n gl.useProgram(prg);\n\n const scale = i * 0.25 + 0.25;\n\n // used for scaling inside Vertex Shader\n gl.uniform1f(gl.getUniformLocation(prg, \"slide\"), scale);\n // GL Screen is square, so we need to fix it's aspect ration\n gl.uniform1f(gl.getUniformLocation(prg, \"aspect\"), height / width);\n\n gl.bindBuffer(\n gl.ELEMENT_ARRAY_BUFFER, \n squareIndexBuffer\n );\n \n gl.drawElements(\n gl.TRIANGLES, \n indices.length, \n gl.UNSIGNED_SHORT, \n 0,\n );\n\n if (i > 1 || i < 0) {\n speed = -speed;\n }\n\n i += speed;\n };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// render-a-cube.ts\nimport { createShader } from \"./create-shader\";\nimport vxShader from \"./vertex.glsl?raw\";\nimport fgShader from \"./fragment.glsl?raw\";\n\nconst canvas = document.getElementyId('view');\nconst ctx = canvas.getRenderingContext('webgl');\n\n// should be put inside requestAnimationFrame\ndrawCube(ctx)(); \n\nfunction drawCube (\n gl: WebGL2RenderingContext, \n width: number,\n height: number\n) {\n // Initializing viewport\n gl.viewport(0, 0, width, height);\n gl.clearColor(0, 0, 0, 0);\n gl.clear(gl.COLOR_BUFFER_BIT);\n\n const prg = gl.createProgram();\n if (!prg) {\n throw new Error(\"Can't init programm\");\n }\n\n // Setting up VERTEX and FRAGMENT shaders\n const vx = createShader(gl, vxShader, gl.VERTEX_SHADER);\n gl.attachShader(prg, vx);\n const fx = createShader(gl, fgShader, gl.FRAGMENT_SHADER);\n gl.attachShader(prg, fx);\n gl.linkProgram(prg);\n if (!gl.getProgramParameter(prg, gl.LINK_STATUS)) {\n throw new Error(\"Could not initialise shaders\");\n }\n\n // Cube's vertices Array<[x,y,z]>, 8 items\n const vertices = [\n -1, -1, -1, // 0\n 1, -1, -1, // 1\n 1, 1, -1, // 2\n -1, 1, -1, // 3\n -1, -1, 1, // 4\n 1, -1, 1, // 5\n 1, 1, 1, // 6\n -1, 1, 1, // 7\n ];\n\n // indices, that form triangles, that form cube sides\n const indices = [\n 2, 1, 0, // side 0 (first triangle)\n 0, 3, 2, // side 0 (second triangle)\n 0, 4, 7, // side 1 (first triangle)\n 7, 3, 0, // side 1 (second triangle)\n 0, 1, 5, // ...\n 5, 4, 0, \n 1, 2, 6, \n 6, 5, 1, \n 2, 3, 7, \n 7, 6, 2, \n 4, 5, 6, \n 6, 7, 4,\n ];\n\n // createe a vertex buffer and bind vertices to it\n const squareVertexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);\n gl.bindBuffer(gl.ARRAY_BUFFER, null);\n\n // create a vertex buffer and bind indices to it\n const squareIndexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, squareIndexBuffer);\n gl.bufferData(\n gl.ELEMENT_ARRAY_BUFFER,\n new Uint16Array(indices),\n gl.STATIC_DRAW\n );\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, null);\n\n // initial drawing\n gl.clearColor(0.0, 0.0, 0.0, 0.0);\n gl.enable(gl.DEPTH_TEST);\n gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);\n gl.viewport(0, 0, width, height);\n\n // bind squareVertexBuffer as vertex positions buffer\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n \n // send every 3 bytes from squareVertexBuffer as {x,y,z} for each verticle\n gl.vertexAttribPointer(\n gl.getAttribLocation(prg, \"aVertexPosition\"), \n 3, // 3 bytes-long\n gl.FLOAT,\n false, // don't normalize (int to float)\n 0, \n 0\n );\n // send vertice buffer as `aVertexPosition` attribute inside vertex shader\n gl.enableVertexAttribArray(\n gl.getAttribLocation(prg, \"aVertexPosition\")\n );\n\n let i = 0;\n let speed = 0.01;\n\n // that's the main rendering callback\n return () => {\n gl.useProgram(prg);\n\n const scale = i * 0.25 + 0.25;\n\n // used for scaling inside Vertex Shader\n gl.uniform1f(gl.getUniformLocation(prg, \"slide\"), scale);\n // GL Screen is square, so we need to fix it's aspect ration\n gl.uniform1f(gl.getUniformLocation(prg, \"aspect\"), height / width);\n\n gl.bindBuffer(\n gl.ELEMENT_ARRAY_BUFFER, \n squareIndexBuffer\n );\n \n gl.drawElements(\n gl.TRIANGLES, \n indices.length, \n gl.UNSIGNED_SHORT, \n 0,\n );\n\n if (i > 1 || i < 0) {\n speed = -speed;\n }\n\n i += speed;\n };\n};\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"shader-compiler"},"children":[{"type":"text","value":"Shader compiler"}]},{"type":"element","tag":"code","props":{"code":"// create-shader.ts\nexport const createShader = (\n gl: WebGL2RenderingContext,\n sourceCode: string,\n type: number, // gl.VERTEX_SHADER or gl.FRAGMENT_SHADER\n) => {\n const shader = gl.createShader(type);\n if (!shader) {\n throw new Error(`Can't init shader`);\n }\n\n gl.shaderSource(shader, sourceCode);\n gl.compileShader(shader);\n\n if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {\n const info = gl.getShaderInfoLog(shader);\n throw `Could not compile WebGL program. \\n\\n${info}`;\n }\n\n return shader;\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// create-shader.ts\nexport const createShader = (\n gl: WebGL2RenderingContext,\n sourceCode: string,\n type: number, // gl.VERTEX_SHADER or gl.FRAGMENT_SHADER\n) => {\n const shader = gl.createShader(type);\n if (!shader) {\n throw new Error(`Can't init shader`);\n }\n\n gl.shaderSource(shader, sourceCode);\n gl.compileShader(shader);\n\n if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {\n const info = gl.getShaderInfoLog(shader);\n throw `Could not compile WebGL program. \\n\\n${info}`;\n }\n\n return shader;\n};\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"vertex-shader-example"},"children":[{"type":"text","value":"Vertex Shader Example"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read more at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]}]},{"type":"element","tag":"code","props":{"code":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"fragment-shader-example"},"children":[{"type":"text","value":"Fragment Shader Example"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read more at "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"helpful-documentation"},"children":[{"type":"text","value":"Helpful documentation"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://open.gl/","rel":["nofollow"]},"children":[{"type":"text","value":"https://open.gl/"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"This youtube series: "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=kB0ZVUrI4Aw","rel":["nofollow"]},"children":[{"type":"text","value":"Basics"}]},{"type":"text","value":", "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=3yLL9ADo-ko","rel":["nofollow"]},"children":[{"type":"text","value":"Making a cube, applying transformations"}]},{"type":"text","value":", "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=hpnd11doMgc&t=52s","rel":["nofollow"]},"children":[{"type":"text","value":"Texturing"}]}]}]},{"type":"element","tag":"h2","props":{"id":"vertices-and-indices"},"children":[{"type":"text","value":"Vertices and Indices"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertices"}]},{"type":"text","value":" are points with specific coordinates "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"{x,y,z}"}]},{"type":"text","value":" in a 3D-space. We can build any figure by connecting "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"vertices"}]},{"type":"text","value":" in triangles with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"indices"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"shaders"},"children":[{"type":"text","value":"Shaders"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shaders are functions, written in C, which describe how to draw and color polygons to Graphic Card."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" describe "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"vertice"}]},{"type":"text","value":" positions, so Graphic Card can position them by connecting with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"indices"}]},{"type":"text","value":" and project to 2D canvas."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" describe the way polygons should be colored by assigning colors to Vertices or by applying textures to polygons."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shaders can have parameters passed from Javascript code ("},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniforms"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"attributes"}]},{"type":"text","value":"). "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" can also access data from "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" (that ones called "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":")."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"img","props":{"alt":"","src":"https://open.gl/media/img/c2_pipeline.png"},"children":[]}]},{"type":"element","tag":"h2","props":{"id":"program"},"children":[{"type":"text","value":"Program"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Program, as far as I understand, is a scene, that's described with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertices"}]},{"type":"text","value":", "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Indices"}]},{"type":"text","value":", specific "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" and "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"applying-transformations"},"children":[{"type":"text","value":"Applying transformations"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The best way to change positions inside "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" or color in "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" is to pass parameters (also called "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniforms"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":")."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read about that at "},{"type":"element","tag":"a","props":{"href":"https://open.gl/transformations","rel":["nofollow"]},"children":[{"type":"text","value":"open.gl"}]},{"type":"text","value":" and at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"source-code-with-explanations"},"children":[{"type":"text","value":"Source code with explanations"}]},{"type":"element","tag":"code","props":{"code":"// render-a-cube.ts\nimport { createShader } from \"./create-shader\";\nimport vxShader from \"./vertex.glsl?raw\";\nimport fgShader from \"./fragment.glsl?raw\";\n\nconst canvas = document.getElementyId('view');\nconst ctx = canvas.getRenderingContext('webgl');\n\n// should be put inside requestAnimationFrame\ndrawCube(ctx)(); \n\nfunction drawCube (\n gl: WebGL2RenderingContext, \n width: number,\n height: number\n) {\n // Initializing viewport\n gl.viewport(0, 0, width, height);\n gl.clearColor(0, 0, 0, 0);\n gl.clear(gl.COLOR_BUFFER_BIT);\n\n const prg = gl.createProgram();\n if (!prg) {\n throw new Error(\"Can't init programm\");\n }\n\n // Setting up VERTEX and FRAGMENT shaders\n const vx = createShader(gl, vxShader, gl.VERTEX_SHADER);\n gl.attachShader(prg, vx);\n const fx = createShader(gl, fgShader, gl.FRAGMENT_SHADER);\n gl.attachShader(prg, fx);\n gl.linkProgram(prg);\n if (!gl.getProgramParameter(prg, gl.LINK_STATUS)) {\n throw new Error(\"Could not initialise shaders\");\n }\n\n // Cube's vertices Array<[x,y,z]>, 8 items\n const vertices = [\n -1, -1, -1, // 0\n 1, -1, -1, // 1\n 1, 1, -1, // 2\n -1, 1, -1, // 3\n -1, -1, 1, // 4\n 1, -1, 1, // 5\n 1, 1, 1, // 6\n -1, 1, 1, // 7\n ];\n\n // indices, that form triangles, that form cube sides\n const indices = [\n 2, 1, 0, // side 0 (first triangle)\n 0, 3, 2, // side 0 (second triangle)\n 0, 4, 7, // side 1 (first triangle)\n 7, 3, 0, // side 1 (second triangle)\n 0, 1, 5, // ...\n 5, 4, 0, \n 1, 2, 6, \n 6, 5, 1, \n 2, 3, 7, \n 7, 6, 2, \n 4, 5, 6, \n 6, 7, 4,\n ];\n\n // createe a vertex buffer and bind vertices to it\n const squareVertexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);\n gl.bindBuffer(gl.ARRAY_BUFFER, null);\n\n // create a vertex buffer and bind indices to it\n const squareIndexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, squareIndexBuffer);\n gl.bufferData(\n gl.ELEMENT_ARRAY_BUFFER,\n new Uint16Array(indices),\n gl.STATIC_DRAW\n );\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, null);\n\n // initial drawing\n gl.clearColor(0.0, 0.0, 0.0, 0.0);\n gl.enable(gl.DEPTH_TEST);\n gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);\n gl.viewport(0, 0, width, height);\n\n // bind squareVertexBuffer as vertex positions buffer\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n \n // send every 3 bytes from squareVertexBuffer as {x,y,z} for each verticle\n gl.vertexAttribPointer(\n gl.getAttribLocation(prg, \"aVertexPosition\"), \n 3, // 3 bytes-long\n gl.FLOAT,\n false, // don't normalize (int to float)\n 0, \n 0\n );\n // send vertice buffer as `aVertexPosition` attribute inside vertex shader\n gl.enableVertexAttribArray(\n gl.getAttribLocation(prg, \"aVertexPosition\")\n );\n\n let i = 0;\n let speed = 0.01;\n\n // that's the main rendering callback\n return () => {\n gl.useProgram(prg);\n\n const scale = i * 0.25 + 0.25;\n\n // used for scaling inside Vertex Shader\n gl.uniform1f(gl.getUniformLocation(prg, \"slide\"), scale);\n // GL Screen is square, so we need to fix it's aspect ration\n gl.uniform1f(gl.getUniformLocation(prg, \"aspect\"), height / width);\n\n gl.bindBuffer(\n gl.ELEMENT_ARRAY_BUFFER, \n squareIndexBuffer\n );\n \n gl.drawElements(\n gl.TRIANGLES, \n indices.length, \n gl.UNSIGNED_SHORT, \n 0,\n );\n\n if (i > 1 || i < 0) {\n speed = -speed;\n }\n\n i += speed;\n };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// render-a-cube.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"\"./create-shader\""}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"vxShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"\"./vertex.glsl?raw\""}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"fgShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"\"./fragment.glsl?raw\""}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"document"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"getElementyId"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"'view'"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"getRenderingContext"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"'webgl'"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// should be put inside requestAnimationFrame"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"drawCube"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":")(); "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"function"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"drawCube"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3178b0"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-55a926"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e6f7d7"},"children":[{"type":"text","value":"WebGL2RenderingContext"}]},{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3178b0"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-55a926"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0a644"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3178b0"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-55a926"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0a644"},"children":[{"type":"text","value":"number"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// Initializing viewport"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"viewport"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"clearColor"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"clear"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"COLOR_BUFFER_BIT"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"createProgram"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a0f123"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"\"Can't init programm\""}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// Setting up VERTEX and FRAGMENT shaders"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"vx"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"vxShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"VERTEX_SHADER"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"attachShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"vx"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"fx"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"fgShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"FRAGMENT_SHADER"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"attachShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"fx"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"linkProgram"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"getProgramParameter"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"LINK_STATUS"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a0f123"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"\"Could not initialise shaders\""}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// Cube's vertices Array<[x,y,z]>, 8 items"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"vertices"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// 0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// 1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// 2"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// 3"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// 4"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// 5"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// 6"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// 7"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" ];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// indices, that form triangles, that form cube sides"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"indices"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// side 0 (first triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// side 0 (second triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// side 1 (first triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// side 1 (second triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" ];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// createe a vertex buffer and bind vertices to it"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"squareVertexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"createBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"squareVertexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"bufferData"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a0f123"},"children":[{"type":"text","value":"Float32Array"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"vertices"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"), "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"STATIC_DRAW"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-8827e1"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// create a vertex buffer and bind indices to it"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"squareIndexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"createBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"squareIndexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"bufferData"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a0f123"},"children":[{"type":"text","value":"Uint16Array"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"indices"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"STATIC_DRAW"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-8827e1"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// initial drawing"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"clearColor"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0.0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0.0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0.0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"enable"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"DEPTH_TEST"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"clear"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"COLOR_BUFFER_BIT"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"DEPTH_BUFFER_BIT"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"viewport"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// bind squareVertexBuffer as vertex positions buffer"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"squareVertexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// send every 3 bytes from squareVertexBuffer as {x,y,z} for each verticle"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"vertexAttribPointer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"getAttribLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"\"aVertexPosition\""}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"), "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// 3 bytes-long"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"FLOAT"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8827e1"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// don't normalize (int to float)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// send vertice buffer as `aVertexPosition` attribute inside vertex shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"enableVertexAttribArray"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"getAttribLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"\"aVertexPosition\""}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0.01"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// that's the main rendering callback"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"useProgram"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0.25"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// used for scaling inside Vertex Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"uniform1f"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"getUniformLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"\"slide\""}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"), "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// GL Screen is square, so we need to fix it's aspect ration"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"uniform1f"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"getUniformLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"\"aspect\""}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"), "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"squareIndexBuffer"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"drawElements"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"TRIANGLES"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"indices"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"UNSIGNED_SHORT"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"+="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"shader-compiler"},"children":[{"type":"text","value":"Shader compiler"}]},{"type":"element","tag":"code","props":{"code":"// create-shader.ts\nexport const createShader = (\n gl: WebGL2RenderingContext,\n sourceCode: string,\n type: number, // gl.VERTEX_SHADER or gl.FRAGMENT_SHADER\n) => {\n const shader = gl.createShader(type);\n if (!shader) {\n throw new Error(`Can't init shader`);\n }\n\n gl.shaderSource(shader, sourceCode);\n gl.compileShader(shader);\n\n if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {\n const info = gl.getShaderInfoLog(shader);\n throw `Could not compile WebGL program. \\n\\n${info}`;\n }\n\n return shader;\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// create-shader.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3178b0"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-55a926"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e6f7d7"},"children":[{"type":"text","value":"WebGL2RenderingContext"}]},{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3178b0"},"children":[{"type":"text","value":"sourceCode"}]},{"type":"element","tag":"span","props":{"class":"ct-55a926"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0a644"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3178b0"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-55a926"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0a644"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c24349"},"children":[{"type":"text","value":"// gl.VERTEX_SHADER or gl.FRAGMENT_SHADER"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a0f123"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"`Can't init shader`"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"shaderSource"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"sourceCode"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"compileShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"getShaderParameter"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"COMPILE_STATUS"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"info"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"getShaderInfoLog"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"`Could not compile WebGL program. "}]},{"type":"element","tag":"span","props":{"class":"ct-be2223"},"children":[{"type":"text","value":"\\n\\n"}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"info"}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"vertex-shader-example"},"children":[{"type":"text","value":"Vertex Shader Example"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read more at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]}]},{"type":"element","tag":"code","props":{"code":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// current vertice position {x,y,z,w}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"attribute vec4 aVertexPosition;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// final vertice position with all transformations applied,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// that will be passed to Fragment Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"varying vec4 v_positionWithOffset;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// Parameters passed from Javascript loop"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" slide;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" aspect;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"(){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// float array of 4 elements, same as [slide,slide,slide,1]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" vec4 scale"}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"(slide),"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// float array of 4 elements, same as [aspect,1,1,1]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" vec4 aspectRatioFix"}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"(aspect,"}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// vertice position, multiplied with matrices of scale and aspect ratio"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"aVertexPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"aspectRatioFix,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// vertice offset, that will be passed to fragment shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"fragment-shader-example"},"children":[{"type":"text","value":"Fragment Shader Example"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read more at "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"precision highp "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// parameter from Vertex Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"varying vec4 v_positionWithOffset;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// color, attached to current verticle {r,g,b,alpha}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// same a["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// v_positionWithOffset.x,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// v_positionWithOffset.y, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// v_positionWithOffset.z, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// 1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" gl_FragColor"}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"xyz"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-be2223{color:#79C0FF}.ct-c24349{color:#8B949E}.ct-8827e1{color:#79C0FF}.ct-a0f123{color:#79C0FF}.ct-d569ab{color:#79C0FF}.ct-e0a644{color:#79C0FF}.ct-e6f7d7{color:#FFA657}.ct-55a926{color:#FF7B72}.ct-3178b0{color:#FFA657}.ct-56017d{color:#C9D1D9}.ct-6a5e5c{color:#D2A8FF}.ct-e050e1{color:#79C0FF}.ct-d20acd{color:#FF7B72}.ct-c8ad10{color:#A5D6FF}.ct-cc7b48{color:#C9D1D9}.ct-5f48b1{color:#C9D1D9}.ct-bc3ef1{color:#FF7B72}.ct-6f4d62{color:#8B949E}.light .ct-6f4d62{color:#93A1A1}.light .ct-bc3ef1{color:#859900}.light .ct-5f48b1{color:#657B83}.light .ct-cc7b48{color:#268BD2}.light .ct-c8ad10{color:#2AA198}.light .ct-d20acd{color:#073642}.light .ct-e050e1{color:#268BD2}.light .ct-6a5e5c{color:#268BD2}.light .ct-56017d{color:#657B83}.light .ct-3178b0{color:#657B83}.light .ct-55a926{color:#859900}.light .ct-e6f7d7{color:#268BD2}.light .ct-e0a644{color:#859900}.light .ct-d569ab{color:#D33682}.light .ct-a0f123{color:#859900}.light .ct-8827e1{color:#B58900}.light .ct-c24349{color:#93A1A1}.light .ct-be2223{color:#CB4B16}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"helpful-documentation","depth":2,"text":"Helpful documentation"},{"id":"vertices-and-indices","depth":2,"text":"Vertices and Indices"},{"id":"shaders","depth":2,"text":"Shaders"},{"id":"program","depth":2,"text":"Program"},{"id":"applying-transformations","depth":2,"text":"Applying transformations"},{"id":"source-code-with-explanations","depth":2,"text":"Source code with explanations"},{"id":"shader-compiler","depth":2,"text":"Shader compiler"},{"id":"vertex-shader-example","depth":2,"text":"Vertex Shader Example"},{"id":"fragment-shader-example","depth":2,"text":"Fragment Shader Example"}]}},"_type":"markdown","_id":"content:Frontend:WebGL:Basics of WebGL (Drawing a Cube).md","_source":"content","_file":"Frontend/WebGL/Basics of WebGL (Drawing a Cube).md","_extension":"md"},{"_path":"/frontend/webgl/fragment-shaders","_dir":"webgl","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Fragment Shaders","description":"Fragment shaders describe how polygons are painted (or textured). Read Basics of WebGL (Drawing a Cube) first.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Fragment shaders describe "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"how polygons are painted"}]},{"type":"text","value":" (or textured). Read "},{"type":"element","tag":"a","props":{"href":"Basics%20of%20WebGL%20(Drawing%20a%20Cube)"},"children":[{"type":"text","value":"Basics of WebGL (Drawing a Cube)"}]},{"type":"text","value":" first."}]},{"type":"element","tag":"h2","props":{"id":"sample-fragment-vertex"},"children":[{"type":"text","value":"Sample fragment vertex"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Parameters could be passed here as written at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n// parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}```\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n// parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}```\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Fragment shaders describe "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"how polygons are painted"}]},{"type":"text","value":" (or textured). Read "},{"type":"element","tag":"a","props":{"href":"Basics%20of%20WebGL%20(Drawing%20a%20Cube)"},"children":[{"type":"text","value":"Basics of WebGL (Drawing a Cube)"}]},{"type":"text","value":" first."}]},{"type":"element","tag":"h2","props":{"id":"sample-fragment-vertex"},"children":[{"type":"text","value":"Sample fragment vertex"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Parameters could be passed here as written at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n// parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}```\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":"precision highp "}]},{"type":"element","tag":"span","props":{"class":"ct-87906d"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-83a565"},"children":[{"type":"text","value":"// parameter from Vertex Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":"varying vec4 v_positionWithOffset;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-83a565"},"children":[{"type":"text","value":"// parameters passed from Javascript loop"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-87906d"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":" slide;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-87906d"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":" aspect;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-87906d"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bd94b5"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-87906d"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":"){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-83a565"},"children":[{"type":"text","value":"// color, attached to current verticle {r,g,b,alpha}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-83a565"},"children":[{"type":"text","value":"// same a["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-83a565"},"children":[{"type":"text","value":"// v_positionWithOffset.x,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-83a565"},"children":[{"type":"text","value":"// v_positionWithOffset.y, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-83a565"},"children":[{"type":"text","value":"// v_positionWithOffset.z, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-83a565"},"children":[{"type":"text","value":"// 1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-83a565"},"children":[{"type":"text","value":"// ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":" gl_FragColor"}]},{"type":"element","tag":"span","props":{"class":"ct-f82235"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-bd94b5"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ec0d41"},"children":[{"type":"text","value":"v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-ec0d41"},"children":[{"type":"text","value":"xyz"}]},{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-c7e855"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":"}```"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-c7e855{color:#79C0FF}.ct-ec0d41{color:#C9D1D9}.ct-f82235{color:#FF7B72}.ct-bd94b5{color:#D2A8FF}.ct-83a565{color:#8B949E}.ct-87906d{color:#FF7B72}.ct-c796a9{color:#C9D1D9}.light .ct-c796a9{color:#657B83}.light .ct-87906d{color:#073642}.light .ct-83a565{color:#93A1A1}.light .ct-bd94b5{color:#268BD2}.light .ct-f82235{color:#859900}.light .ct-ec0d41{color:#268BD2}.light .ct-c7e855{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"sample-fragment-vertex","depth":2,"text":"Sample fragment vertex"}]}},"_type":"markdown","_id":"content:Frontend:WebGL:Fragment Shaders.md","_source":"content","_file":"Frontend/WebGL/Fragment Shaders.md","_extension":"md"},{"_path":"/frontend/webgl/rendering-without-blocking-in-a-worker","_dir":"webgl","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Rendering Without Blocking In A Worker","description":"Rendering items on #canvas in main loop might cause interface freezes, preventing render process from executing properly by flooding execution stack with operations.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Rendering items on #canvas in main loop "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"might cause interface freezes"}]},{"type":"text","value":", preventing render process from executing properly by flooding execution stack with operations."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To handle it properly, we can start separate #worker thread, that will handle rendering in its own event loop, so that won't affect the source tab's event loop."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Workers can have access to "},{"type":"element","tag":"a","props":{"href":"https://developer.mozilla.org/en-US/docs/Glossary/Transferable_objects","rel":["nofollow"]},"children":[{"type":"text","value":"Transferrable Objects"}]},{"type":"text","value":" from main thread by receiving memory address. "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"That's a lot faster than cloning"}]},{"type":"text","value":". In this case "},{"type":"element","tag":"a","props":{"href":"https://developer.mozilla.org/en-US/docs/Web/API/ImageBitmap","rel":["nofollow"]},"children":[{"type":"text","value":"ImageBitmap"}]},{"type":"text","value":" is transferrable."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Code for the main thread component:"}]},{"type":"element","tag":"code","props":{"code":"// main.ts\nconst instance = new Worker('./render-worker.ts');\nconst canvas = document.getElementById('view');\n\n// attaching event listener to worker\ninstance.onmessage = (event: MessageEvent) => {\n const ctx = canvas?.getContext(\"2d\");\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n \n ctx.drawImage(event.data as ImageBitmap, 0, 0);\n}\n\n// sending canvas contents to worker\nconst renderInCanvas = () => {\n if (!canvas.current) {\n return;\n }\n \n createImageBitmap(canvas.current).then(image => {\n instance.postMessage(image, { transfer: [image] })\n });\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// main.ts\nconst instance = new Worker('./render-worker.ts');\nconst canvas = document.getElementById('view');\n\n// attaching event listener to worker\ninstance.onmessage = (event: MessageEvent) => {\n const ctx = canvas?.getContext(\"2d\");\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n \n ctx.drawImage(event.data as ImageBitmap, 0, 0);\n}\n\n// sending canvas contents to worker\nconst renderInCanvas = () => {\n if (!canvas.current) {\n return;\n }\n \n createImageBitmap(canvas.current).then(image => {\n instance.postMessage(image, { transfer: [image] })\n });\n};\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Worker code:"}]},{"type":"element","tag":"code","props":{"code":"// render-worker.ts\nexport default () => {\n self.onmessage = (message: MessageEvent) => {\n const data = message.data;\n\n if (!(data instanceof ImageBitmap)) {\n throw new Error('Received unknown data')\n }\n\n // OffscreenCanvas can be set up inside workers\n const canvas = new OffscreenCanvas(data.width, data.height);\n const ctx = canvas.getContext(\"2d\");\n\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n\n ctx.drawImage(data, 0, 0);\n\n // That will block execution inside worker for \n // a couple of seconds\n doHardRenderingStuffHere(ctx, data.width, data.height);\n\n // Sending resulting image back to main thread\n createImageBitmap(canvas).then((image) => {\n self.postMessage(image, { transfer: [image] });\n });\n };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// render-worker.ts\nexport default () => {\n self.onmessage = (message: MessageEvent) => {\n const data = message.data;\n\n if (!(data instanceof ImageBitmap)) {\n throw new Error('Received unknown data')\n }\n\n // OffscreenCanvas can be set up inside workers\n const canvas = new OffscreenCanvas(data.width, data.height);\n const ctx = canvas.getContext(\"2d\");\n\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n\n ctx.drawImage(data, 0, 0);\n\n // That will block execution inside worker for \n // a couple of seconds\n doHardRenderingStuffHere(ctx, data.width, data.height);\n\n // Sending resulting image back to main thread\n createImageBitmap(canvas).then((image) => {\n self.postMessage(image, { transfer: [image] });\n });\n };\n};\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Rendering items on #canvas in main loop "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"might cause interface freezes"}]},{"type":"text","value":", preventing render process from executing properly by flooding execution stack with operations."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To handle it properly, we can start separate #worker thread, that will handle rendering in its own event loop, so that won't affect the source tab's event loop."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Workers can have access to "},{"type":"element","tag":"a","props":{"href":"https://developer.mozilla.org/en-US/docs/Glossary/Transferable_objects","rel":["nofollow"]},"children":[{"type":"text","value":"Transferrable Objects"}]},{"type":"text","value":" from main thread by receiving memory address. "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"That's a lot faster than cloning"}]},{"type":"text","value":". In this case "},{"type":"element","tag":"a","props":{"href":"https://developer.mozilla.org/en-US/docs/Web/API/ImageBitmap","rel":["nofollow"]},"children":[{"type":"text","value":"ImageBitmap"}]},{"type":"text","value":" is transferrable."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Code for the main thread component:"}]},{"type":"element","tag":"code","props":{"code":"// main.ts\nconst instance = new Worker('./render-worker.ts');\nconst canvas = document.getElementById('view');\n\n// attaching event listener to worker\ninstance.onmessage = (event: MessageEvent) => {\n const ctx = canvas?.getContext(\"2d\");\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n \n ctx.drawImage(event.data as ImageBitmap, 0, 0);\n}\n\n// sending canvas contents to worker\nconst renderInCanvas = () => {\n if (!canvas.current) {\n return;\n }\n \n createImageBitmap(canvas.current).then(image => {\n instance.postMessage(image, { transfer: [image] })\n });\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-79498e"},"children":[{"type":"text","value":"// main.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56802"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-250ed0"},"children":[{"type":"text","value":"instance"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"Worker"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-2def8a"},"children":[{"type":"text","value":"'./render-worker.ts'"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56802"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-250ed0"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"document"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"getElementById"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-2def8a"},"children":[{"type":"text","value":"'view'"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-79498e"},"children":[{"type":"text","value":"// attaching event listener to worker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"instance"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"onmessage"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-05acc1"},"children":[{"type":"text","value":"MessageEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-b56802"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b56802"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-250ed0"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"getContext"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-2def8a"},"children":[{"type":"text","value":"\"2d\""}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a7082a"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-2def8a"},"children":[{"type":"text","value":"`Can't get 2D context`"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"drawImage"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"as"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-05acc1"},"children":[{"type":"text","value":"ImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-84e290"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-84e290"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-79498e"},"children":[{"type":"text","value":"// sending canvas contents to worker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56802"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"renderInCanvas"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-b56802"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"createImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"then"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"instance"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"postMessage"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":", { transfer: ["}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"] })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Worker code:"}]},{"type":"element","tag":"code","props":{"code":"// render-worker.ts\nexport default () => {\n self.onmessage = (message: MessageEvent) => {\n const data = message.data;\n\n if (!(data instanceof ImageBitmap)) {\n throw new Error('Received unknown data')\n }\n\n // OffscreenCanvas can be set up inside workers\n const canvas = new OffscreenCanvas(data.width, data.height);\n const ctx = canvas.getContext(\"2d\");\n\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n\n ctx.drawImage(data, 0, 0);\n\n // That will block execution inside worker for \n // a couple of seconds\n doHardRenderingStuffHere(ctx, data.width, data.height);\n\n // Sending resulting image back to main thread\n createImageBitmap(canvas).then((image) => {\n self.postMessage(image, { transfer: [image] });\n });\n };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-79498e"},"children":[{"type":"text","value":"// render-worker.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0fdabc"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-6575e1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fdabc"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-6575e1"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-e101b9"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-6575e1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-85ce46"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"self"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"onmessage"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b56802"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-250ed0"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"message"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"instanceof"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-05acc1"},"children":[{"type":"text","value":"ImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a7082a"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-2def8a"},"children":[{"type":"text","value":"'Received unknown data'"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-79498e"},"children":[{"type":"text","value":"// OffscreenCanvas can be set up inside workers"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b56802"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-250ed0"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"OffscreenCanvas"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b56802"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-250ed0"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"getContext"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-2def8a"},"children":[{"type":"text","value":"\"2d\""}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a7082a"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-2def8a"},"children":[{"type":"text","value":"`Can't get 2D context`"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"drawImage"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-84e290"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-84e290"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-79498e"},"children":[{"type":"text","value":"// That will block execution inside worker for "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-79498e"},"children":[{"type":"text","value":"// a couple of seconds"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"doHardRenderingStuffHere"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-79498e"},"children":[{"type":"text","value":"// Sending resulting image back to main thread"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"createImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-b56802"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"self"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"postMessage"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":", { transfer: ["}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"] });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-85ce46{color:#C9D1D9}.ct-e101b9{color:#FF7B72}.ct-6575e1{color:#FFA657}.ct-0fdabc{color:#FF7B72}.ct-84e290{color:#79C0FF}.ct-a7082a{color:#79C0FF}.ct-05acc1{color:#FFA657}.ct-d814b1{color:#C9D1D9}.ct-2def8a{color:#A5D6FF}.ct-2edd34{color:#D2A8FF}.ct-06d0ef{color:#FF7B72}.ct-250ed0{color:#79C0FF}.ct-a2c7c0{color:#C9D1D9}.ct-b56802{color:#FF7B72}.ct-79498e{color:#8B949E}.light .ct-79498e{color:#93A1A1}.light .ct-b56802{color:#073642}.light .ct-a2c7c0{color:#657B83}.light .ct-250ed0{color:#268BD2}.light .ct-06d0ef{color:#859900}.light .ct-2edd34{color:#268BD2}.light .ct-2def8a{color:#2AA198}.light .ct-d814b1{color:#268BD2}.light .ct-05acc1{color:#268BD2}.light .ct-a7082a{color:#859900}.light .ct-84e290{color:#D33682}.light .ct-0fdabc{color:#859900}.light .ct-6575e1{color:#657B83}.light .ct-e101b9{color:#073642}.light .ct-85ce46{color:#657B83}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:WebGL:Rendering without blocking in a Worker.md","_source":"content","_file":"Frontend/WebGL/Rendering without blocking in a Worker.md","_extension":"md"},{"_path":"/frontend/webgl/vertex-shaders","_dir":"webgl","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Vertex Shaders","description":"Read Basics of WebGL (Drawing a Cube) first.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read "},{"type":"element","tag":"a","props":{"href":"Basics%20of%20WebGL%20(Drawing%20a%20Cube)"},"children":[{"type":"text","value":"Basics of WebGL (Drawing a Cube)"}]},{"type":"text","value":" first."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" define vertice positions in 3D-space. That's just a function, that defines "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gl_Position"}]},{"type":"text","value":" value by applying different transformations to it."}]},{"type":"element","tag":"h2","props":{"id":"sample-code"},"children":[{"type":"text","value":"Sample code"}]},{"type":"element","tag":"code","props":{"code":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"passing-parameters-to-vertexshader"},"children":[{"type":"text","value":"Passing parameters to VertexShader"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Search for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Uniforms"}]},{"type":"text","value":" "},{"type":"element","tag":"a","props":{"href":"https://open.gl/drawing","rel":["nofollow"]},"children":[{"type":"text","value":"at open.gl"}]},{"type":"text","value":" for further reading."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There're 3 ways to pass parameters."}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"attribute"}]},{"type":"text","value":" are parameters, that won't change. Good for vertex buffers."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniform"}]},{"type":"text","value":" are meant to change over the time. Good for passing transformations."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varying"}]},{"type":"text","value":" are parameters, that's shared between Vertex and "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]}]},{"type":"element","tag":"h2","props":{"id":"applying-transformations"},"children":[{"type":"text","value":"Applying transformations"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Every vertice position is defined as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"{x,y,z,w}"}]},{"type":"text","value":", where "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"w"}]},{"type":"text","value":" is a common denominator, that's used to achieve fast coord transformations by multiplying number of square matrices with original vertice coordinates."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"We don't change vertice position buffer"}]},{"type":"text","value":", because it's slow when being run inside Javascript loop, we "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"pass transformation matrices"}]},{"type":"text","value":" instead and "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"multiply vertice positions with transformation matrices"}]},{"type":"text","value":" inside a Graphic Card's GPU, because that's what GPU made for."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Good explanation can be found here: "},{"type":"element","tag":"a","props":{"href":"https://open.gl/transformations","rel":["nofollow"]},"children":[{"type":"text","value":"open.gl"}]},{"type":"text","value":"."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read "},{"type":"element","tag":"a","props":{"href":"Basics%20of%20WebGL%20(Drawing%20a%20Cube)"},"children":[{"type":"text","value":"Basics of WebGL (Drawing a Cube)"}]},{"type":"text","value":" first."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" define vertice positions in 3D-space. That's just a function, that defines "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gl_Position"}]},{"type":"text","value":" value by applying different transformations to it."}]},{"type":"element","tag":"h2","props":{"id":"sample-code"},"children":[{"type":"text","value":"Sample code"}]},{"type":"element","tag":"code","props":{"code":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-71fa9c"},"children":[{"type":"text","value":"// current vertice position {x,y,z,w}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"attribute vec4 aVertexPosition;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-71fa9c"},"children":[{"type":"text","value":"// final vertice position with all transformations applied,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-71fa9c"},"children":[{"type":"text","value":"// that will be passed to Fragment Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"varying vec4 v_positionWithOffset;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-71fa9c"},"children":[{"type":"text","value":"// Parameters passed from Javascript loop"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-54d8a4"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":" slide;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-54d8a4"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":" aspect;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-54d8a4"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-70d7f8"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"(){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-71fa9c"},"children":[{"type":"text","value":"// float array of 4 elements, same as [slide,slide,slide,1]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":" vec4 scale"}]},{"type":"element","tag":"span","props":{"class":"ct-f84901"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-70d7f8"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-70d7f8"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"(slide),"}]},{"type":"element","tag":"span","props":{"class":"ct-7127b1"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-71fa9c"},"children":[{"type":"text","value":"// float array of 4 elements, same as [aspect,1,1,1]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":" vec4 aspectRatioFix"}]},{"type":"element","tag":"span","props":{"class":"ct-f84901"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-70d7f8"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"(aspect,"}]},{"type":"element","tag":"span","props":{"class":"ct-70d7f8"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7127b1"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-71fa9c"},"children":[{"type":"text","value":"// vertice position, multiplied with matrices of scale and aspect ratio"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":" gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-f84901"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"aVertexPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-f84901"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-f84901"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"aspectRatioFix,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-71fa9c"},"children":[{"type":"text","value":"// vertice offset, that will be passed to fragment shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":" v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-f84901"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-f84901"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-70d7f8"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7127b1"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-7127b1"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-7127b1"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-7127b1"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"passing-parameters-to-vertexshader"},"children":[{"type":"text","value":"Passing parameters to VertexShader"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Search for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Uniforms"}]},{"type":"text","value":" "},{"type":"element","tag":"a","props":{"href":"https://open.gl/drawing","rel":["nofollow"]},"children":[{"type":"text","value":"at open.gl"}]},{"type":"text","value":" for further reading."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There're 3 ways to pass parameters."}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"attribute"}]},{"type":"text","value":" are parameters, that won't change. Good for vertex buffers."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniform"}]},{"type":"text","value":" are meant to change over the time. Good for passing transformations."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varying"}]},{"type":"text","value":" are parameters, that's shared between Vertex and "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]}]},{"type":"element","tag":"h2","props":{"id":"applying-transformations"},"children":[{"type":"text","value":"Applying transformations"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Every vertice position is defined as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"{x,y,z,w}"}]},{"type":"text","value":", where "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"w"}]},{"type":"text","value":" is a common denominator, that's used to achieve fast coord transformations by multiplying number of square matrices with original vertice coordinates."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"We don't change vertice position buffer"}]},{"type":"text","value":", because it's slow when being run inside Javascript loop, we "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"pass transformation matrices"}]},{"type":"text","value":" instead and "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"multiply vertice positions with transformation matrices"}]},{"type":"text","value":" inside a Graphic Card's GPU, because that's what GPU made for."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Good explanation can be found here: "},{"type":"element","tag":"a","props":{"href":"https://open.gl/transformations","rel":["nofollow"]},"children":[{"type":"text","value":"open.gl"}]},{"type":"text","value":"."}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-7127b1{color:#79C0FF}.ct-f84901{color:#FF7B72}.ct-70d7f8{color:#D2A8FF}.ct-54d8a4{color:#FF7B72}.ct-1e0bf5{color:#C9D1D9}.ct-71fa9c{color:#8B949E}.light .ct-71fa9c{color:#93A1A1}.light .ct-1e0bf5{color:#657B83}.light .ct-54d8a4{color:#073642}.light .ct-70d7f8{color:#268BD2}.light .ct-f84901{color:#859900}.light .ct-7127b1{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"sample-code","depth":2,"text":"Sample code"},{"id":"passing-parameters-to-vertexshader","depth":2,"text":"Passing parameters to VertexShader"},{"id":"applying-transformations","depth":2,"text":"Applying transformations"}]}},"_type":"markdown","_id":"content:Frontend:WebGL:Vertex Shaders.md","_source":"content","_file":"Frontend/WebGL/Vertex Shaders.md","_extension":"md"},{"_path":"/git/force-git-to-use-https","_dir":"git","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Force Git To Use HTTPS","description":"Forces #git to use https even if remote url is #SSH. Useful for the networks with blocked #ssh protocol.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Forces #git to use https even if remote url is #SSH. Useful for the networks with blocked #ssh protocol."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Put this inside your "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"~/.gitconfig"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"[url \"https://github.com\"]\n insteadOf = git://github.com\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"[url \"https://github.com\"]\n insteadOf = git://github.com\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Forces #git to use https even if remote url is #SSH. Useful for the networks with blocked #ssh protocol."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Put this inside your "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"~/.gitconfig"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"[url \"https://github.com\"]\n insteadOf = git://github.com\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2aa28a"},"children":[{"type":"text","value":"[url "}]},{"type":"element","tag":"span","props":{"class":"ct-67f284"},"children":[{"type":"text","value":"\"https://github.com\""}]},{"type":"element","tag":"span","props":{"class":"ct-2aa28a"},"children":[{"type":"text","value":"]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2aa28a"},"children":[{"type":"text","value":" insteadOf "}]},{"type":"element","tag":"span","props":{"class":"ct-75a348"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-2aa28a"},"children":[{"type":"text","value":" git:"}]},{"type":"element","tag":"span","props":{"class":"ct-17e9d4"},"children":[{"type":"text","value":"//github.com"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-17e9d4{color:#8B949E}.ct-75a348{color:#FF7B72}.ct-67f284{color:#A5D6FF}.ct-2aa28a{color:#C9D1D9}.light .ct-2aa28a{color:#657B83}.light .ct-67f284{color:#2AA198}.light .ct-75a348{color:#859900}.light .ct-17e9d4{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Git:Force git to use HTTPS.md","_source":"content","_file":"Git/Force git to use HTTPS.md","_extension":"md"},{"_path":"/git/git-aliases-and-useful-commands","_dir":"git","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Git Aliases And Useful Commands","description":"Shorthands for #git commands can be specified. Should be placed at ~/.gitconfig.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shorthands for #git commands can be specified. Should be placed at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"~/.gitconfig"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"[alias]\n flush = git clean-branches branch | grep -v master | xargs git branch -D\n lol = log --oneline --graph\n l = lol\n c = commit -am\n cv = commit --no-verify -am\n p = push\n pf = p --force-with-lease\n ignore-now = update-index --skip-worktree\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"[alias]\n flush = git clean-branches branch | grep -v master | xargs git branch -D\n lol = log --oneline --graph\n l = lol\n c = commit -am\n cv = commit --no-verify -am\n p = push\n pf = p --force-with-lease\n ignore-now = update-index --skip-worktree\n"}]}]}]},{"type":"element","tag":"table","props":{},"children":[{"type":"element","tag":"thead","props":{},"children":[{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"th","props":{"align":null},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"command"}]}]},{"type":"element","tag":"th","props":{"align":null},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"description"}]}]}]}]},{"type":"element","tag":"tbody","props":{},"children":[{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git flush"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"drops all branches, except master"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git lol"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"shows log"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git c"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"commits with message"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git cv"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"commits without hooks"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git p"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"pushes"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git pf"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"push with --force and additional check"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git ignore-now"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"starts ignoring file from now on"}]}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shorthands for #git commands can be specified. Should be placed at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"~/.gitconfig"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"[alias]\n flush = git clean-branches branch | grep -v master | xargs git branch -D\n lol = log --oneline --graph\n l = lol\n c = commit -am\n cv = commit --no-verify -am\n p = push\n pf = p --force-with-lease\n ignore-now = update-index --skip-worktree\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"[alias]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" flush "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" git clean"}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"branches branch "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" grep "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"v master "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" xargs git branch "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"D"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" lol "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" log "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"oneline "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"graph"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" l "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" lol"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" c "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" commit "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"am"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" cv "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" commit "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"no"}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"verify "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"am"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" p "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" push"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" pf "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" p "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"force"}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"with"}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"lease"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" ignore"}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"now "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" update"}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"index "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"skip"}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"worktree"}]}]}]}]}]},{"type":"element","tag":"table","props":{},"children":[{"type":"element","tag":"thead","props":{},"children":[{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"th","props":{"align":null},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"command"}]}]},{"type":"element","tag":"th","props":{"align":null},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"description"}]}]}]}]},{"type":"element","tag":"tbody","props":{},"children":[{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git flush"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"drops all branches, except master"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git lol"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"shows log"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git c"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"commits with message"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git cv"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"commits without hooks"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git p"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"pushes"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git pf"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"push with --force and additional check"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git ignore-now"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"starts ignoring file from now on"}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-b24a9d{color:#FF7B72}.ct-29e270{color:#C9D1D9}.light .ct-29e270{color:#657B83}.light .ct-b24a9d{color:#859900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Git:Git aliases and useful commands.md","_source":"content","_file":"Git/Git aliases and useful commands.md","_extension":"md"},{"_path":"/golang/i18n-in-golang","_dir":"golang","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"I18n In Golang","description":"There are no good examples of golang.org/x/text uses and description of how pluralization made. So, this is it.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There are no good examples of "},{"type":"element","tag":"a","props":{"href":"https://golang.org/x/text","rel":["nofollow"]},"children":[{"type":"text","value":"golang.org/x/text"}]},{"type":"text","value":" uses and description of how pluralization made. So, this is it."}]},{"type":"element","tag":"h4","props":{"id":"generating-translations"},"children":[{"type":"text","value":"Generating translations"}]},{"type":"element","tag":"blockquote","props":{},"children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should specify valid "},{"type":"element","tag":"a","props":{"href":"https://www.iso.org/obp/ui/#iso:code:3166","rel":["nofollow"]},"children":[{"type":"text","value":"ISO-3166 locale code"}]},{"type":"text","value":" to get plurals working!"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Write your code:"}]},{"type":"element","tag":"code","props":{"code":"import (\n \"golang.org/x/text/language\"\n \"golang.org/x/text/message\"\n)\n\nlang := language.MustParse('ru-RU')\nprinter := message.NewPrinter(lang)\n\ncount := 1\nprinter.Sprintf(\"%d butterflies\", count)\n","language":"go"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import (\n \"golang.org/x/text/language\"\n \"golang.org/x/text/message\"\n)\n\nlang := language.MustParse('ru-RU')\nprinter := message.NewPrinter(lang)\n\ncount := 1\nprinter.Sprintf(\"%d butterflies\", count)\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run generator for your locale (mine is "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"ru-RU"}]},{"type":"text","value":"):"}]},{"type":"element","tag":"code","props":{"code":"gotext -srclang=en-GB update -lang=ru-RU \\\n -out=translations.go github.com/path/to-output-folder\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"gotext -srclang=en-GB update -lang=ru-RU \\\n -out=translations.go github.com/path/to-output-folder\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This will generate "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"out.gotext.json"}]},{"type":"text","value":" in "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/path/to-output-folder/ru-RU"}]},{"type":"text","value":" of your project. Copy it to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"messages.out.json"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h4","props":{"id":"translating-and-adding-plural-forms"},"children":[{"type":"text","value":"Translating and adding plural forms"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"\"translation\""}]},{"type":"text","value":" value in generated "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"messages.gotext.json"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"string"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"object"}]},{"type":"text","value":" of the form shown below if you want pluralize strings, "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"then run gotext command again"}]},{"type":"text","value":", it will generate "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".go files with translations"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"According to "},{"type":"element","tag":"a","props":{"href":"https://github.com/golang/text/blob/master/feature/plural/gen_common.go#L19","rel":["nofollow"]},"children":[{"type":"text","value":"source files of gen_common"}]},{"type":"text","value":", there's a couple of forms:"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"=N"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"!=N"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"%N"}]},{"type":"text","value":" for exact matches"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"zero"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"one"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"two"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"few"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"many"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"other"}]},{"type":"text","value":" - they're different for each language, so,"}]}]},{"type":"element","tag":"code","props":{"code":"{\n \"id\": \"{Count} butterflies\",\n \"message\": \"{Count} butterflies\",\n \"translation\": {\n \"select\": {\n \"feature\": \"plural\",\n \"arg\": \"Count\",\n \"cases\": {\n \"one\": {\n \"msg\": \"{Count} бабочка\"\n },\n \"few\": {\n \"msg\": \"{Count} бабочки\"\n },\n \"many\": {\n \"msg\": \"{Count} бабочек\"\n },\n \"other\": {\n \"msg\": \"{Count} бабочуль\"\n }\n }\n }\n },\n \"placeholders\": [\n {\n \"id\": \"Count\",\n \"string\": \"%[1]d\",\n \"type\": \"int\",\n \"underlyingType\": \"int\",\n \"argNum\": 1,\n \"expr\": \"count\"\n }\n ]\n},\n","language":"json"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"{\n \"id\": \"{Count} butterflies\",\n \"message\": \"{Count} butterflies\",\n \"translation\": {\n \"select\": {\n \"feature\": \"plural\",\n \"arg\": \"Count\",\n \"cases\": {\n \"one\": {\n \"msg\": \"{Count} бабочка\"\n },\n \"few\": {\n \"msg\": \"{Count} бабочки\"\n },\n \"many\": {\n \"msg\": \"{Count} бабочек\"\n },\n \"other\": {\n \"msg\": \"{Count} бабочуль\"\n }\n }\n }\n },\n \"placeholders\": [\n {\n \"id\": \"Count\",\n \"string\": \"%[1]d\",\n \"type\": \"int\",\n \"underlyingType\": \"int\",\n \"argNum\": 1,\n \"expr\": \"count\"\n }\n ]\n},\n"}]}]}]},{"type":"element","tag":"h4","props":{"id":"using-go-generate"},"children":[{"type":"text","value":"Using go-generate"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Write this at some "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".go"}]},{"type":"text","value":" file:"}]},{"type":"element","tag":"code","props":{"code":"//go:generate gotext -srclang=en-GB update -out=translations.go -lang=ru-RU github.com/muerwre/vault-golang/internal/api\n","language":"go"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"//go:generate gotext -srclang=en-GB update -out=translations.go -lang=ru-RU github.com/muerwre/vault-golang/internal/api\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run go generation:"}]},{"type":"element","tag":"code","props":{"code":"go generate ./...\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"go generate ./...\n"}]}]}]},{"type":"element","tag":"h4","props":{"id":"useful-links"},"children":[{"type":"text","value":"Useful links"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/golang/text/blob/master/feature/plural/gen_common.go#L19","rel":["nofollow"]},"children":[{"type":"text","value":"All available forms in this .go file"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://community.crowdin.com/t/plurals-in-gotext-json-files/600","rel":["nofollow"]},"children":[{"type":"text","value":"Answer, that solved it for me"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There are no good examples of "},{"type":"element","tag":"a","props":{"href":"https://golang.org/x/text","rel":["nofollow"]},"children":[{"type":"text","value":"golang.org/x/text"}]},{"type":"text","value":" uses and description of how pluralization made. So, this is it."}]},{"type":"element","tag":"h4","props":{"id":"generating-translations"},"children":[{"type":"text","value":"Generating translations"}]},{"type":"element","tag":"blockquote","props":{},"children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should specify valid "},{"type":"element","tag":"a","props":{"href":"https://www.iso.org/obp/ui/#iso:code:3166","rel":["nofollow"]},"children":[{"type":"text","value":"ISO-3166 locale code"}]},{"type":"text","value":" to get plurals working!"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Write your code:"}]},{"type":"element","tag":"code","props":{"code":"import (\n \"golang.org/x/text/language\"\n \"golang.org/x/text/message\"\n)\n\nlang := language.MustParse('ru-RU')\nprinter := message.NewPrinter(lang)\n\ncount := 1\nprinter.Sprintf(\"%d butterflies\", count)\n","language":"go"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-806f41"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7c633d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1fc9ae"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-ba0dbd"},"children":[{"type":"text","value":"golang.org/x/text/language"}]},{"type":"element","tag":"span","props":{"class":"ct-1fc9ae"},"children":[{"type":"text","value":"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7c633d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1fc9ae"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-ba0dbd"},"children":[{"type":"text","value":"golang.org/x/text/message"}]},{"type":"element","tag":"span","props":{"class":"ct-1fc9ae"},"children":[{"type":"text","value":"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f1cd32"},"children":[{"type":"text","value":"lang"}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-806f41"},"children":[{"type":"text","value":":="}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" language."}]},{"type":"element","tag":"span","props":{"class":"ct-843391"},"children":[{"type":"text","value":"MustParse"}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"'"}]},{"type":"element","tag":"span","props":{"class":"ct-9e0b55"},"children":[{"type":"text","value":"ru-RU"}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"'"}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f1cd32"},"children":[{"type":"text","value":"printer"}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-806f41"},"children":[{"type":"text","value":":="}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" message."}]},{"type":"element","tag":"span","props":{"class":"ct-843391"},"children":[{"type":"text","value":"NewPrinter"}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":"(lang)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f1cd32"},"children":[{"type":"text","value":"count"}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-806f41"},"children":[{"type":"text","value":":="}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-edb491"},"children":[{"type":"text","value":"1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":"printer."}]},{"type":"element","tag":"span","props":{"class":"ct-843391"},"children":[{"type":"text","value":"Sprintf"}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-f0c8ef"},"children":[{"type":"text","value":"%d"}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":" butterflies\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":", count)"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run generator for your locale (mine is "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"ru-RU"}]},{"type":"text","value":"):"}]},{"type":"element","tag":"code","props":{"code":"gotext -srclang=en-GB update -lang=ru-RU \\\n -out=translations.go github.com/path/to-output-folder\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":"gotext -srclang=en-GB update -lang=ru-RU \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" -out=translations.go github.com/path/to-output-folder"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This will generate "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"out.gotext.json"}]},{"type":"text","value":" in "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/path/to-output-folder/ru-RU"}]},{"type":"text","value":" of your project. Copy it to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"messages.out.json"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h4","props":{"id":"translating-and-adding-plural-forms"},"children":[{"type":"text","value":"Translating and adding plural forms"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"\"translation\""}]},{"type":"text","value":" value in generated "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"messages.gotext.json"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"string"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"object"}]},{"type":"text","value":" of the form shown below if you want pluralize strings, "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"then run gotext command again"}]},{"type":"text","value":", it will generate "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".go files with translations"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"According to "},{"type":"element","tag":"a","props":{"href":"https://github.com/golang/text/blob/master/feature/plural/gen_common.go#L19","rel":["nofollow"]},"children":[{"type":"text","value":"source files of gen_common"}]},{"type":"text","value":", there's a couple of forms:"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"=N"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"!=N"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"%N"}]},{"type":"text","value":" for exact matches"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"zero"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"one"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"two"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"few"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"many"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"other"}]},{"type":"text","value":" - they're different for each language, so,"}]}]},{"type":"element","tag":"code","props":{"code":"{\n \"id\": \"{Count} butterflies\",\n \"message\": \"{Count} butterflies\",\n \"translation\": {\n \"select\": {\n \"feature\": \"plural\",\n \"arg\": \"Count\",\n \"cases\": {\n \"one\": {\n \"msg\": \"{Count} бабочка\"\n },\n \"few\": {\n \"msg\": \"{Count} бабочки\"\n },\n \"many\": {\n \"msg\": \"{Count} бабочек\"\n },\n \"other\": {\n \"msg\": \"{Count} бабочуль\"\n }\n }\n }\n },\n \"placeholders\": [\n {\n \"id\": \"Count\",\n \"string\": \"%[1]d\",\n \"type\": \"int\",\n \"underlyingType\": \"int\",\n \"argNum\": 1,\n \"expr\": \"count\"\n }\n ]\n},\n","language":"json"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"id\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"{Count} butterflies\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"message\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"{Count} butterflies\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"translation\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"select\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"feature\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"plural\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"arg\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"Count\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"cases\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"one\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"{Count} бабочка\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"few\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"{Count} бабочки\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"many\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"{Count} бабочек\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"other\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"{Count} бабочуль\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"placeholders\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"id\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"Count\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"string\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"%[1]d\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"type\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"int\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"underlyingType\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"int\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"argNum\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-edb491"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"expr\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"count\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":"},"}]}]}]}]}]},{"type":"element","tag":"h4","props":{"id":"using-go-generate"},"children":[{"type":"text","value":"Using go-generate"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Write this at some "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".go"}]},{"type":"text","value":" file:"}]},{"type":"element","tag":"code","props":{"code":"//go:generate gotext -srclang=en-GB update -out=translations.go -lang=ru-RU github.com/muerwre/vault-golang/internal/api\n","language":"go"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7f7448"},"children":[{"type":"text","value":"//go:generate gotext -srclang=en-GB update -out=translations.go -lang=ru-RU github.com/muerwre/vault-golang/internal/api"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run go generation:"}]},{"type":"element","tag":"code","props":{"code":"go generate ./...\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":"go generate ./..."}]}]}]}]}]},{"type":"element","tag":"h4","props":{"id":"useful-links"},"children":[{"type":"text","value":"Useful links"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/golang/text/blob/master/feature/plural/gen_common.go#L19","rel":["nofollow"]},"children":[{"type":"text","value":"All available forms in this .go file"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://community.crowdin.com/t/plurals-in-gotext-json-files/600","rel":["nofollow"]},"children":[{"type":"text","value":"Answer, that solved it for me"}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-7f7448{color:#8B949E}.ct-ba7775{color:#79C0FF}.ct-f0c8ef{color:#79C0FF}.ct-edb491{color:#79C0FF}.ct-9e0b55{color:#FFA198}.ct-c4c559{color:#A5D6FF}.ct-843391{color:#79C0FF}.ct-f1cd32{color:#C9D1D9}.ct-ba0dbd{color:#FFA657}.ct-1fc9ae{color:#A5D6FF}.ct-7c633d{color:#C9D1D9}.ct-4e9498{color:#C9D1D9}.ct-806f41{color:#FF7B72}.light .ct-806f41{color:#859900}.light .ct-4e9498{color:#657B83}.light .ct-7c633d{color:#657B83}.light .ct-1fc9ae{color:#2AA198}.light .ct-ba0dbd{color:#2AA198}.light .ct-f1cd32{color:#268BD2}.light .ct-843391{color:#268BD2}.light .ct-c4c559{color:#2AA198}.light .ct-9e0b55{color:#CD3131}.light .ct-edb491{color:#D33682}.light .ct-f0c8ef{color:#CB4B16}.light .ct-ba7775{color:#859900}.light .ct-7f7448{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Golang:i18n in golang.md","_source":"content","_file":"Golang/i18n in golang.md","_extension":"md"},{"_path":"/graphql/apollo-client-pagination","_dir":"graphql","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Apollo Client Pagination","description":"Say, we have gql response like this and we wan't to have pagination with it. Let's merge it as it specified in official documentation","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say, we have "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gql"}]},{"type":"text","value":" response like this and we wan't to have pagination with it. Let's merge it as it specified in "},{"type":"element","tag":"a","props":{"href":"https://www.apollographql.com/docs/react/caching/cache-field-behavior/#the-merge-function","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]}]},{"type":"element","tag":"code","props":{"code":"query listItems(\n filter: Filter, \n sort: String,\n limit: Number,\n offset: Number,\n): ItemList!\n\ninput Filter {\n name: String!\n type: String!\n}\n\ntype ItemList {\n items: [Item!]!\n totalCount: Int!\n}\n","language":"graphql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"query listItems(\n filter: Filter, \n sort: String,\n limit: Number,\n offset: Number,\n): ItemList!\n\ninput Filter {\n name: String!\n type: String!\n}\n\ntype ItemList {\n items: [Item!]!\n totalCount: Int!\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We will setup "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"ApolloClient"}]},{"type":"text","value":" with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"typePolicies"}]},{"type":"text","value":" to merge incoming data in cache:"}]},{"type":"element","tag":"code","props":{"code":"import { ApolloClient, InMemoryCache } from '@apollo/client';\n\nconst client = new ApolloClient({\n // ...\n cache: new InMemoryCache({ typePolicies }),\n // ...\n});\n\nexport const typePolicies: TypePolicies = {\n Query: {\n fields: {\n // query name\n listItems: {\n // apollo will serialize and use keyArgs as unique\n // identifier in cache for every query\n // consider choosing the right fields, \n // i.e. limit and offset won't work here\n keyArgs: [\n 'sort', // primitive type\n 'filter', ['name', 'type'] // nested fields of `filter`\n ],\n merge: mergeItemsWithTotalCount,\n },\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { ApolloClient, InMemoryCache } from '@apollo/client';\n\nconst client = new ApolloClient({\n // ...\n cache: new InMemoryCache({ typePolicies }),\n // ...\n});\n\nexport const typePolicies: TypePolicies = {\n Query: {\n fields: {\n // query name\n listItems: {\n // apollo will serialize and use keyArgs as unique\n // identifier in cache for every query\n // consider choosing the right fields, \n // i.e. limit and offset won't work here\n keyArgs: [\n 'sort', // primitive type\n 'filter', ['name', 'type'] // nested fields of `filter`\n ],\n merge: mergeItemsWithTotalCount,\n },\n }\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We will need merge function "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mergeItemsWithTotalCount"}]},{"type":"text","value":", which will join results of query and cached data for specific key:"}]},{"type":"element","tag":"code","props":{"code":"/** merges all sources with { items: unknown[], totalCount: number } */\nconst mergeItemsWithTotalCount = (existing, incoming, { args }) => {\n // no existing data\n if (!existing || !args?.offset || args.offset < existing.length) {\n return incoming || [];\n }\n\n // If hook was called multiple times\n if (existing?.items?.length && args?.offset < existing.items.length) {\n return existing || [];\n }\n\n // merge cache and incoming data\n const items = [...(existing?.items || []), ...(incoming?.items || [])];\n\n // apply latest result for totalCount\n const totalCount = incoming?.totalCount || existing?.totalCount;\n\n return {\n ...(incoming || existing || {}),\n items,\n totalCount,\n };\n };\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"/** merges all sources with { items: unknown[], totalCount: number } */\nconst mergeItemsWithTotalCount = (existing, incoming, { args }) => {\n // no existing data\n if (!existing || !args?.offset || args.offset < existing.length) {\n return incoming || [];\n }\n\n // If hook was called multiple times\n if (existing?.items?.length && args?.offset < existing.items.length) {\n return existing || [];\n }\n\n // merge cache and incoming data\n const items = [...(existing?.items || []), ...(incoming?.items || [])];\n\n // apply latest result for totalCount\n const totalCount = incoming?.totalCount || existing?.totalCount;\n\n return {\n ...(incoming || existing || {}),\n items,\n totalCount,\n };\n };\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say, we have "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gql"}]},{"type":"text","value":" response like this and we wan't to have pagination with it. Let's merge it as it specified in "},{"type":"element","tag":"a","props":{"href":"https://www.apollographql.com/docs/react/caching/cache-field-behavior/#the-merge-function","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]}]},{"type":"element","tag":"code","props":{"code":"query listItems(\n filter: Filter, \n sort: String,\n limit: Number,\n offset: Number,\n): ItemList!\n\ninput Filter {\n name: String!\n type: String!\n}\n\ntype ItemList {\n items: [Item!]!\n totalCount: Int!\n}\n","language":"graphql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"query"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afdd79"},"children":[{"type":"text","value":"listItems"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ea2c84"},"children":[{"type":"text","value":"filter"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-f1c0e2"},"children":[{"type":"text","value":"Filter"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ea2c84"},"children":[{"type":"text","value":"sort"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-f1c0e2"},"children":[{"type":"text","value":"String"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ea2c84"},"children":[{"type":"text","value":"limit"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-f1c0e2"},"children":[{"type":"text","value":"Number"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ea2c84"},"children":[{"type":"text","value":"offset"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-f1c0e2"},"children":[{"type":"text","value":"Number"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"): "}]},{"type":"element","tag":"span","props":{"class":"ct-afdd79"},"children":[{"type":"text","value":"ItemList"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"input"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f47193"},"children":[{"type":"text","value":"Filter"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ea2c84"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-f1c0e2"},"children":[{"type":"text","value":"String"}]},{"type":"element","tag":"span","props":{"class":"ct-b59deb"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ea2c84"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-f1c0e2"},"children":[{"type":"text","value":"String"}]},{"type":"element","tag":"span","props":{"class":"ct-b59deb"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f47193"},"children":[{"type":"text","value":"ItemList"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ea2c84"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":": ["}]},{"type":"element","tag":"span","props":{"class":"ct-f1c0e2"},"children":[{"type":"text","value":"Item"}]},{"type":"element","tag":"span","props":{"class":"ct-b59deb"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":"]"}]},{"type":"element","tag":"span","props":{"class":"ct-b59deb"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ea2c84"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-f1c0e2"},"children":[{"type":"text","value":"Int"}]},{"type":"element","tag":"span","props":{"class":"ct-b59deb"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We will setup "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"ApolloClient"}]},{"type":"text","value":" with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"typePolicies"}]},{"type":"text","value":" to merge incoming data in cache:"}]},{"type":"element","tag":"code","props":{"code":"import { ApolloClient, InMemoryCache } from '@apollo/client';\n\nconst client = new ApolloClient({\n // ...\n cache: new InMemoryCache({ typePolicies }),\n // ...\n});\n\nexport const typePolicies: TypePolicies = {\n Query: {\n fields: {\n // query name\n listItems: {\n // apollo will serialize and use keyArgs as unique\n // identifier in cache for every query\n // consider choosing the right fields, \n // i.e. limit and offset won't work here\n keyArgs: [\n 'sort', // primitive type\n 'filter', ['name', 'type'] // nested fields of `filter`\n ],\n merge: mergeItemsWithTotalCount,\n },\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"ApolloClient"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"InMemoryCache"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5a2d2f"},"children":[{"type":"text","value":"'@apollo/client'"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-da6361"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba692c"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afdd79"},"children":[{"type":"text","value":"ApolloClient"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" cache: "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afdd79"},"children":[{"type":"text","value":"InMemoryCache"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"({ "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"typePolicies"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"});"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da6361"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba692c"},"children":[{"type":"text","value":"typePolicies"}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-13862b"},"children":[{"type":"text","value":"TypePolicies"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" Query: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" fields: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// query name"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" listItems: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// apollo will serialize and use keyArgs as unique"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// identifier in cache for every query"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// consider choosing the right fields, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// i.e. limit and offset won't work here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" keyArgs: ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5a2d2f"},"children":[{"type":"text","value":"'sort'"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// primitive type"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5a2d2f"},"children":[{"type":"text","value":"'filter'"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":", ["}]},{"type":"element","tag":"span","props":{"class":"ct-5a2d2f"},"children":[{"type":"text","value":"'name'"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-5a2d2f"},"children":[{"type":"text","value":"'type'"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"] "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// nested fields of `filter`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" ],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" merge: "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"mergeItemsWithTotalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We will need merge function "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mergeItemsWithTotalCount"}]},{"type":"text","value":", which will join results of query and cached data for specific key:"}]},{"type":"element","tag":"code","props":{"code":"/** merges all sources with { items: unknown[], totalCount: number } */\nconst mergeItemsWithTotalCount = (existing, incoming, { args }) => {\n // no existing data\n if (!existing || !args?.offset || args.offset < existing.length) {\n return incoming || [];\n }\n\n // If hook was called multiple times\n if (existing?.items?.length && args?.offset < existing.items.length) {\n return existing || [];\n }\n\n // merge cache and incoming data\n const items = [...(existing?.items || []), ...(incoming?.items || [])];\n\n // apply latest result for totalCount\n const totalCount = incoming?.totalCount || existing?.totalCount;\n\n return {\n ...(incoming || existing || {}),\n items,\n totalCount,\n };\n };\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"/** merges all sources with { items: unknown[], totalCount: number } */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-da03a1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c198ce"},"children":[{"type":"text","value":"mergeItemsWithTotalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b59deb"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-ea2c84"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-ea2c84"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":", { "}]},{"type":"element","tag":"span","props":{"class":"ct-ea2c84"},"children":[{"type":"text","value":"args"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-da03a1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// no existing data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"args"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"offset"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"args"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"offset"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"existing"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" [];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// If hook was called multiple times"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"?."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" [];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// merge cache and incoming data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da6361"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba692c"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// apply latest result for totalCount"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da6361"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba692c"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" };"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-c198ce{color:#D2A8FF}.ct-da03a1{color:#FF7B72}.ct-13862b{color:#FFA657}.ct-153212{color:#8B949E}.ct-ba692c{color:#79C0FF}.ct-da6361{color:#FF7B72}.ct-5a2d2f{color:#A5D6FF}.ct-565cdc{color:#C9D1D9}.ct-b59deb{color:#FF7B72}.ct-f47193{color:#79C0FF}.ct-f1c0e2{color:#79C0FF}.ct-ea2c84{color:#FFA657}.ct-74bdc2{color:#C9D1D9}.ct-afdd79{color:#D2A8FF}.ct-90afac{color:#C9D1D9}.ct-89106e{color:#FF7B72}.light .ct-89106e{color:#859900}.light .ct-90afac{color:#657B83}.light .ct-afdd79{color:#268BD2}.light .ct-74bdc2{color:#657B83}.light .ct-ea2c84{color:#657B83}.light .ct-f1c0e2{color:#859900}.light .ct-f47193{color:#859900}.light .ct-b59deb{color:#859900}.light .ct-565cdc{color:#268BD2}.light .ct-5a2d2f{color:#2AA198}.light .ct-da6361{color:#073642}.light .ct-ba692c{color:#268BD2}.light .ct-153212{color:#93A1A1}.light .ct-13862b{color:#268BD2}.light .ct-da03a1{color:#073642}.light .ct-c198ce{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:GraphQL:Apollo Client pagination.md","_source":"content","_file":"GraphQL/Apollo Client pagination.md","_extension":"md"},{"_path":"/graphql/refresh-token-in-apollo-client","_dir":"graphql","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Refresh Token In Apollo Client","description":"If your GraphQL api needs token refresh option, you can pass custom fetch function for Apollo Client.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If your GraphQL api needs token refresh option, you can pass custom fetch function for Apollo Client."}]},{"type":"element","tag":"code","props":{"code":"export const createApolloClient = (\n url: string,\n logout: () => void,\n getAuthorizationData: () => { authorization: string },\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n) =>\n new ApolloClientBase({\n // ...other options\n link: ApolloLink.from([\n // ...other options\n setContext(async (_, { headers }) => {\n return {\n headers: {\n ...headers,\n ...getAuthorizationData(),\n },\n };\n }),\n new HttpLink({\n uri: url,\n fetch: fetchWithTokenRefresh(logout, refreshToken),\n }),\n ]),\n });\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"export const createApolloClient = (\n url: string,\n logout: () => void,\n getAuthorizationData: () => { authorization: string },\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n) =>\n new ApolloClientBase({\n // ...other options\n link: ApolloLink.from([\n // ...other options\n setContext(async (_, { headers }) => {\n return {\n headers: {\n ...headers,\n ...getAuthorizationData(),\n },\n };\n }),\n new HttpLink({\n uri: url,\n fetch: fetchWithTokenRefresh(logout, refreshToken),\n }),\n ]),\n });\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Custom fetch function for this request. You should tune "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"hasUnauthorizedError"}]},{"type":"text","value":" and\n"},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"text","value":" to match your api."}]},{"type":"element","tag":"code","props":{"code":"/** Global singleton for refreshing promise */\nlet refreshingPromise: Promise | null = null;\n\n/** Checks if GraphQl errors has unauthenticated error */\nconst hasUnauthorizedError = (errors: Array<{ code?: ErrorCode }>): boolean =>\n Array.isArray(errors) &&\n errors.some(error => {\n return error.status === 401; // Distinguish unauthorized error here\n });\n\n/** Detects if customFetch is sending refresh request */\nconst isRefreshRequestOptions = (options: RequestInit) => {\n try {\n const body = JSON.parse(options?.body as string);\n return body.operationName === 'RefreshToken';\n } catch (e) {\n return false;\n }\n};\n\n/** fetchWithTokenRefresh is a custom fetch function with token refresh for apollo */\nexport const fetchWithTokenRefresh =\n (\n logout: () => void,\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n ) =>\n async (uri: string, options: RequestInit): Promise => {\n // already refreshing token, wait for it and then use refreshed token\n // or use empty authorization if refreshing failed\n if (\n !isRefreshRequestOptions(options) &&\n refreshingPromise &&\n (options.headers as Record)?.authorization\n ) {\n const newAccessToken = await refreshingPromise\n .catch(() => {\n // refreshing token from other request failed, retry without authorization\n return '';\n });\n \n options.headers = {\n ...(options.headers || {}),\n authorization: newAccessToken,\n };\n }\n\n return fetch(uri, options).then(async response => {\n const text = await response.text();\n const json = JSON.parse(text);\n\n // check for unauthorized errors, if not present, just return result\n if (\n isRefreshRequestOptions(options) ||\n !json?.errors ||\n !Array.isArray(json.errors) ||\n !hasUnauthorizedError(json.errors)\n ) {\n return {\n ...response,\n ok: true,\n json: async () =>\n new Promise(resolve => {\n resolve(json);\n }),\n text: async () =>\n new Promise(resolve => {\n resolve(text);\n }),\n };\n }\n\n // If unauthorized, refresh token and try again\n if (!refreshingPromise) {\n refreshingPromise = refreshToken()\n .then(async (tokens): Promise => {\n refreshingPromise = null;\n\n if (!tokens?.accessToken) {\n throw new Error('Session expired');\n }\n\n return tokens?.accessToken;\n })\n .catch(() => {\n refreshingPromise = null;\n\n // can't refresh token. logging out\n logout();\n throw new Error('Session expired');\n });\n }\n\n // success or any non-auth error\n return refreshingPromise\n .then(async (newAccessToken: string) => {\n // wait for other request's refreshing query to finish, when retry\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: newAccessToken,\n },\n });\n })\n .catch(async () => {\n // refreshing token from other request failed, retry without authorization\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: '',\n },\n });\n });\n });\n };\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"/** Global singleton for refreshing promise */\nlet refreshingPromise: Promise | null = null;\n\n/** Checks if GraphQl errors has unauthenticated error */\nconst hasUnauthorizedError = (errors: Array<{ code?: ErrorCode }>): boolean =>\n Array.isArray(errors) &&\n errors.some(error => {\n return error.status === 401; // Distinguish unauthorized error here\n });\n\n/** Detects if customFetch is sending refresh request */\nconst isRefreshRequestOptions = (options: RequestInit) => {\n try {\n const body = JSON.parse(options?.body as string);\n return body.operationName === 'RefreshToken';\n } catch (e) {\n return false;\n }\n};\n\n/** fetchWithTokenRefresh is a custom fetch function with token refresh for apollo */\nexport const fetchWithTokenRefresh =\n (\n logout: () => void,\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n ) =>\n async (uri: string, options: RequestInit): Promise => {\n // already refreshing token, wait for it and then use refreshed token\n // or use empty authorization if refreshing failed\n if (\n !isRefreshRequestOptions(options) &&\n refreshingPromise &&\n (options.headers as Record)?.authorization\n ) {\n const newAccessToken = await refreshingPromise\n .catch(() => {\n // refreshing token from other request failed, retry without authorization\n return '';\n });\n \n options.headers = {\n ...(options.headers || {}),\n authorization: newAccessToken,\n };\n }\n\n return fetch(uri, options).then(async response => {\n const text = await response.text();\n const json = JSON.parse(text);\n\n // check for unauthorized errors, if not present, just return result\n if (\n isRefreshRequestOptions(options) ||\n !json?.errors ||\n !Array.isArray(json.errors) ||\n !hasUnauthorizedError(json.errors)\n ) {\n return {\n ...response,\n ok: true,\n json: async () =>\n new Promise(resolve => {\n resolve(json);\n }),\n text: async () =>\n new Promise(resolve => {\n resolve(text);\n }),\n };\n }\n\n // If unauthorized, refresh token and try again\n if (!refreshingPromise) {\n refreshingPromise = refreshToken()\n .then(async (tokens): Promise => {\n refreshingPromise = null;\n\n if (!tokens?.accessToken) {\n throw new Error('Session expired');\n }\n\n return tokens?.accessToken;\n })\n .catch(() => {\n refreshingPromise = null;\n\n // can't refresh token. logging out\n logout();\n throw new Error('Session expired');\n });\n }\n\n // success or any non-auth error\n return refreshingPromise\n .then(async (newAccessToken: string) => {\n // wait for other request's refreshing query to finish, when retry\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: newAccessToken,\n },\n });\n })\n .catch(async () => {\n // refreshing token from other request failed, retry without authorization\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: '',\n },\n });\n });\n });\n };\n\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If your GraphQL api needs token refresh option, you can pass custom fetch function for Apollo Client."}]},{"type":"element","tag":"code","props":{"code":"export const createApolloClient = (\n url: string,\n logout: () => void,\n getAuthorizationData: () => { authorization: string },\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n) =>\n new ApolloClientBase({\n // ...other options\n link: ApolloLink.from([\n // ...other options\n setContext(async (_, { headers }) => {\n return {\n headers: {\n ...headers,\n ...getAuthorizationData(),\n },\n };\n }),\n new HttpLink({\n uri: url,\n fetch: fetchWithTokenRefresh(logout, refreshToken),\n }),\n ]),\n });\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"createApolloClient"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"url"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7a154e"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-950598"},"children":[{"type":"text","value":"getAuthorizationData"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"authorization"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-474837"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"<"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"undefined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" >,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"ApolloClientBase"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// ...other options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" link: "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"ApolloLink"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"(["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// ...other options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-950598"},"children":[{"type":"text","value":"setContext"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"_"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":", { "}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"getAuthorizationData"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"(),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"HttpLink"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" uri: "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"url"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" fetch: "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"fetchWithTokenRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ]),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" });"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Custom fetch function for this request. You should tune "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"hasUnauthorizedError"}]},{"type":"text","value":" and\n"},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"text","value":" to match your api."}]},{"type":"element","tag":"code","props":{"code":"/** Global singleton for refreshing promise */\nlet refreshingPromise: Promise | null = null;\n\n/** Checks if GraphQl errors has unauthenticated error */\nconst hasUnauthorizedError = (errors: Array<{ code?: ErrorCode }>): boolean =>\n Array.isArray(errors) &&\n errors.some(error => {\n return error.status === 401; // Distinguish unauthorized error here\n });\n\n/** Detects if customFetch is sending refresh request */\nconst isRefreshRequestOptions = (options: RequestInit) => {\n try {\n const body = JSON.parse(options?.body as string);\n return body.operationName === 'RefreshToken';\n } catch (e) {\n return false;\n }\n};\n\n/** fetchWithTokenRefresh is a custom fetch function with token refresh for apollo */\nexport const fetchWithTokenRefresh =\n (\n logout: () => void,\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n ) =>\n async (uri: string, options: RequestInit): Promise => {\n // already refreshing token, wait for it and then use refreshed token\n // or use empty authorization if refreshing failed\n if (\n !isRefreshRequestOptions(options) &&\n refreshingPromise &&\n (options.headers as Record)?.authorization\n ) {\n const newAccessToken = await refreshingPromise\n .catch(() => {\n // refreshing token from other request failed, retry without authorization\n return '';\n });\n \n options.headers = {\n ...(options.headers || {}),\n authorization: newAccessToken,\n };\n }\n\n return fetch(uri, options).then(async response => {\n const text = await response.text();\n const json = JSON.parse(text);\n\n // check for unauthorized errors, if not present, just return result\n if (\n isRefreshRequestOptions(options) ||\n !json?.errors ||\n !Array.isArray(json.errors) ||\n !hasUnauthorizedError(json.errors)\n ) {\n return {\n ...response,\n ok: true,\n json: async () =>\n new Promise(resolve => {\n resolve(json);\n }),\n text: async () =>\n new Promise(resolve => {\n resolve(text);\n }),\n };\n }\n\n // If unauthorized, refresh token and try again\n if (!refreshingPromise) {\n refreshingPromise = refreshToken()\n .then(async (tokens): Promise => {\n refreshingPromise = null;\n\n if (!tokens?.accessToken) {\n throw new Error('Session expired');\n }\n\n return tokens?.accessToken;\n })\n .catch(() => {\n refreshingPromise = null;\n\n // can't refresh token. logging out\n logout();\n throw new Error('Session expired');\n });\n }\n\n // success or any non-auth error\n return refreshingPromise\n .then(async (newAccessToken: string) => {\n // wait for other request's refreshing query to finish, when retry\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: newAccessToken,\n },\n });\n })\n .catch(async () => {\n // refreshing token from other request failed, retry without authorization\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: '',\n },\n });\n });\n });\n };\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"/** Global singleton for refreshing promise */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-474837"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-7a154e"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7a154e"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f6b4b1"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"/** Checks if GraphQl errors has unauthenticated error */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-950598"},"children":[{"type":"text","value":"hasUnauthorizedError"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9161f"},"children":[{"type":"text","value":"Array"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":"<{ "}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"code"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":"?:"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9161f"},"children":[{"type":"text","value":"ErrorCode"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" }>)"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7a154e"},"children":[{"type":"text","value":"Array"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"isArray"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"&&"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"some"}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"status"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03d8ec"},"children":[{"type":"text","value":"401"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// Distinguish unauthorized error here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"/** Detects if customFetch is sending refresh request */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-950598"},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9161f"},"children":[{"type":"text","value":"RequestInit"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa659e"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7a154e"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"operationName"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e3a64a"},"children":[{"type":"text","value":"'RefreshToken'"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f6b4b1"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"/** fetchWithTokenRefresh is a custom fetch function with token refresh for apollo */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa659e"},"children":[{"type":"text","value":"fetchWithTokenRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"="}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":": () "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":": () "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" { accessToken: "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f6b4b1"},"children":[{"type":"text","value":"undefined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ) "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9161f"},"children":[{"type":"text","value":"RequestInit"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9161f"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-b9161f"},"children":[{"type":"text","value":"Response"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// already refreshing token, wait for it and then use refreshed token"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// or use empty authorization if refreshing failed"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"&&"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"&&"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"as"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-474837"},"children":[{"type":"text","value":"Record"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-7a154e"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-7a154e"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":">)?."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"authorization"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa659e"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"refreshingPromise"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// refreshing token from other request failed, retry without authorization"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e3a64a"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" {}),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"fetch"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"async"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa659e"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa659e"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"="}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// check for unauthorized errors, if not present, just return result"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"||"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"||"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"hasUnauthorizedError"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ok: "}]},{"type":"element","tag":"span","props":{"class":"ct-f6b4b1"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"unknown"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":">("}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":">("}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// If unauthorized, refresh token and try again"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"()"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-950598"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9161f"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f6b4b1"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7a154e"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e3a64a"},"children":[{"type":"text","value":"'Session expired'"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f6b4b1"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// can't refresh token. logging out"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7a154e"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e3a64a"},"children":[{"type":"text","value":"'Session expired'"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// success or any non-auth error"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"refreshingPromise"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-950598"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// wait for other request's refreshing query to finish, when retry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"fetch"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" {}),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// refreshing token from other request failed, retry without authorization"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"fetch"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" {}),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-e3a64a"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" };"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-e3a64a{color:#A5D6FF}.ct-fa659e{color:#79C0FF}.ct-03d8ec{color:#79C0FF}.ct-b9161f{color:#FFA657}.ct-f6b4b1{color:#79C0FF}.ct-e13940{color:#C9D1D9}.ct-c46233{color:#8B949E}.ct-474837{color:#FFA657}.ct-74cbcf{color:#FF7B72}.ct-950598{color:#D2A8FF}.ct-7a154e{color:#79C0FF}.ct-8cd428{color:#79C0FF}.ct-fea699{color:#FF7B72}.ct-130286{color:#FFA657}.ct-5c3e14{color:#C9D1D9}.ct-6ce606{color:#D2A8FF}.ct-47017b{color:#FF7B72}.ct-5af85c{color:#C9D1D9}.ct-e8f4d5{color:#FF7B72}.light .ct-e8f4d5{color:#859900}.light .ct-5af85c{color:#657B83}.light .ct-47017b{color:#073642}.light .ct-6ce606{color:#268BD2}.light .ct-5c3e14{color:#657B83}.light .ct-130286{color:#657B83}.light .ct-fea699{color:#859900}.light .ct-8cd428{color:#859900}.light .ct-7a154e{color:#859900}.light .ct-950598{color:#268BD2}.light .ct-74cbcf{color:#073642}.light .ct-474837{color:#268BD2}.light .ct-c46233{color:#93A1A1}.light .ct-e13940{color:#268BD2}.light .ct-f6b4b1{color:#B58900}.light .ct-b9161f{color:#268BD2}.light .ct-03d8ec{color:#D33682}.light .ct-fa659e{color:#268BD2}.light .ct-e3a64a{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:GraphQL:Refresh token in Apollo client.md","_source":"content","_file":"GraphQL/Refresh token in Apollo client.md","_extension":"md"},{"_path":"/linux/certbot-well-known-auto-renew","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Certbot Well Known Auto Renew","description":"This is translation of article from clsv.ru, which explains how to automate certbot's well-known, also known as HTTP challenge for wildcard certs renewal.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is translation of article from "},{"type":"element","tag":"a","props":{"href":"https://clsv.ru/linux/lets_encrypt_eto_legko_i_prosto_60","rel":["nofollow"]},"children":[{"type":"text","value":"clsv.ru"}]},{"type":"text","value":", which explains how to automate certbot's well-known, also known as HTTP challenge for wildcard certs renewal."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You'll need 4 scripts:"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Authentication script, which will write authentication file:"}]}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\necho $CERTBOT_VALIDATION > /var/www/html/.well-known/$CERTBOT_TOKEN\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"#!/bin/bash\necho $CERTBOT_VALIDATION > /var/www/html/.well-known/$CERTBOT_TOKEN\n"}]}]}]},{"type":"element","tag":"ol","props":{"start":2},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Cleanup script, that will delete that"}]}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\nrm -f /var/www/html/.well-known/$CERTBOT_TOKEN\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"#!/bin/bash\nrm -f /var/www/html/.well-known/$CERTBOT_TOKEN\n"}]}]}]},{"type":"element","tag":"ol","props":{"start":3},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Initial cert acquiring script:"}]}]},{"type":"element","tag":"code","props":{"code":"certbot certonly \\\n --preferred-challenges=http --manual \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /oath/to/clean.sh\n -d \"yourhost.org,*.yourhost.org\" \\\n --manual-public-ip-logging-ok\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"certbot certonly \\\n --preferred-challenges=http --manual \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /oath/to/clean.sh\n -d \"yourhost.org,*.yourhost.org\" \\\n --manual-public-ip-logging-ok\n"}]}]}]},{"type":"element","tag":"ol","props":{"start":4},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Renewal script itself, to put it in crontab (or /etc/cron.weekly)"}]}]},{"type":"element","tag":"code","props":{"code":"certbot renew --manual-public-ip-logging-ok \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /path/to/clean.sh\n\nsystemctl reload nginx\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"certbot renew --manual-public-ip-logging-ok \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /path/to/clean.sh\n\nsystemctl reload nginx\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to configure your http server to serve "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".well-known"}]},{"type":"text","value":"."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is translation of article from "},{"type":"element","tag":"a","props":{"href":"https://clsv.ru/linux/lets_encrypt_eto_legko_i_prosto_60","rel":["nofollow"]},"children":[{"type":"text","value":"clsv.ru"}]},{"type":"text","value":", which explains how to automate certbot's well-known, also known as HTTP challenge for wildcard certs renewal."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You'll need 4 scripts:"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Authentication script, which will write authentication file:"}]}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\necho $CERTBOT_VALIDATION > /var/www/html/.well-known/$CERTBOT_TOKEN\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-30b3d5"},"children":[{"type":"text","value":"#!/bin/bash"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5e1d2f"},"children":[{"type":"text","value":"echo"}]},{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f1e10"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-61baa0"},"children":[{"type":"text","value":"CERTBOT_VALIDATION"}]},{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d4cb39"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":" /var/www/html/.well-known/"}]},{"type":"element","tag":"span","props":{"class":"ct-0f1e10"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-61baa0"},"children":[{"type":"text","value":"CERTBOT_TOKEN"}]}]}]}]}]},{"type":"element","tag":"ol","props":{"start":2},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Cleanup script, that will delete that"}]}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\nrm -f /var/www/html/.well-known/$CERTBOT_TOKEN\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-30b3d5"},"children":[{"type":"text","value":"#!/bin/bash"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":"rm -f /var/www/html/.well-known/"}]},{"type":"element","tag":"span","props":{"class":"ct-0f1e10"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-61baa0"},"children":[{"type":"text","value":"CERTBOT_TOKEN"}]}]}]}]}]},{"type":"element","tag":"ol","props":{"start":3},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Initial cert acquiring script:"}]}]},{"type":"element","tag":"code","props":{"code":"certbot certonly \\\n --preferred-challenges=http --manual \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /oath/to/clean.sh\n -d \"yourhost.org,*.yourhost.org\" \\\n --manual-public-ip-logging-ok\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":"certbot certonly \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":" --preferred-challenges=http --manual \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":" --manual-auth-hook /path/to/auth.sh \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":" --manual-cleanup-hook /oath/to/clean.sh"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":" -d "}]},{"type":"element","tag":"span","props":{"class":"ct-8f08f4"},"children":[{"type":"text","value":"\"yourhost.org,*.yourhost.org\""}]},{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":" --manual-public-ip-logging-ok"}]}]}]}]}]},{"type":"element","tag":"ol","props":{"start":4},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Renewal script itself, to put it in crontab (or /etc/cron.weekly)"}]}]},{"type":"element","tag":"code","props":{"code":"certbot renew --manual-public-ip-logging-ok \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /path/to/clean.sh\n\nsystemctl reload nginx\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":"certbot renew --manual-public-ip-logging-ok \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":" --manual-auth-hook /path/to/auth.sh \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":" --manual-cleanup-hook /path/to/clean.sh"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":"systemctl reload nginx"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to configure your http server to serve "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".well-known"}]},{"type":"text","value":"."}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-8f08f4{color:#A5D6FF}.ct-d4cb39{color:#FF7B72}.ct-61baa0{color:#C9D1D9}.ct-0f1e10{color:#C9D1D9}.ct-722310{color:#C9D1D9}.ct-5e1d2f{color:#79C0FF}.ct-30b3d5{color:#8B949E}.light .ct-30b3d5{color:#93A1A1}.light .ct-5e1d2f{color:#268BD2}.light .ct-722310{color:#657B83}.light .ct-0f1e10{color:#859900}.light .ct-61baa0{color:#268BD2}.light .ct-d4cb39{color:#859900}.light .ct-8f08f4{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Linux:Certbot well-known auto renew.md","_source":"content","_file":"Linux/Certbot well-known auto renew.md","_extension":"md"},{"_path":"/linux/find-out-who-uses-swap","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Find Out Who Uses Swap","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"code","props":{"code":"for file in /proc/*/status ; do awk '/VmSwap|Name/{printf $2 \" \" $3}END{ print \"\"}' $file; done | sort -k 2 -n -r | less\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"for file in /proc/*/status ; do awk '/VmSwap|Name/{printf $2 \" \" $3}END{ print \"\"}' $file; done | sort -k 2 -n -r | less\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"code","props":{"code":"for file in /proc/*/status ; do awk '/VmSwap|Name/{printf $2 \" \" $3}END{ print \"\"}' $file; done | sort -k 2 -n -r | less\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c4cc87"},"children":[{"type":"text","value":"for"}]},{"type":"element","tag":"span","props":{"class":"ct-6e3e30"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d057a0"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-6e3e30"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c4cc87"},"children":[{"type":"text","value":"in"}]},{"type":"element","tag":"span","props":{"class":"ct-6e3e30"},"children":[{"type":"text","value":" /proc/"}]},{"type":"element","tag":"span","props":{"class":"ct-c4cc87"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-6e3e30"},"children":[{"type":"text","value":"/status "}]},{"type":"element","tag":"span","props":{"class":"ct-c4cc87"},"children":[{"type":"text","value":";"}]},{"type":"element","tag":"span","props":{"class":"ct-6e3e30"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c4cc87"},"children":[{"type":"text","value":"do"}]},{"type":"element","tag":"span","props":{"class":"ct-6e3e30"},"children":[{"type":"text","value":" awk "}]},{"type":"element","tag":"span","props":{"class":"ct-bfbbb0"},"children":[{"type":"text","value":"'/VmSwap|Name/{printf $2 \" \" $3}END{ print \"\"}'"}]},{"type":"element","tag":"span","props":{"class":"ct-6e3e30"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c4cc87"},"children":[{"type":"text","value":"done"}]},{"type":"element","tag":"span","props":{"class":"ct-6e3e30"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c4cc87"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-6e3e30"},"children":[{"type":"text","value":" sort -k 2 -n -r "}]},{"type":"element","tag":"span","props":{"class":"ct-c4cc87"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-6e3e30"},"children":[{"type":"text","value":" less"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-bfbbb0{color:#A5D6FF}.ct-d057a0{color:#C9D1D9}.ct-6e3e30{color:#C9D1D9}.ct-c4cc87{color:#FF7B72}.light .ct-c4cc87{color:#859900}.light .ct-6e3e30{color:#657B83}.light .ct-d057a0{color:#268BD2}.light .ct-bfbbb0{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Linux:Find out who uses swap.md","_source":"content","_file":"Linux/Find out who uses swap.md","_extension":"md"},{"_path":"/linux/fixing-lagging-usb-headphones","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Fixing Lagging USB Headphones","description":"When receiving messages like this:","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"When receiving messages like this:"}]},{"type":"element","tag":"code","props":{"code":"Bluetooth: hci0: ACL packet for unknown connection handle 256\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"Bluetooth: hci0: ACL packet for unknown connection handle 256\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/modprobe.d/disable_btusb_autosuspend.conf"}]},{"type":"text","value":" with following content:"}]},{"type":"element","tag":"code","props":{"code":"# Disable autosuspend for btusb to make the bluetooth keyboard work again\noptions btusb enable_autosuspend=n\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"# Disable autosuspend for btusb to make the bluetooth keyboard work again\noptions btusb enable_autosuspend=n\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run"}]},{"type":"element","tag":"code","props":{"code":"mkinitcpio -P\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"mkinitcpio -P\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Reboot and debug with"}]},{"type":"element","tag":"code","props":{"code":"$ systool -v -m btusb | grep autosuspend\n enable_autosuspend = \"N\" # should be \"N\"\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"$ systool -v -m btusb | grep autosuspend\n enable_autosuspend = \"N\" # should be \"N\"\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"also"},"children":[{"type":"text","value":"Also"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"That could be either "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"btusb.enable_autosuspend=n"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"usbcore.autosuspend=-1"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"TLP has settings for BTUSB, check it to exclude your device from autosuspend"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"There's a guy on ubuntuforums, who wrote "},{"type":"element","tag":"a","props":{"href":"https://ubuntuforums.org/showthread.php?t=2159645&page=6&p=12926730#post12926730","rel":["nofollow"]},"children":[{"type":"text","value":"solution"}]},{"type":"text","value":", which disables autosuspend manually"}]}]},{"type":"element","tag":"h2","props":{"id":"refs"},"children":[{"type":"text","value":"Refs"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://bbs.archlinux.org/viewtopic.php?id=236479","rel":["nofollow"]},"children":[{"type":"text","value":"Bluetooth keyboard disconnects randomly"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://bbs.archlinux.org/viewtopic.php?id=275962","rel":["nofollow"]},"children":[{"type":"text","value":"Bluetooth keeps turning off"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://wiki.archlinux.org/title/Bluetooth#Device_connects,_then_disconnects_after_a_few_moments","rel":["nofollow"]},"children":[{"type":"text","value":"ArchWiki: Device connects, then disconnects after a few moments"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://ubuntuforums.org/showthread.php?t=2159645&page=6&p=12926730#post12926730","rel":["nofollow"]},"children":[{"type":"text","value":"Said solution with a script in rc.local"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"When receiving messages like this:"}]},{"type":"element","tag":"code","props":{"code":"Bluetooth: hci0: ACL packet for unknown connection handle 256\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5e4a7"},"children":[{"type":"text","value":"Bluetooth: hci0: ACL packet "}]},{"type":"element","tag":"span","props":{"class":"ct-107814"},"children":[{"type":"text","value":"for"}]},{"type":"element","tag":"span","props":{"class":"ct-b5e4a7"},"children":[{"type":"text","value":" unknown connection handle 256"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/modprobe.d/disable_btusb_autosuspend.conf"}]},{"type":"text","value":" with following content:"}]},{"type":"element","tag":"code","props":{"code":"# Disable autosuspend for btusb to make the bluetooth keyboard work again\noptions btusb enable_autosuspend=n\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-08f1b7"},"children":[{"type":"text","value":"# Disable autosuspend for btusb to make the bluetooth keyboard work again"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5e4a7"},"children":[{"type":"text","value":"options btusb enable_autosuspend=n"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run"}]},{"type":"element","tag":"code","props":{"code":"mkinitcpio -P\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5e4a7"},"children":[{"type":"text","value":"mkinitcpio -P"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Reboot and debug with"}]},{"type":"element","tag":"code","props":{"code":"$ systool -v -m btusb | grep autosuspend\n enable_autosuspend = \"N\" # should be \"N\"\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5e4a7"},"children":[{"type":"text","value":"$ systool -v -m btusb "}]},{"type":"element","tag":"span","props":{"class":"ct-107814"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-b5e4a7"},"children":[{"type":"text","value":" grep autosuspend"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5e4a7"},"children":[{"type":"text","value":" enable_autosuspend = "}]},{"type":"element","tag":"span","props":{"class":"ct-be00c3"},"children":[{"type":"text","value":"\"N\""}]},{"type":"element","tag":"span","props":{"class":"ct-b5e4a7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-08f1b7"},"children":[{"type":"text","value":"# should be \"N\""}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"also"},"children":[{"type":"text","value":"Also"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"That could be either "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"btusb.enable_autosuspend=n"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"usbcore.autosuspend=-1"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"TLP has settings for BTUSB, check it to exclude your device from autosuspend"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"There's a guy on ubuntuforums, who wrote "},{"type":"element","tag":"a","props":{"href":"https://ubuntuforums.org/showthread.php?t=2159645&page=6&p=12926730#post12926730","rel":["nofollow"]},"children":[{"type":"text","value":"solution"}]},{"type":"text","value":", which disables autosuspend manually"}]}]},{"type":"element","tag":"h2","props":{"id":"refs"},"children":[{"type":"text","value":"Refs"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://bbs.archlinux.org/viewtopic.php?id=236479","rel":["nofollow"]},"children":[{"type":"text","value":"Bluetooth keyboard disconnects randomly"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://bbs.archlinux.org/viewtopic.php?id=275962","rel":["nofollow"]},"children":[{"type":"text","value":"Bluetooth keeps turning off"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://wiki.archlinux.org/title/Bluetooth#Device_connects,_then_disconnects_after_a_few_moments","rel":["nofollow"]},"children":[{"type":"text","value":"ArchWiki: Device connects, then disconnects after a few moments"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://ubuntuforums.org/showthread.php?t=2159645&page=6&p=12926730#post12926730","rel":["nofollow"]},"children":[{"type":"text","value":"Said solution with a script in rc.local"}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-be00c3{color:#A5D6FF}.ct-08f1b7{color:#8B949E}.ct-107814{color:#FF7B72}.ct-b5e4a7{color:#C9D1D9}.light .ct-b5e4a7{color:#657B83}.light .ct-107814{color:#859900}.light .ct-08f1b7{color:#93A1A1}.light .ct-be00c3{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"also","depth":2,"text":"Also"},{"id":"refs","depth":2,"text":"Refs"}]}},"_type":"markdown","_id":"content:Linux:Fixing lagging USB Headphones.md","_source":"content","_file":"Linux/Fixing lagging USB Headphones.md","_extension":"md"},{"_path":"/linux/gitea-for-git-hosting","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Gitea For Git Hosting","description":"Self-hosted #git repositories with gitea and #docker.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Self-hosted #git repositories with "},{"type":"element","tag":"a","props":{"href":"https://gitea.io/ru-ru/","rel":["nofollow"]},"children":[{"type":"text","value":"gitea"}]},{"type":"text","value":" and #docker."}]},{"type":"element","tag":"h2","props":{"id":"setting-up-with-docker-compose"},"children":[{"type":"text","value":"Setting up with docker-compose"}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nnetworks:\n gitea:\n external: false\nservices:\n server:\n image: gitea/gitea:latest\n container_name: gitea\n environment:\n - USER_UID=1000\n - USER_GID=1000\n restart: always\n networks:\n - gitea\n volumes:\n - ./var/lib/gitea:/data\n - ./etc/gitea:/etc/gitea\n - /etc/timezone:/etc/timezone:ro\n - /etc/localtime:/etc/localtime:ro\n ports:\n - \"3000:3000\"\n - \"222:22\"\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: \"3\"\n\nnetworks:\n gitea:\n external: false\nservices:\n server:\n image: gitea/gitea:latest\n container_name: gitea\n environment:\n - USER_UID=1000\n - USER_GID=1000\n restart: always\n networks:\n - gitea\n volumes:\n - ./var/lib/gitea:/data\n - ./etc/gitea:/etc/gitea\n - /etc/timezone:/etc/timezone:ro\n - /etc/localtime:/etc/localtime:ro\n ports:\n - \"3000:3000\"\n - \"222:22\"\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Self-hosted #git repositories with "},{"type":"element","tag":"a","props":{"href":"https://gitea.io/ru-ru/","rel":["nofollow"]},"children":[{"type":"text","value":"gitea"}]},{"type":"text","value":" and #docker."}]},{"type":"element","tag":"h2","props":{"id":"setting-up-with-docker-compose"},"children":[{"type":"text","value":"Setting up with docker-compose"}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nnetworks:\n gitea:\n external: false\nservices:\n server:\n image: gitea/gitea:latest\n container_name: gitea\n environment:\n - USER_UID=1000\n - USER_GID=1000\n restart: always\n networks:\n - gitea\n volumes:\n - ./var/lib/gitea:/data\n - ./etc/gitea:/etc/gitea\n - /etc/timezone:/etc/timezone:ro\n - /etc/localtime:/etc/localtime:ro\n ports:\n - \"3000:3000\"\n - \"222:22\"\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"\"3\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"gitea"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"external"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-9f6859"},"children":[{"type":"text","value":"false"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"gitea/gitea:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"gitea"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"USER_UID=1000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"USER_GID=1000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"gitea"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"./var/lib/gitea:/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"./etc/gitea:/etc/gitea"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"/etc/timezone:/etc/timezone:ro"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"/etc/localtime:/etc/localtime:ro"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"\"3000:3000\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"\"222:22\""}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-9f6859{color:#79C0FF}.ct-fb340e{color:#A5D6FF}.ct-d2407a{color:#C9D1D9}.ct-03701d{color:#7EE787}.light .ct-03701d{color:#268BD2}.light .ct-d2407a{color:#657B83}.light .ct-fb340e{color:#2AA198}.light .ct-9f6859{color:#B58900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"setting-up-with-docker-compose","depth":2,"text":"Setting up with docker-compose"}]}},"_type":"markdown","_id":"content:Linux:Gitea for git hosting.md","_source":"content","_file":"Linux/Gitea for git hosting.md","_extension":"md"},{"_path":"/linux/google-photos-alternative-with-photoprism","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Google Photos Alternative With Photoprism","description":"Photo Prism is a free alternative to Google photos, can be set up with #docker.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://photoprism.app/","rel":["nofollow"]},"children":[{"type":"text","value":"Photo Prism"}]},{"type":"text","value":" is a free alternative to Google photos, can be set up with #docker."}]},{"type":"element","tag":"h2","props":{"id":"docker-compose-file-to-run-it"},"children":[{"type":"text","value":"Docker compose file to run it"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Check out current "},{"type":"element","tag":"a","props":{"href":"https://dl.photoprism.app/docker/docker-compose.yml","rel":["nofollow"]},"children":[{"type":"text","value":"example"}]},{"type":"text","value":" at photoprism's "},{"type":"element","tag":"a","props":{"href":"https://docs.photoprism.app/getting-started/docker-compose/","rel":["nofollow"]},"children":[{"type":"text","value":"documentation"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"version: '3.5'\n\nservices:\n photoprism:\n container_name: photoprism__app\n image: photoprism/photoprism:latest\n depends_on:\n - mariadb\n restart: unless-stopped\n security_opt:\n - seccomp:unconfined\n - apparmor:unconfined\n ports:\n - 2342:2342 # HTTP port (host:container)\n environment:\n PHOTOPRISM_ADMIN_PASSWORD: \"password\"\n PHOTOPRISM_SITE_URL: \"https://service.url/\"\n PHOTOPRISM_ORIGINALS_LIMIT: 5000\n PHOTOPRISM_HTTP_COMPRESSION: \"gzip\"\n PHOTOPRISM_DEBUG: \"false\" \n PHOTOPRISM_PUBLIC: \"false\" \n PHOTOPRISM_READONLY: \"false\" \n PHOTOPRISM_EXPERIMENTAL: \"false\"\n PHOTOPRISM_DISABLE_CHOWN: \"false\"\n PHOTOPRISM_DISABLE_WEBDAV: \"false\" \n PHOTOPRISM_DISABLE_SETTINGS: \"false\"\n PHOTOPRISM_DISABLE_TENSORFLOW: \"false\"\n PHOTOPRISM_DISABLE_FACES: \"false\" \n PHOTOPRISM_DISABLE_CLASSIFICATION: \"false\"\n PHOTOPRISM_DARKTABLE_PRESETS: \"false\" \n PHOTOPRISM_DETECT_NSFW: \"false\" \n PHOTOPRISM_UPLOAD_NSFW: \"true\" \n PHOTOPRISM_DATABASE_DRIVER: \"mysql\" \n PHOTOPRISM_DATABASE_SERVER: \"mariadb:3306\"\n PHOTOPRISM_DATABASE_NAME: \"photoprism\" \n PHOTOPRISM_DATABASE_USER: \"root\" \n PHOTOPRISM_DATABASE_PASSWORD: \"insecure\" \n PHOTOPRISM_SITE_TITLE: \"PhotoPrism\"\n PHOTOPRISM_SITE_CAPTION: \"Browse Your Life\"\n PHOTOPRISM_SITE_DESCRIPTION: \"\"\n      PHOTOPRISM_SITE_AUTHOR: \"\"\n      HOME: \"/photoprism\"\n    working_dir: \"/photoprism\"\n    volumes:\n      - \"./data/originals:/photoprism/originals\"    \n      - \"./data/imports:/photoprism/import\"\n      - \"./data/storage:/photoprism/storage\"\n  mariadb:\n    container_name: photoprism__db\n    restart: unless-stopped\n    image: mariadb:10.6\n    security_opt:\n      - seccomp:unconfined\n      - apparmor:unconfined\n    command: mysqld --innodb-buffer-pool-size=128M --transaction-isolation=READ-COMMITTED --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci --max-connections=512 --innodb-rollback-on-timeout=OFF --innodb-lock-wait-timeout=120\n    volumes:\n      - \"./database:/var/lib/mysql\" # Important, don't remove\n    environment:\n      MYSQL_ROOT_PASSWORD: insecure\n      MYSQL_DATABASE: photoprism\n      MYSQL_USER: photoprism\n      MYSQL_PASSWORD: insecure\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: '3.5'\n\nservices:\n photoprism:\n container_name: photoprism__app\n image: photoprism/photoprism:latest\n depends_on:\n - mariadb\n restart: unless-stopped\n security_opt:\n - seccomp:unconfined\n - apparmor:unconfined\n ports:\n - 2342:2342 # HTTP port (host:container)\n environment:\n PHOTOPRISM_ADMIN_PASSWORD: \"password\"\n PHOTOPRISM_SITE_URL: \"https://service.url/\"\n PHOTOPRISM_ORIGINALS_LIMIT: 5000\n PHOTOPRISM_HTTP_COMPRESSION: \"gzip\"\n PHOTOPRISM_DEBUG: \"false\" \n PHOTOPRISM_PUBLIC: \"false\" \n PHOTOPRISM_READONLY: \"false\" \n PHOTOPRISM_EXPERIMENTAL: \"false\"\n PHOTOPRISM_DISABLE_CHOWN: \"false\"\n PHOTOPRISM_DISABLE_WEBDAV: \"false\" \n PHOTOPRISM_DISABLE_SETTINGS: \"false\"\n PHOTOPRISM_DISABLE_TENSORFLOW: \"false\"\n PHOTOPRISM_DISABLE_FACES: \"false\" \n PHOTOPRISM_DISABLE_CLASSIFICATION: \"false\"\n PHOTOPRISM_DARKTABLE_PRESETS: \"false\" \n PHOTOPRISM_DETECT_NSFW: \"false\" \n PHOTOPRISM_UPLOAD_NSFW: \"true\" \n PHOTOPRISM_DATABASE_DRIVER: \"mysql\" \n PHOTOPRISM_DATABASE_SERVER: \"mariadb:3306\"\n PHOTOPRISM_DATABASE_NAME: \"photoprism\" \n PHOTOPRISM_DATABASE_USER: \"root\" \n PHOTOPRISM_DATABASE_PASSWORD: \"insecure\" \n PHOTOPRISM_SITE_TITLE: \"PhotoPrism\"\n PHOTOPRISM_SITE_CAPTION: \"Browse Your Life\"\n PHOTOPRISM_SITE_DESCRIPTION: \"\"\n      PHOTOPRISM_SITE_AUTHOR: \"\"\n      HOME: \"/photoprism\"\n    working_dir: \"/photoprism\"\n    volumes:\n      - \"./data/originals:/photoprism/originals\"    \n      - \"./data/imports:/photoprism/import\"\n      - \"./data/storage:/photoprism/storage\"\n  mariadb:\n    container_name: photoprism__db\n    restart: unless-stopped\n    image: mariadb:10.6\n    security_opt:\n      - seccomp:unconfined\n      - apparmor:unconfined\n    command: mysqld --innodb-buffer-pool-size=128M --transaction-isolation=READ-COMMITTED --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci --max-connections=512 --innodb-rollback-on-timeout=OFF --innodb-lock-wait-timeout=120\n    volumes:\n      - \"./database:/var/lib/mysql\" # Important, don't remove\n    environment:\n      MYSQL_ROOT_PASSWORD: insecure\n      MYSQL_DATABASE: photoprism\n      MYSQL_USER: photoprism\n      MYSQL_PASSWORD: insecure\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://photoprism.app/","rel":["nofollow"]},"children":[{"type":"text","value":"Photo Prism"}]},{"type":"text","value":" is a free alternative to Google photos, can be set up with #docker."}]},{"type":"element","tag":"h2","props":{"id":"docker-compose-file-to-run-it"},"children":[{"type":"text","value":"Docker compose file to run it"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Check out current "},{"type":"element","tag":"a","props":{"href":"https://dl.photoprism.app/docker/docker-compose.yml","rel":["nofollow"]},"children":[{"type":"text","value":"example"}]},{"type":"text","value":" at photoprism's "},{"type":"element","tag":"a","props":{"href":"https://docs.photoprism.app/getting-started/docker-compose/","rel":["nofollow"]},"children":[{"type":"text","value":"documentation"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"version: '3.5'\n\nservices:\n photoprism:\n container_name: photoprism__app\n image: photoprism/photoprism:latest\n depends_on:\n - mariadb\n restart: unless-stopped\n security_opt:\n - seccomp:unconfined\n - apparmor:unconfined\n ports:\n - 2342:2342 # HTTP port (host:container)\n environment:\n PHOTOPRISM_ADMIN_PASSWORD: \"password\"\n PHOTOPRISM_SITE_URL: \"https://service.url/\"\n PHOTOPRISM_ORIGINALS_LIMIT: 5000\n PHOTOPRISM_HTTP_COMPRESSION: \"gzip\"\n PHOTOPRISM_DEBUG: \"false\" \n PHOTOPRISM_PUBLIC: \"false\" \n PHOTOPRISM_READONLY: \"false\" \n PHOTOPRISM_EXPERIMENTAL: \"false\"\n PHOTOPRISM_DISABLE_CHOWN: \"false\"\n PHOTOPRISM_DISABLE_WEBDAV: \"false\" \n PHOTOPRISM_DISABLE_SETTINGS: \"false\"\n PHOTOPRISM_DISABLE_TENSORFLOW: \"false\"\n PHOTOPRISM_DISABLE_FACES: \"false\" \n PHOTOPRISM_DISABLE_CLASSIFICATION: \"false\"\n PHOTOPRISM_DARKTABLE_PRESETS: \"false\" \n PHOTOPRISM_DETECT_NSFW: \"false\" \n PHOTOPRISM_UPLOAD_NSFW: \"true\" \n PHOTOPRISM_DATABASE_DRIVER: \"mysql\" \n PHOTOPRISM_DATABASE_SERVER: \"mariadb:3306\"\n PHOTOPRISM_DATABASE_NAME: \"photoprism\" \n PHOTOPRISM_DATABASE_USER: \"root\" \n PHOTOPRISM_DATABASE_PASSWORD: \"insecure\" \n PHOTOPRISM_SITE_TITLE: \"PhotoPrism\"\n PHOTOPRISM_SITE_CAPTION: \"Browse Your Life\"\n PHOTOPRISM_SITE_DESCRIPTION: \"\"\n      PHOTOPRISM_SITE_AUTHOR: \"\"\n      HOME: \"/photoprism\"\n    working_dir: \"/photoprism\"\n    volumes:\n      - \"./data/originals:/photoprism/originals\"    \n      - \"./data/imports:/photoprism/import\"\n      - \"./data/storage:/photoprism/storage\"\n  mariadb:\n    container_name: photoprism__db\n    restart: unless-stopped\n    image: mariadb:10.6\n    security_opt:\n      - seccomp:unconfined\n      - apparmor:unconfined\n    command: mysqld --innodb-buffer-pool-size=128M --transaction-isolation=READ-COMMITTED --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci --max-connections=512 --innodb-rollback-on-timeout=OFF --innodb-lock-wait-timeout=120\n    volumes:\n      - \"./database:/var/lib/mysql\" # Important, don't remove\n    environment:\n      MYSQL_ROOT_PASSWORD: insecure\n      MYSQL_DATABASE: photoprism\n      MYSQL_USER: photoprism\n      MYSQL_PASSWORD: insecure\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"'3.5'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"photoprism"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"photoprism__app"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"photoprism/photoprism:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"depends_on"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"mariadb"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"unless-stopped"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"security_opt"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"seccomp:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"apparmor:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"2342:2342"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f03ff"},"children":[{"type":"text","value":"# HTTP port (host:container)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_ADMIN_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"password\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"https://service.url/\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_ORIGINALS_LIMIT"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-074800"},"children":[{"type":"text","value":"5000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_HTTP_COMPRESSION"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"gzip\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DEBUG"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_PUBLIC"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_READONLY"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_EXPERIMENTAL"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_CHOWN"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_WEBDAV"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_SETTINGS"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_TENSORFLOW"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_FACES"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_CLASSIFICATION"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DARKTABLE_PRESETS"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DETECT_NSFW"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_UPLOAD_NSFW"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"true\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_DRIVER"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"mysql\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_SERVER"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"mariadb:3306\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_NAME"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"photoprism\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_USER"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"root\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"insecure\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_TITLE"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"PhotoPrism\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_CAPTION"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"Browse Your Life\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_DESCRIPTION"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_AUTHOR"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"HOME"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"/photoprism\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"working_dir"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"/photoprism\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"./data/originals:/photoprism/originals\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"    "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"./data/imports:/photoprism/import\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"./data/storage:/photoprism/storage\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"mariadb"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"photoprism__db"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"unless-stopped"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"mariadb:10.6"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"security_opt"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"seccomp:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"apparmor:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"command"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"mysqld --innodb-buffer-pool-size=128M --transaction-isolation=READ-COMMITTED --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci --max-connections=512 --innodb-rollback-on-timeout=OFF --innodb-lock-wait-timeout=120"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"./database:/var/lib/mysql\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f03ff"},"children":[{"type":"text","value":"# Important, don't remove"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"MYSQL_ROOT_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"insecure"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"MYSQL_DATABASE"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"photoprism"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"MYSQL_USER"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"photoprism"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"MYSQL_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"insecure"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-074800{color:#79C0FF}.ct-5f03ff{color:#8B949E}.ct-608ab5{color:#A5D6FF}.ct-9aaab4{color:#C9D1D9}.ct-6b85fe{color:#7EE787}.light .ct-6b85fe{color:#268BD2}.light .ct-9aaab4{color:#657B83}.light .ct-608ab5{color:#2AA198}.light .ct-5f03ff{color:#93A1A1}.light .ct-074800{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"docker-compose-file-to-run-it","depth":2,"text":"Docker compose file to run it"}]}},"_type":"markdown","_id":"content:Linux:Google photos alternative with Photoprism.md","_source":"content","_file":"Linux/Google photos alternative with Photoprism.md","_extension":"md"},{"_path":"/linux/linux-on-asus-zenbook-um3402-ya","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Linux On Asus Zenbook UM3402 YA","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"installing-linux-with-dualboot-alongside-windows-11"},"children":[{"type":"text","value":"Installing Linux with DualBoot alongside Windows 11"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://www.asus.com/support/FAQ/1047461/","rel":["nofollow"]},"children":[{"type":"text","value":"Disable BitLocker in Windows"}]},{"type":"text","value":", don't forget to backup your key"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://www.asus.com/me-en/support/FAQ/1044688/#Win11","rel":["nofollow"]},"children":[{"type":"text","value":"Shrink system partition"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Disable Secure Boot in Bios:"},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Pressing F2 while booting"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Then F7 in bios"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Select \"Security\" -> \"Secure Boot\" -> Disable."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Press F10 to save and reboot"}]}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Boot in windows, check that everything's wotking"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Burn image with "},{"type":"element","tag":"a","props":{"href":"https://rufus.ie/","rel":["nofollow"]},"children":[{"type":"text","value":"rufus"}]},{"type":"text","value":", reboot, press F2, choose your USB drive as first boot option"}]}]},{"type":"element","tag":"h2","props":{"id":"getting-bluetooth-working-with-mediatek-7921e"},"children":[{"type":"text","value":"Getting bluetooth working with Mediatek 7921e"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Problem"}]},{"type":"text","value":": WiFi is working on Zenbook UM3402-YA, but bluetooth doesn't."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"According to this "},{"type":"element","tag":"a","props":{"href":"https://www.linux.org/threads/solved-wifi-adaptator-not-found-mediatek-wi-fi-6-mt7921-wireless-lan-card.37699/page-2#post-143291","rel":["nofollow"]},"children":[{"type":"text","value":"answer"}]},{"type":"text","value":" you should just turn your laptop off, disconnect power supply and "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"hold power key for 60 seconds"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"After that press Power key again and wait for about 10-20sec for asus logo to appear. Then "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"press F2 and disable secure boot again"}]},{"type":"text","value":", that's the necessary part."}]},{"type":"element","tag":"h2","props":{"id":"power-usage-optimizations"},"children":[{"type":"text","value":"Power usage optimizations"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Install "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"tlp"}]},{"type":"text","value":" and enable it with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"systemctl enable --now tlp"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"installing-linux-with-dualboot-alongside-windows-11"},"children":[{"type":"text","value":"Installing Linux with DualBoot alongside Windows 11"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://www.asus.com/support/FAQ/1047461/","rel":["nofollow"]},"children":[{"type":"text","value":"Disable BitLocker in Windows"}]},{"type":"text","value":", don't forget to backup your key"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://www.asus.com/me-en/support/FAQ/1044688/#Win11","rel":["nofollow"]},"children":[{"type":"text","value":"Shrink system partition"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Disable Secure Boot in Bios:"},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Pressing F2 while booting"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Then F7 in bios"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Select \"Security\" -> \"Secure Boot\" -> Disable."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Press F10 to save and reboot"}]}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Boot in windows, check that everything's wotking"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Burn image with "},{"type":"element","tag":"a","props":{"href":"https://rufus.ie/","rel":["nofollow"]},"children":[{"type":"text","value":"rufus"}]},{"type":"text","value":", reboot, press F2, choose your USB drive as first boot option"}]}]},{"type":"element","tag":"h2","props":{"id":"getting-bluetooth-working-with-mediatek-7921e"},"children":[{"type":"text","value":"Getting bluetooth working with Mediatek 7921e"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Problem"}]},{"type":"text","value":": WiFi is working on Zenbook UM3402-YA, but bluetooth doesn't."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"According to this "},{"type":"element","tag":"a","props":{"href":"https://www.linux.org/threads/solved-wifi-adaptator-not-found-mediatek-wi-fi-6-mt7921-wireless-lan-card.37699/page-2#post-143291","rel":["nofollow"]},"children":[{"type":"text","value":"answer"}]},{"type":"text","value":" you should just turn your laptop off, disconnect power supply and "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"hold power key for 60 seconds"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"After that press Power key again and wait for about 10-20sec for asus logo to appear. Then "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"press F2 and disable secure boot again"}]},{"type":"text","value":", that's the necessary part."}]},{"type":"element","tag":"h2","props":{"id":"power-usage-optimizations"},"children":[{"type":"text","value":"Power usage optimizations"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Install "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"tlp"}]},{"type":"text","value":" and enable it with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"systemctl enable --now tlp"}]}]}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"installing-linux-with-dualboot-alongside-windows-11","depth":2,"text":"Installing Linux with DualBoot alongside Windows 11"},{"id":"getting-bluetooth-working-with-mediatek-7921e","depth":2,"text":"Getting bluetooth working with Mediatek 7921e"},{"id":"power-usage-optimizations","depth":2,"text":"Power usage optimizations"}]}},"_type":"markdown","_id":"content:Linux:Linux on Asus Zenbook UM3402-YA.md","_source":"content","_file":"Linux/Linux on Asus Zenbook UM3402-YA.md","_extension":"md"},{"_path":"/linux/resume-or-start-screen-session","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Resume Or Start Screen Session","description":"Running this script will enter currently running screen session or will start new one.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Running this script will enter currently running "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"screen"}]},{"type":"text","value":" session or will start new one."}]},{"type":"element","tag":"code","props":{"code":"( screen -r bash || ( screen -d bash && screen -r bash || screen -SAm bash bash ) )\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"( screen -r bash || ( screen -d bash && screen -r bash || screen -SAm bash bash ) )\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Running this script will enter currently running "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"screen"}]},{"type":"text","value":" session or will start new one."}]},{"type":"element","tag":"code","props":{"code":"( screen -r bash || ( screen -d bash && screen -r bash || screen -SAm bash bash ) )\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-322b82"},"children":[{"type":"text","value":"( screen -r bash "}]},{"type":"element","tag":"span","props":{"class":"ct-14dc6a"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-322b82"},"children":[{"type":"text","value":" ( screen -d bash "}]},{"type":"element","tag":"span","props":{"class":"ct-14dc6a"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-322b82"},"children":[{"type":"text","value":" screen -r bash "}]},{"type":"element","tag":"span","props":{"class":"ct-14dc6a"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-322b82"},"children":[{"type":"text","value":" screen -SAm bash bash ) )"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-14dc6a{color:#FF7B72}.ct-322b82{color:#C9D1D9}.light .ct-322b82{color:#657B83}.light .ct-14dc6a{color:#859900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Linux:Resume or start screen session.md","_source":"content","_file":"Linux/Resume or start screen session.md","_extension":"md"},{"_path":"/linux/rsync-file-with-ssh","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Rsync File With SSH","description":"Downloads file from #SSH with rsync and puts it in current folder.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Downloads file from #SSH with rsync and puts it in current folder."}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\n\nPORT=22\nUSER=user\nHOST=example.com\nREMOTE_PATH=/tmp\nREMOTE_FILE=sample.text\nDEST_PATH=./\n\nrsync -a -e \"ssh -p $PORT\" -P -v \\\n \"$USER@$HOST:$REMOTE_PATH/$REMOTE_FILE\" \\\n \"$DEST_PATH\"\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"#!/bin/bash\n\nPORT=22\nUSER=user\nHOST=example.com\nREMOTE_PATH=/tmp\nREMOTE_FILE=sample.text\nDEST_PATH=./\n\nrsync -a -e \"ssh -p $PORT\" -P -v \\\n \"$USER@$HOST:$REMOTE_PATH/$REMOTE_FILE\" \\\n \"$DEST_PATH\"\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Downloads file from #SSH with rsync and puts it in current folder."}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\n\nPORT=22\nUSER=user\nHOST=example.com\nREMOTE_PATH=/tmp\nREMOTE_FILE=sample.text\nDEST_PATH=./\n\nrsync -a -e \"ssh -p $PORT\" -P -v \\\n \"$USER@$HOST:$REMOTE_PATH/$REMOTE_FILE\" \\\n \"$DEST_PATH\"\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90ed2f"},"children":[{"type":"text","value":"#!/bin/bash"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ea4740"},"children":[{"type":"text","value":"PORT=22"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ea4740"},"children":[{"type":"text","value":"USER=user"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ea4740"},"children":[{"type":"text","value":"HOST=example.com"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ea4740"},"children":[{"type":"text","value":"REMOTE_PATH=/tmp"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ea4740"},"children":[{"type":"text","value":"REMOTE_FILE=sample.text"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ea4740"},"children":[{"type":"text","value":"DEST_PATH=./"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ea4740"},"children":[{"type":"text","value":"rsync -a -e "}]},{"type":"element","tag":"span","props":{"class":"ct-51c85e"},"children":[{"type":"text","value":"\"ssh -p "}]},{"type":"element","tag":"span","props":{"class":"ct-6e26d5"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7ae610"},"children":[{"type":"text","value":"PORT"}]},{"type":"element","tag":"span","props":{"class":"ct-51c85e"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-ea4740"},"children":[{"type":"text","value":" -P -v \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ea4740"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-51c85e"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-6e26d5"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7ae610"},"children":[{"type":"text","value":"USER"}]},{"type":"element","tag":"span","props":{"class":"ct-51c85e"},"children":[{"type":"text","value":"@"}]},{"type":"element","tag":"span","props":{"class":"ct-6e26d5"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7ae610"},"children":[{"type":"text","value":"HOST"}]},{"type":"element","tag":"span","props":{"class":"ct-51c85e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-6e26d5"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7ae610"},"children":[{"type":"text","value":"REMOTE_PATH"}]},{"type":"element","tag":"span","props":{"class":"ct-51c85e"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-6e26d5"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7ae610"},"children":[{"type":"text","value":"REMOTE_FILE"}]},{"type":"element","tag":"span","props":{"class":"ct-51c85e"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-ea4740"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ea4740"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-51c85e"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-6e26d5"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7ae610"},"children":[{"type":"text","value":"DEST_PATH"}]},{"type":"element","tag":"span","props":{"class":"ct-51c85e"},"children":[{"type":"text","value":"\""}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-7ae610{color:#C9D1D9}.ct-6e26d5{color:#C9D1D9}.ct-51c85e{color:#A5D6FF}.ct-ea4740{color:#C9D1D9}.ct-90ed2f{color:#8B949E}.light .ct-90ed2f{color:#93A1A1}.light .ct-ea4740{color:#657B83}.light .ct-51c85e{color:#2AA198}.light .ct-6e26d5{color:#859900}.light .ct-7ae610{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Linux:Rsync file with SSH.md","_source":"content","_file":"Linux/Rsync file with SSH.md","_extension":"md"},{"_path":"/linux/setting-up-nginx","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Setting Up NGINX","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"fallback-url-for-spa-s"},"children":[{"type":"text","value":"Fallback url for SPA-s"}]},{"type":"element","tag":"code","props":{"code":"server {\n # ...\n location / {\n # First attempt to serve request as file, then\n # as directory, then fall back to displaying a 404.\n try_files $uri $uri/ =404;\n }\n # ...\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"server {\n # ...\n location / {\n # First attempt to serve request as file, then\n # as directory, then fall back to displaying a 404.\n try_files $uri $uri/ =404;\n }\n # ...\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"set-up-for-uploads"},"children":[{"type":"text","value":"Set up for uploads"}]},{"type":"element","tag":"code","props":{"code":"server {\n # ...\n client_max_body_size 200M;\n # ...\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"server {\n # ...\n client_max_body_size 200M;\n # ...\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"reverse-proxy-for-https"},"children":[{"type":"text","value":"Reverse proxy for https"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Given config forwards "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https"}]},{"type":"text","value":" traffic to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"http"}]},{"type":"text","value":" on port "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"8080"}]},{"type":"text","value":" for "},{"type":"element","tag":"a","props":{"href":"https://next.vault48.org","rel":["nofollow"]},"children":[{"type":"text","value":"https://next.vault48.org"}]},{"type":"text","value":"\nwith http2 support if possible."}]},{"type":"element","tag":"code","props":{"code":"server {\n listen 80;\n server_name next.vault48.org;\n return 301 https://next.vault48.org$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n \n # managed by Certbot\n ssl_certificate /etc/letsencrypt/live/vault48.org/fullchain.pem; \n ssl_certificate_key /etc/letsencrypt/live/vault48.org/privkey.pem; \n ssl_trusted_certificate /etc/letsencrypt/live/vault48.org/chain.pem;\n \n server_name next.vault48.org;\n \n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n \n proxy_pass http://127.0.0.1:8080;\n }\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"server {\n listen 80;\n server_name next.vault48.org;\n return 301 https://next.vault48.org$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n \n # managed by Certbot\n ssl_certificate /etc/letsencrypt/live/vault48.org/fullchain.pem; \n ssl_certificate_key /etc/letsencrypt/live/vault48.org/privkey.pem; \n ssl_trusted_certificate /etc/letsencrypt/live/vault48.org/chain.pem;\n \n server_name next.vault48.org;\n \n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n \n proxy_pass http://127.0.0.1:8080;\n }\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"fallback-url-for-spa-s"},"children":[{"type":"text","value":"Fallback url for SPA-s"}]},{"type":"element","tag":"code","props":{"code":"server {\n # ...\n location / {\n # First attempt to serve request as file, then\n # as directory, then fall back to displaying a 404.\n try_files $uri $uri/ =404;\n }\n # ...\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74d8c8"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ae28ca"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cdaa3d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f33879"},"children":[{"type":"text","value":"location"}]},{"type":"element","tag":"span","props":{"class":"ct-cdaa3d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f5638"},"children":[{"type":"text","value":"/ "}]},{"type":"element","tag":"span","props":{"class":"ct-cdaa3d"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ae28ca"},"children":[{"type":"text","value":"# First attempt to serve request as file, then"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ae28ca"},"children":[{"type":"text","value":"# as directory, then fall back to displaying a 404."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-671b3f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ae28ca"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"set-up-for-uploads"},"children":[{"type":"text","value":"Set up for uploads"}]},{"type":"element","tag":"code","props":{"code":"server {\n # ...\n client_max_body_size 200M;\n # ...\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74d8c8"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ae28ca"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" client_max_body_size "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"200M;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ae28ca"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"reverse-proxy-for-https"},"children":[{"type":"text","value":"Reverse proxy for https"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Given config forwards "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https"}]},{"type":"text","value":" traffic to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"http"}]},{"type":"text","value":" on port "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"8080"}]},{"type":"text","value":" for "},{"type":"element","tag":"a","props":{"href":"https://next.vault48.org","rel":["nofollow"]},"children":[{"type":"text","value":"https://next.vault48.org"}]},{"type":"text","value":"\nwith http2 support if possible."}]},{"type":"element","tag":"code","props":{"code":"server {\n listen 80;\n server_name next.vault48.org;\n return 301 https://next.vault48.org$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n \n # managed by Certbot\n ssl_certificate /etc/letsencrypt/live/vault48.org/fullchain.pem; \n ssl_certificate_key /etc/letsencrypt/live/vault48.org/privkey.pem; \n ssl_trusted_certificate /etc/letsencrypt/live/vault48.org/chain.pem;\n \n server_name next.vault48.org;\n \n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n \n proxy_pass http://127.0.0.1:8080;\n }\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74d8c8"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"80;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"next.vault48.org;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-078709"},"children":[{"type":"text","value":"301"}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" https://next.vault48.org"}]},{"type":"element","tag":"span","props":{"class":"ct-bc98b4"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-e3a788"},"children":[{"type":"text","value":"request_uri"}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74d8c8"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"443 ssl http2;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"[::]:443 ssl http2;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ae28ca"},"children":[{"type":"text","value":"# managed by Certbot"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" ssl_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"/etc/letsencrypt/live/vault48.org/fullchain.pem; "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" ssl_certificate_key "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"/etc/letsencrypt/live/vault48.org/privkey.pem; "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" ssl_trusted_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"/etc/letsencrypt/live/vault48.org/chain.pem;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"next.vault48.org;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cdaa3d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f33879"},"children":[{"type":"text","value":"location"}]},{"type":"element","tag":"span","props":{"class":"ct-cdaa3d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f5638"},"children":[{"type":"text","value":"/ "}]},{"type":"element","tag":"span","props":{"class":"ct-cdaa3d"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" proxy_redirect "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"off;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"Host "}]},{"type":"element","tag":"span","props":{"class":"ct-bc98b4"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-e3a788"},"children":[{"type":"text","value":"host"}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"X-Real-IP "}]},{"type":"element","tag":"span","props":{"class":"ct-bc98b4"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-e3a788"},"children":[{"type":"text","value":"remote_addr"}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"X-Forwarded-For "}]},{"type":"element","tag":"span","props":{"class":"ct-bc98b4"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-e3a788"},"children":[{"type":"text","value":"proxy_add_x_forwarded_for"}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" proxy_pass "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"http://127.0.0.1:8080;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-e3a788{color:#C9D1D9}.ct-bc98b4{color:#C9D1D9}.ct-078709{color:#79C0FF}.ct-9982ad{color:#FF7B72}.ct-671b3f{color:#FF7B72}.ct-6f5638{color:#FFA657}.ct-f33879{color:#FF7B72}.ct-cdaa3d{color:#C9D1D9}.ct-ae28ca{color:#8B949E}.ct-ab6757{color:#C9D1D9}.ct-74d8c8{color:#FF7B72}.light .ct-74d8c8{color:#073642}.light .ct-ab6757{color:#657B83}.light .ct-ae28ca{color:#93A1A1}.light .ct-cdaa3d{color:#657B83}.light .ct-f33879{color:#073642}.light .ct-6f5638{color:#657B83}.light .ct-671b3f{color:#657B83}.light .ct-9982ad{color:#859900}.light .ct-078709{color:#D33682}.light .ct-bc98b4{color:#859900}.light .ct-e3a788{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"fallback-url-for-spa-s","depth":2,"text":"Fallback url for SPA-s"},{"id":"set-up-for-uploads","depth":2,"text":"Set up for uploads"},{"id":"reverse-proxy-for-https","depth":2,"text":"Reverse proxy for https"}]}},"_type":"markdown","_id":"content:Linux:Setting up NGINX.md","_source":"content","_file":"Linux/Setting up NGINX.md","_extension":"md"},{"_path":"/linux/ssh","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"SSH","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"config-aliases-for-ssh-hosts"},"children":[{"type":"text","value":"Config aliases for #SSH hosts"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"#SSH config can be used to made aliases for different hosts. Should be put at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"~/.ssh/config"}]},{"type":"text","value":". To simply call "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"ssh router"}]},{"type":"text","value":" without parameters, use this:"}]},{"type":"element","tag":"code","props":{"code":"Host router\n HostName 192.168.0.1\n IdentityFile ~/.ssh/id_rsa\n User root\n Port 22522\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"Host router\n HostName 192.168.0.1\n IdentityFile ~/.ssh/id_rsa\n User root\n Port 22522\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"config-aliases-for-ssh-hosts"},"children":[{"type":"text","value":"Config aliases for #SSH hosts"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"#SSH config can be used to made aliases for different hosts. Should be put at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"~/.ssh/config"}]},{"type":"text","value":". To simply call "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"ssh router"}]},{"type":"text","value":" without parameters, use this:"}]},{"type":"element","tag":"code","props":{"code":"Host router\n HostName 192.168.0.1\n IdentityFile ~/.ssh/id_rsa\n User root\n Port 22522\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"Host router\n HostName 192.168.0.1\n IdentityFile ~/.ssh/id_rsa\n User root\n Port 22522"}]}]}]}]}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"config-aliases-for-ssh-hosts","depth":2,"text":"Config aliases for #SSH hosts"}]}},"_type":"markdown","_id":"content:Linux:SSH.md","_source":"content","_file":"Linux/SSH.md","_extension":"md"},{"_path":"/obsidian/self-hosted-obsidian-sync-with-couchdb","_dir":"obsidian","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Self Hosted Obsidian Sync With CouchDB","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vrtmrz/obsidian-livesync","rel":["nofollow"]},"children":[{"type":"text","value":"Main documentation"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vrtmrz/obsidian-livesync/blob/main/docs/setup_own_server.md","rel":["nofollow"]},"children":[{"type":"text","value":"Setting up couchdb"}]}]}]},{"type":"element","tag":"h2","props":{"id":"setting-up-environment"},"children":[{"type":"text","value":"Setting up environment"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"First, you should create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-compose.yml"}]},{"type":"text","value":" with the following contents:"}]},{"type":"element","tag":"code","props":{"code":"version: '3'\nservices:\n couchserver:\n container_name: obsidian__database\n image: couchdb\n restart: always\n ports:\n - \"5984:5984\"\n environment:\n - COUCHDB_USER=user\n - COUCHDB_PASSWORD=somepassword\n volumes:\n - ./couchdb/dbdata:/opt/couchdb/data\n - ./couchdb/local.ini:/opt/couchdb/etc/local.ini\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: '3'\nservices:\n couchserver:\n container_name: obsidian__database\n image: couchdb\n restart: always\n ports:\n - \"5984:5984\"\n environment:\n - COUCHDB_USER=user\n - COUCHDB_PASSWORD=somepassword\n volumes:\n - ./couchdb/dbdata:/opt/couchdb/data\n - ./couchdb/local.ini:/opt/couchdb/etc/local.ini\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then create initial config at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./couchdb/local.ini"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"[couchdb]\nsingle_node=true\nmax_document_size=50000000\nmax_http_request_size=4294967296\n\n[chttpd]\nrequire_valid_user = true\n\n[chttpd_auth]\nrequire_valid_user = true\nauthentication_redirect = /_utils/session.html\n\n[httpd]\nWWW-Authenticate = Basic realm=\"couchdb\"\nenable_cors = true\n\n[cors]\norigins = app://obsidian.md,capacitor://localhost,http://localhost\ncredentials = true\nheaders = accept, authorization, content-type, origin, referer\nmethods = GET, PUT, POST, HEAD, DELETE\nmax_age = 3600\n","language":"ini"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"[couchdb]\nsingle_node=true\nmax_document_size=50000000\nmax_http_request_size=4294967296\n\n[chttpd]\nrequire_valid_user = true\n\n[chttpd_auth]\nrequire_valid_user = true\nauthentication_redirect = /_utils/session.html\n\n[httpd]\nWWW-Authenticate = Basic realm=\"couchdb\"\nenable_cors = true\n\n[cors]\norigins = app://obsidian.md,capacitor://localhost,http://localhost\ncredentials = true\nheaders = accept, authorization, content-type, origin, referer\nmethods = GET, PUT, POST, HEAD, DELETE\nmax_age = 3600\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then, in order to have sync on mobile devices, we will need a reverse proxy with nginx at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/nginx/sites-enabled/obsidian-couchdb"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"server {\n listen 80;\n listen [::]:80;\n server_name couchdb.yourhost.com;\n return 301 https://$host$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n\n ssl_certificate /etc/letsencrypt/live/yourhost.com/fullchain.pem; # managed by Certbot\n ssl_certificate_key /etc/letsencrypt/live/yourhost.com/privkey.pem; # managed by Certbot\n ssl_trusted_certificate /etc/letsencrypt/live/yourhost.com/chain.pem;\n\n server_name couchdb.yourhost.com;\n client_max_body_size 200M;\n\n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n\n proxy_pass http://127.0.0.1:5984;\n }\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"server {\n listen 80;\n listen [::]:80;\n server_name couchdb.yourhost.com;\n return 301 https://$host$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n\n ssl_certificate /etc/letsencrypt/live/yourhost.com/fullchain.pem; # managed by Certbot\n ssl_certificate_key /etc/letsencrypt/live/yourhost.com/privkey.pem; # managed by Certbot\n ssl_trusted_certificate /etc/letsencrypt/live/yourhost.com/chain.pem;\n\n server_name couchdb.yourhost.com;\n client_max_body_size 200M;\n\n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n\n proxy_pass http://127.0.0.1:5984;\n }\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"setting-up-obsidian"},"children":[{"type":"text","value":"Setting up Obsidian"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Install "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Self-hosted LiveSync"}]},{"type":"text","value":" plugin"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Change host to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https://yourhost.com"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Specify username and password"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Press "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"test"}]},{"type":"text","value":", then "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fetch database"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vrtmrz/obsidian-livesync","rel":["nofollow"]},"children":[{"type":"text","value":"Main documentation"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vrtmrz/obsidian-livesync/blob/main/docs/setup_own_server.md","rel":["nofollow"]},"children":[{"type":"text","value":"Setting up couchdb"}]}]}]},{"type":"element","tag":"h2","props":{"id":"setting-up-environment"},"children":[{"type":"text","value":"Setting up environment"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"First, you should create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-compose.yml"}]},{"type":"text","value":" with the following contents:"}]},{"type":"element","tag":"code","props":{"code":"version: '3'\nservices:\n couchserver:\n container_name: obsidian__database\n image: couchdb\n restart: always\n ports:\n - \"5984:5984\"\n environment:\n - COUCHDB_USER=user\n - COUCHDB_PASSWORD=somepassword\n volumes:\n - ./couchdb/dbdata:/opt/couchdb/data\n - ./couchdb/local.ini:/opt/couchdb/etc/local.ini\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b338a"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-865540"},"children":[{"type":"text","value":"'3'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b338a"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9b338a"},"children":[{"type":"text","value":"couchserver"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9b338a"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-865540"},"children":[{"type":"text","value":"obsidian__database"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9b338a"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-865540"},"children":[{"type":"text","value":"couchdb"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9b338a"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-865540"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9b338a"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-865540"},"children":[{"type":"text","value":"\"5984:5984\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9b338a"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-865540"},"children":[{"type":"text","value":"COUCHDB_USER=user"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-865540"},"children":[{"type":"text","value":"COUCHDB_PASSWORD=somepassword"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9b338a"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-865540"},"children":[{"type":"text","value":"./couchdb/dbdata:/opt/couchdb/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-865540"},"children":[{"type":"text","value":"./couchdb/local.ini:/opt/couchdb/etc/local.ini"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then create initial config at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./couchdb/local.ini"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"[couchdb]\nsingle_node=true\nmax_document_size=50000000\nmax_http_request_size=4294967296\n\n[chttpd]\nrequire_valid_user = true\n\n[chttpd_auth]\nrequire_valid_user = true\nauthentication_redirect = /_utils/session.html\n\n[httpd]\nWWW-Authenticate = Basic realm=\"couchdb\"\nenable_cors = true\n\n[cors]\norigins = app://obsidian.md,capacitor://localhost,http://localhost\ncredentials = true\nheaders = accept, authorization, content-type, origin, referer\nmethods = GET, PUT, POST, HEAD, DELETE\nmax_age = 3600\n","language":"ini"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"[couchdb]\nsingle_node=true\nmax_document_size=50000000\nmax_http_request_size=4294967296\n\n[chttpd]\nrequire_valid_user = true\n\n[chttpd_auth]\nrequire_valid_user = true\nauthentication_redirect = /_utils/session.html\n\n[httpd]\nWWW-Authenticate = Basic realm=\"couchdb\"\nenable_cors = true\n\n[cors]\norigins = app://obsidian.md,capacitor://localhost,http://localhost\ncredentials = true\nheaders = accept, authorization, content-type, origin, referer\nmethods = GET, PUT, POST, HEAD, DELETE\nmax_age = 3600"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then, in order to have sync on mobile devices, we will need a reverse proxy with nginx at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/nginx/sites-enabled/obsidian-couchdb"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"server {\n listen 80;\n listen [::]:80;\n server_name couchdb.yourhost.com;\n return 301 https://$host$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n\n ssl_certificate /etc/letsencrypt/live/yourhost.com/fullchain.pem; # managed by Certbot\n ssl_certificate_key /etc/letsencrypt/live/yourhost.com/privkey.pem; # managed by Certbot\n ssl_trusted_certificate /etc/letsencrypt/live/yourhost.com/chain.pem;\n\n server_name couchdb.yourhost.com;\n client_max_body_size 200M;\n\n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n\n proxy_pass http://127.0.0.1:5984;\n }\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5ea5bb"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"80;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"[::]:80;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"couchdb.yourhost.com;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fac75e"},"children":[{"type":"text","value":"301"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" https://"}]},{"type":"element","tag":"span","props":{"class":"ct-a1f629"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7a53cc"},"children":[{"type":"text","value":"host"}]},{"type":"element","tag":"span","props":{"class":"ct-a1f629"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7a53cc"},"children":[{"type":"text","value":"request_uri"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5ea5bb"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"443 ssl http2;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"[::]:443 ssl http2;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" ssl_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"/etc/letsencrypt/live/yourhost.com/fullchain.pem; "}]},{"type":"element","tag":"span","props":{"class":"ct-126005"},"children":[{"type":"text","value":"# managed by Certbot"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" ssl_certificate_key "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"/etc/letsencrypt/live/yourhost.com/privkey.pem; "}]},{"type":"element","tag":"span","props":{"class":"ct-126005"},"children":[{"type":"text","value":"# managed by Certbot"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" ssl_trusted_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"/etc/letsencrypt/live/yourhost.com/chain.pem;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"couchdb.yourhost.com;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" client_max_body_size "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"200M;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-967ad5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-db94fc"},"children":[{"type":"text","value":"location"}]},{"type":"element","tag":"span","props":{"class":"ct-967ad5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6e93f6"},"children":[{"type":"text","value":"/ "}]},{"type":"element","tag":"span","props":{"class":"ct-967ad5"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" proxy_redirect "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"off;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"Host "}]},{"type":"element","tag":"span","props":{"class":"ct-a1f629"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7a53cc"},"children":[{"type":"text","value":"host"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"X-Real-IP "}]},{"type":"element","tag":"span","props":{"class":"ct-a1f629"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7a53cc"},"children":[{"type":"text","value":"remote_addr"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"X-Forwarded-For "}]},{"type":"element","tag":"span","props":{"class":"ct-a1f629"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7a53cc"},"children":[{"type":"text","value":"proxy_add_x_forwarded_for"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" proxy_pass "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"http://127.0.0.1:5984;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"setting-up-obsidian"},"children":[{"type":"text","value":"Setting up Obsidian"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Install "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Self-hosted LiveSync"}]},{"type":"text","value":" plugin"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Change host to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https://yourhost.com"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Specify username and password"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Press "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"test"}]},{"type":"text","value":", then "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fetch database"}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-6e93f6{color:#FFA657}.ct-db94fc{color:#FF7B72}.ct-967ad5{color:#C9D1D9}.ct-126005{color:#8B949E}.ct-7a53cc{color:#C9D1D9}.ct-a1f629{color:#C9D1D9}.ct-fac75e{color:#79C0FF}.ct-9798e6{color:#FF7B72}.ct-5ea5bb{color:#FF7B72}.ct-865540{color:#A5D6FF}.ct-507697{color:#C9D1D9}.ct-9b338a{color:#7EE787}.light .ct-9b338a{color:#268BD2}.light .ct-507697{color:#657B83}.light .ct-865540{color:#2AA198}.light .ct-5ea5bb{color:#073642}.light .ct-9798e6{color:#859900}.light .ct-fac75e{color:#D33682}.light .ct-a1f629{color:#859900}.light .ct-7a53cc{color:#268BD2}.light .ct-126005{color:#93A1A1}.light .ct-967ad5{color:#657B83}.light .ct-db94fc{color:#073642}.light .ct-6e93f6{color:#657B83}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"setting-up-environment","depth":2,"text":"Setting up environment"},{"id":"setting-up-obsidian","depth":2,"text":"Setting up Obsidian"}]}},"_type":"markdown","_id":"content:Obsidian:Self-hosted Obsidian sync with CouchDB.md","_source":"content","_file":"Obsidian/Self-hosted Obsidian sync with CouchDB.md","_extension":"md"},{"_path":"/sql/mysql-and-mariadb-setup","_dir":"sql","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"MySQL And MariaDB Setup","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"install-mariadb-on-ubuntu-2004-lts"},"children":[{"type":"text","value":"Install MariaDB on Ubuntu 20.04 LTS"}]},{"type":"element","tag":"code","props":{"code":"sudo apt update\nsudo apt install mariadb-server\nsudo mysql_secure_installation\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"sudo apt update\nsudo apt install mariadb-server\nsudo mysql_secure_installation\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"access-database-from-outside"},"children":[{"type":"text","value":"Access Database from outside"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Open "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/mysql/mariadb.conf.d/50-server.cnf"}]},{"type":"text","value":" and change the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"bind-address"}]},{"type":"text","value":" to:"}]},{"type":"element","tag":"code","props":{"code":"...\nbind-address = 0.0.0.0\n...\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"...\nbind-address = 0.0.0.0\n...\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"create-administrative-user"},"children":[{"type":"text","value":"Create Administrative User"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Create a new user "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"newuser"}]},{"type":"text","value":" for the host "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"localhost"}]},{"type":"text","value":" with a new "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"password"}]},{"type":"text","value":":"}]}]},{"type":"element","tag":"code","props":{"code":"CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password';\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password';\n"}]}]}]},{"type":"element","tag":"ol","props":{"start":2},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Grant all permissions to the new user"}]}]},{"type":"element","tag":"code","props":{"code":"GRANT ALL PRIVILEGES ON * . * TO 'newuser'@'localhost';\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"GRANT ALL PRIVILEGES ON * . * TO 'newuser'@'localhost';\n"}]}]}]},{"type":"element","tag":"ol","props":{"start":3},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Update permissions"}]}]},{"type":"element","tag":"code","props":{"code":"FLUSH PRIVILEGES;\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"FLUSH PRIVILEGES;\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"install-mariadb-on-ubuntu-2004-lts"},"children":[{"type":"text","value":"Install MariaDB on Ubuntu 20.04 LTS"}]},{"type":"element","tag":"code","props":{"code":"sudo apt update\nsudo apt install mariadb-server\nsudo mysql_secure_installation\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cf1a8e"},"children":[{"type":"text","value":"sudo apt update"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cf1a8e"},"children":[{"type":"text","value":"sudo apt install mariadb-server"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cf1a8e"},"children":[{"type":"text","value":"sudo mysql_secure_installation"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"access-database-from-outside"},"children":[{"type":"text","value":"Access Database from outside"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Open "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/mysql/mariadb.conf.d/50-server.cnf"}]},{"type":"text","value":" and change the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"bind-address"}]},{"type":"text","value":" to:"}]},{"type":"element","tag":"code","props":{"code":"...\nbind-address = 0.0.0.0\n...\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cf1a8e"},"children":[{"type":"text","value":"..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cf1a8e"},"children":[{"type":"text","value":"bind-"}]},{"type":"element","tag":"span","props":{"class":"ct-a46354"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-cf1a8e"},"children":[{"type":"text","value":" = 0.0.0.0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cf1a8e"},"children":[{"type":"text","value":"..."}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"create-administrative-user"},"children":[{"type":"text","value":"Create Administrative User"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Create a new user "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"newuser"}]},{"type":"text","value":" for the host "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"localhost"}]},{"type":"text","value":" with a new "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"password"}]},{"type":"text","value":":"}]}]},{"type":"element","tag":"code","props":{"code":"CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password';\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password';"}]}]}]}]}]},{"type":"element","tag":"ol","props":{"start":2},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Grant all permissions to the new user"}]}]},{"type":"element","tag":"code","props":{"code":"GRANT ALL PRIVILEGES ON * . * TO 'newuser'@'localhost';\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"GRANT ALL PRIVILEGES ON * . * TO 'newuser'@'localhost';"}]}]}]}]}]},{"type":"element","tag":"ol","props":{"start":3},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Update permissions"}]}]},{"type":"element","tag":"code","props":{"code":"FLUSH PRIVILEGES;\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"FLUSH PRIVILEGES;"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-a46354{color:#FF7B72}.ct-cf1a8e{color:#C9D1D9}.light .ct-cf1a8e{color:#657B83}.light .ct-a46354{color:#859900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"install-mariadb-on-ubuntu-2004-lts","depth":2,"text":"Install MariaDB on Ubuntu 20.04 LTS"},{"id":"access-database-from-outside","depth":2,"text":"Access Database from outside"},{"id":"create-administrative-user","depth":2,"text":"Create Administrative User"}]}},"_type":"markdown","_id":"content:SQL:MySQL and MariaDB setup.md","_source":"content","_file":"SQL/MySQL and MariaDB setup.md","_extension":"md"},{"_path":"/sql/postgress-setup","_dir":"sql","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Postgress Setup","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"install-postgresql-12-on-ubuntu-2004-lts"},"children":[{"type":"text","value":"Install PostgreSQL 12 on Ubuntu 20.04 LTS"}]},{"type":"element","tag":"code","props":{"code":"sudo apt update\nsudo apt install -y postgresql postgresql-contrib postgresql-client\nsudo systemctl status postgresql.service\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"sudo apt update\nsudo apt install -y postgresql postgresql-contrib postgresql-client\nsudo systemctl status postgresql.service\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"initial-database-connection"},"children":[{"type":"text","value":"Initial database connection"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A local connection (from the database server) can be done by the following command:"}]},{"type":"element","tag":"code","props":{"code":"sudo -u postgres psql\n\npsql (12.12 (Ubuntu 12.12-0ubuntu0.20.04.1))\nType \"help\" for help.\n\npostgres=#\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"sudo -u postgres psql\n\npsql (12.12 (Ubuntu 12.12-0ubuntu0.20.04.1))\nType \"help\" for help.\n\npostgres=#\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"set-password-for-postgres-database-user"},"children":[{"type":"text","value":"Set password for postgres database user"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The password for the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" database user can be set the the quick command "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"\\password"}]},{"type":"text","value":"\nor by "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"alter user postgres password 'Supersecret'"}]},{"type":"text","value":". A connection using the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" user\nis still not possible from the \"outside\" hence to the default settings in the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"pg_hba.conf"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h3","props":{"id":"update-pg_hbaconf-to-allow-postgres-user-connections-with-password"},"children":[{"type":"text","value":"Update pg_hba.conf to allow postgres user connections with password"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"In order to allow connections of the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" database user not using OS user\nauthentication, you have to update the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"pg_hba.conf"}]},{"type":"text","value":" which can be found under\n"},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/postgresql/12/main/pg_hba.conf"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"sudo vi /etc/postgresql/12/main/pg_hba.conf\n\n...\nlocal all postgres peer\n...\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"sudo vi /etc/postgresql/12/main/pg_hba.conf\n\n...\nlocal all postgres peer\n...\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change the last section of the above line to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"md5"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"local all postgres md5\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"local all postgres md5\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A restart is required in order to apply the new configuration:"}]},{"type":"element","tag":"code","props":{"code":"sudo systemctl restart postgresql\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"sudo systemctl restart postgresql\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Now a connection from outside the database host is possible e.g."}]},{"type":"element","tag":"code","props":{"code":"psql -U postgres -d postgres -h databasehostname\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"psql -U postgres -d postgres -h databasehostname\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"creation-of-additional-database-users"},"children":[{"type":"text","value":"Creation of additional database users"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A database user can be created by the following command:"}]},{"type":"element","tag":"code","props":{"code":"create user myuser with encrypted password 'Supersecret';\nCREATE ROLE\n\npostgres=# \\du\n List of roles\n Role name | Attributes | Member of\n-----------+------------------------------------------------------------+-----------\n myuser | | {}\n postgres | Superuser, Create role, Create DB, Replication, Bypass RLS | {}\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"create user myuser with encrypted password 'Supersecret';\nCREATE ROLE\n\npostgres=# \\du\n List of roles\n Role name | Attributes | Member of\n-----------+------------------------------------------------------------+-----------\n myuser | | {}\n postgres | Superuser, Create role, Create DB, Replication, Bypass RLS | {}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"creation-of-additional-databases"},"children":[{"type":"text","value":"Creation of additional databases"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"One can create new Postgres databases within an instance. Therefore you can use the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"psql"}]},{"type":"text","value":"\ncommand to login (see above)."}]},{"type":"element","tag":"code","props":{"code":"CREATE DATABASE dbname OWNER myuser;\nCREATE DATABASE\n\npostgres=# \\l\n List of databases\n Name | Owner | Encoding | Collate | Ctype | Access privileges\n-----------+----------+----------+-------------+-------------+-----------------------\n dbname | myuser | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n postgres | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n template0 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n template1 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"CREATE DATABASE dbname OWNER myuser;\nCREATE DATABASE\n\npostgres=# \\l\n List of databases\n Name | Owner | Encoding | Collate | Ctype | Access privileges\n-----------+----------+----------+-------------+-------------+-----------------------\n dbname | myuser | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n postgres | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n template0 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n template1 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You can leave the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"OWNER"}]},{"type":"text","value":" section of the command, when doing so, the current user will become\nowner of the newly created database."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To change the owner of an existing database later, you can use the following command:"}]},{"type":"element","tag":"code","props":{"code":"postgres=# alter database dbname owner to myuser;\nALTER DATABASE\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"postgres=# alter database dbname owner to myuser;\nALTER DATABASE\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"install-postgresql-12-on-ubuntu-2004-lts"},"children":[{"type":"text","value":"Install PostgreSQL 12 on Ubuntu 20.04 LTS"}]},{"type":"element","tag":"code","props":{"code":"sudo apt update\nsudo apt install -y postgresql postgresql-contrib postgresql-client\nsudo systemctl status postgresql.service\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"sudo apt update"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"sudo apt install -y postgresql postgresql-contrib postgresql-client"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"sudo systemctl status postgresql.service"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"initial-database-connection"},"children":[{"type":"text","value":"Initial database connection"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A local connection (from the database server) can be done by the following command:"}]},{"type":"element","tag":"code","props":{"code":"sudo -u postgres psql\n\npsql (12.12 (Ubuntu 12.12-0ubuntu0.20.04.1))\nType \"help\" for help.\n\npostgres=#\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"sudo -u postgres psql"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"psql (12.12 (Ubuntu 12.12-0ubuntu0.20.04.1))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"Type "}]},{"type":"element","tag":"span","props":{"class":"ct-807f38"},"children":[{"type":"text","value":"\"help\""}]},{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3a57b7"},"children":[{"type":"text","value":"for"}]},{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":" help."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"postgres="}]},{"type":"element","tag":"span","props":{"class":"ct-ba601c"},"children":[{"type":"text","value":"#"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"set-password-for-postgres-database-user"},"children":[{"type":"text","value":"Set password for postgres database user"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The password for the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" database user can be set the the quick command "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"\\password"}]},{"type":"text","value":"\nor by "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"alter user postgres password 'Supersecret'"}]},{"type":"text","value":". A connection using the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" user\nis still not possible from the \"outside\" hence to the default settings in the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"pg_hba.conf"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h3","props":{"id":"update-pg_hbaconf-to-allow-postgres-user-connections-with-password"},"children":[{"type":"text","value":"Update pg_hba.conf to allow postgres user connections with password"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"In order to allow connections of the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" database user not using OS user\nauthentication, you have to update the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"pg_hba.conf"}]},{"type":"text","value":" which can be found under\n"},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/postgresql/12/main/pg_hba.conf"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"sudo vi /etc/postgresql/12/main/pg_hba.conf\n\n...\nlocal all postgres peer\n...\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"sudo vi /etc/postgresql/12/main/pg_hba.conf"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3ccee5"},"children":[{"type":"text","value":"local"}]},{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":" all postgres peer"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"..."}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change the last section of the above line to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"md5"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"local all postgres md5\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"local all postgres md5"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A restart is required in order to apply the new configuration:"}]},{"type":"element","tag":"code","props":{"code":"sudo systemctl restart postgresql\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"sudo systemctl restart postgresql"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Now a connection from outside the database host is possible e.g."}]},{"type":"element","tag":"code","props":{"code":"psql -U postgres -d postgres -h databasehostname\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"psql -U postgres -d postgres -h databasehostname"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"creation-of-additional-database-users"},"children":[{"type":"text","value":"Creation of additional database users"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A database user can be created by the following command:"}]},{"type":"element","tag":"code","props":{"code":"create user myuser with encrypted password 'Supersecret';\nCREATE ROLE\n\npostgres=# \\du\n List of roles\n Role name | Attributes | Member of\n-----------+------------------------------------------------------------+-----------\n myuser | | {}\n postgres | Superuser, Create role, Create DB, Replication, Bypass RLS | {}\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"create user myuser with encrypted password 'Supersecret';\nCREATE ROLE\n\npostgres=# \\du\n List of roles\n Role name | Attributes | Member of\n-----------+------------------------------------------------------------+-----------\n myuser | | {}\n postgres | Superuser, Create role, Create DB, Replication, Bypass RLS | {}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"creation-of-additional-databases"},"children":[{"type":"text","value":"Creation of additional databases"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"One can create new Postgres databases within an instance. Therefore you can use the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"psql"}]},{"type":"text","value":"\ncommand to login (see above)."}]},{"type":"element","tag":"code","props":{"code":"CREATE DATABASE dbname OWNER myuser;\nCREATE DATABASE\n\npostgres=# \\l\n List of databases\n Name | Owner | Encoding | Collate | Ctype | Access privileges\n-----------+----------+----------+-------------+-------------+-----------------------\n dbname | myuser | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n postgres | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n template0 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n template1 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"CREATE DATABASE dbname OWNER myuser;\nCREATE DATABASE\n\npostgres=# \\l\n List of databases\n Name | Owner | Encoding | Collate | Ctype | Access privileges\n-----------+----------+----------+-------------+-------------+-----------------------\n dbname | myuser | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n postgres | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n template0 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n template1 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You can leave the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"OWNER"}]},{"type":"text","value":" section of the command, when doing so, the current user will become\nowner of the newly created database."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To change the owner of an existing database later, you can use the following command:"}]},{"type":"element","tag":"code","props":{"code":"postgres=# alter database dbname owner to myuser;\nALTER DATABASE\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"postgres=# alter database dbname owner to myuser;\nALTER DATABASE"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-3ccee5{color:#FF7B72}.ct-ba601c{color:#8B949E}.ct-3a57b7{color:#FF7B72}.ct-807f38{color:#A5D6FF}.ct-662fdc{color:#C9D1D9}.light .ct-662fdc{color:#657B83}.light .ct-807f38{color:#2AA198}.light .ct-3a57b7{color:#859900}.light .ct-ba601c{color:#93A1A1}.light .ct-3ccee5{color:#073642}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"install-postgresql-12-on-ubuntu-2004-lts","depth":2,"text":"Install PostgreSQL 12 on Ubuntu 20.04 LTS"},{"id":"initial-database-connection","depth":2,"text":"Initial database connection"},{"id":"set-password-for-postgres-database-user","depth":2,"text":"Set password for postgres database user","children":[{"id":"update-pg_hbaconf-to-allow-postgres-user-connections-with-password","depth":3,"text":"Update pg_hba.conf to allow postgres user connections with password"}]},{"id":"creation-of-additional-database-users","depth":2,"text":"Creation of additional database users"},{"id":"creation-of-additional-databases","depth":2,"text":"Creation of additional databases"}]}},"_type":"markdown","_id":"content:SQL:Postgress setup.md","_source":"content","_file":"SQL/Postgress setup.md","_extension":"md"},{"_path":"/typescript/add-global-variable-to-window","_dir":"typescript","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Add Global Variable To Window","description":"Sometimes you want to add global variable to your window. That thing's called global module augmentation.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you want to add global variable to your "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window"}]},{"type":"text","value":". That thing's called "},{"type":"element","tag":"a","props":{"href":"https://www.typescriptlang.org/docs/handbook/declaration-merging.html#global-augmentation","rel":["nofollow"]},"children":[{"type":"text","value":"global module augmentation"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say you need to call "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.doFancyThings()"}]},{"type":"text","value":". For that you should augment global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window"}]},{"type":"text","value":" interface in "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"*.d.ts"}]},{"type":"text","value":" file:"}]},{"type":"element","tag":"code","props":{"code":"declare global {\n interface Window {\n doFancyThings: () => void;\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"declare global {\n interface Window {\n doFancyThings: () => void;\n }\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is useful for declaring global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.ethereum"}]},{"type":"text","value":" (or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.web3"}]},{"type":"text","value":") in "},{"type":"element","tag":"a","props":{"href":"/blockchain/Common%20typescript%20examples"},"children":[{"type":"text","value":"blockchain"}]},{"type":"text","value":" projects with typescript, which use wallet browser extensions."}]},{"type":"element","tag":"h2","props":{"id":"augmenting-existing-interface"},"children":[{"type":"text","value":"Augmenting existing interface"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For example, you have class "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Sample"}]},{"type":"text","value":" without any functionality:"}]},{"type":"element","tag":"code","props":{"code":"// Sample.ts\n\nexport class Sample {\n // nothing :-)\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// Sample.ts\n\nexport class Sample {\n // nothing :-)\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then you want extend it with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"doFancyThings()"}]},{"type":"text","value":" method. That can be achieved with said "},{"type":"element","tag":"a","props":{"href":"https://www.typescriptlang.org/docs/handbook/declaration-merging.html#module-augmentation","rel":["nofollow"]},"children":[{"type":"text","value":"module augmentation"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"// fancyThings.ts\nimport { Sample } from \"./Sample\";\n\ndeclare module \"./Sample\" {\n interface Sample {\n doFancyThings: () => void;\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// fancyThings.ts\nimport { Sample } from \"./Sample\";\n\ndeclare module \"./Sample\" {\n interface Sample {\n doFancyThings: () => void;\n }\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Now you can call "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"sample.doFancyThings()"}]},{"type":"text","value":" by importing both "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".ts"}]},{"type":"text","value":" files:"}]},{"type":"element","tag":"code","props":{"code":"import { Sample } from \"./sample\";\nimport \"./fancyThings\";\n\nconst sample = new Sample();\nsample.doFancyThings(); // ok\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { Sample } from \"./sample\";\nimport \"./fancyThings\";\n\nconst sample = new Sample();\nsample.doFancyThings(); // ok\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This example is useful for "},{"type":"element","tag":"a","props":{"href":"./Frontend/Vue/Adding%20global%20properties%20to%20component"},"children":[{"type":"text","value":"adding global properties to component"}]},{"type":"text","value":" in vue.js."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you want to add global variable to your "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window"}]},{"type":"text","value":". That thing's called "},{"type":"element","tag":"a","props":{"href":"https://www.typescriptlang.org/docs/handbook/declaration-merging.html#global-augmentation","rel":["nofollow"]},"children":[{"type":"text","value":"global module augmentation"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say you need to call "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.doFancyThings()"}]},{"type":"text","value":". For that you should augment global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window"}]},{"type":"text","value":" interface in "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"*.d.ts"}]},{"type":"text","value":" file:"}]},{"type":"element","tag":"code","props":{"code":"declare global {\n interface Window {\n doFancyThings: () => void;\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-42c3a1"},"children":[{"type":"text","value":"declare"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fc5904"},"children":[{"type":"text","value":"global"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c3a1"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-909727"},"children":[{"type":"text","value":"Window"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c31fd1"},"children":[{"type":"text","value":"doFancyThings"}]},{"type":"element","tag":"span","props":{"class":"ct-861939"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-42c3a1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b4cda"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is useful for declaring global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.ethereum"}]},{"type":"text","value":" (or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.web3"}]},{"type":"text","value":") in "},{"type":"element","tag":"a","props":{"href":"/blockchain/Common%20typescript%20examples"},"children":[{"type":"text","value":"blockchain"}]},{"type":"text","value":" projects with typescript, which use wallet browser extensions."}]},{"type":"element","tag":"h2","props":{"id":"augmenting-existing-interface"},"children":[{"type":"text","value":"Augmenting existing interface"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For example, you have class "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Sample"}]},{"type":"text","value":" without any functionality:"}]},{"type":"element","tag":"code","props":{"code":"// Sample.ts\n\nexport class Sample {\n // nothing :-)\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-144069"},"children":[{"type":"text","value":"// Sample.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-861939"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c3a1"},"children":[{"type":"text","value":"class"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-909727"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-144069"},"children":[{"type":"text","value":"// nothing :-)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then you want extend it with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"doFancyThings()"}]},{"type":"text","value":" method. That can be achieved with said "},{"type":"element","tag":"a","props":{"href":"https://www.typescriptlang.org/docs/handbook/declaration-merging.html#module-augmentation","rel":["nofollow"]},"children":[{"type":"text","value":"module augmentation"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"// fancyThings.ts\nimport { Sample } from \"./Sample\";\n\ndeclare module \"./Sample\" {\n interface Sample {\n doFancyThings: () => void;\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-144069"},"children":[{"type":"text","value":"// fancyThings.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-861939"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-fc5904"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-861939"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-145926"},"children":[{"type":"text","value":"\"./Sample\""}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-42c3a1"},"children":[{"type":"text","value":"declare"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c3a1"},"children":[{"type":"text","value":"module"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-145926"},"children":[{"type":"text","value":"\"./Sample\""}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c3a1"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-909727"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c31fd1"},"children":[{"type":"text","value":"doFancyThings"}]},{"type":"element","tag":"span","props":{"class":"ct-861939"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-42c3a1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b4cda"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Now you can call "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"sample.doFancyThings()"}]},{"type":"text","value":" by importing both "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".ts"}]},{"type":"text","value":" files:"}]},{"type":"element","tag":"code","props":{"code":"import { Sample } from \"./sample\";\nimport \"./fancyThings\";\n\nconst sample = new Sample();\nsample.doFancyThings(); // ok\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-861939"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-fc5904"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-861939"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-145926"},"children":[{"type":"text","value":"\"./sample\""}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-861939"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-145926"},"children":[{"type":"text","value":"\"./fancyThings\""}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-42c3a1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7aa6b6"},"children":[{"type":"text","value":"sample"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-861939"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-861939"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c31fd1"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc5904"},"children":[{"type":"text","value":"sample"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c31fd1"},"children":[{"type":"text","value":"doFancyThings"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":"(); "}]},{"type":"element","tag":"span","props":{"class":"ct-144069"},"children":[{"type":"text","value":"// ok"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This example is useful for "},{"type":"element","tag":"a","props":{"href":"./Frontend/Vue/Adding%20global%20properties%20to%20component"},"children":[{"type":"text","value":"adding global properties to component"}]},{"type":"text","value":" in vue.js."}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-7aa6b6{color:#79C0FF}.ct-145926{color:#A5D6FF}.ct-144069{color:#8B949E}.ct-6b4cda{color:#79C0FF}.ct-861939{color:#FF7B72}.ct-c31fd1{color:#D2A8FF}.ct-909727{color:#FFA657}.ct-fc5904{color:#C9D1D9}.ct-e36519{color:#C9D1D9}.ct-42c3a1{color:#FF7B72}.light .ct-42c3a1{color:#073642}.light .ct-e36519{color:#657B83}.light .ct-fc5904{color:#268BD2}.light .ct-909727{color:#268BD2}.light .ct-c31fd1{color:#268BD2}.light .ct-861939{color:#859900}.light .ct-6b4cda{color:#859900}.light .ct-144069{color:#93A1A1}.light .ct-145926{color:#2AA198}.light .ct-7aa6b6{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"augmenting-existing-interface","depth":2,"text":"Augmenting existing interface"}]}},"_type":"markdown","_id":"content:Typescript:Add global variable to window.md","_source":"content","_file":"Typescript/Add global variable to window.md","_extension":"md"},{"_path":"/typescript/flatten-object-with-periods","_dir":"typescript","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Flatten Object With Periods","description":"This helper generates Typescript types for i18n dictionary json\nfiles by flattening it with period delimiter. Supports plural forms.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This helper generates Typescript types for i18n dictionary json\nfiles by flattening it with period delimiter. Supports plural forms."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Used for typing "},{"type":"element","tag":"a","props":{"href":"https://www.npmjs.com/package/i18n-js","rel":["nofollow"]},"children":[{"type":"text","value":"i18n.js"}]},{"type":"text","value":" dictionaries;"}]},{"type":"element","tag":"code","props":{"code":"import en from './en.json';\ntype TranslationPath = Flatten;\n\nconst t = (key: TranslationPath, options?: TranslateOptions) =>\n I18nLib.t(key, options);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import en from './en.json';\ntype TranslationPath = Flatten;\n\nconst t = (key: TranslationPath, options?: TranslateOptions) =>\n I18nLib.t(key, options);\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Flatten type defined here:"}]},{"type":"element","tag":"code","props":{"code":"// This one based on answer from StackOverflow:\n// https://stackoverflow.com/questions/58434389/typescript-deep-keyof-of-a-nested-object\n\nexport type Flatten = [D] extends [never]\n ? never\n : T extends PluralForm // plural object\n ? ''\n : T extends object\n ? { [K in keyof T]-?: Join> }[keyof T]\n : '';\n\n// Fix it for you plural form\ntype PluralForm = Record<'one' | 'few' | 'many', string>;\n\ntype Join = K extends string | number\n ? P extends string | number\n ? `${K}${'' extends P ? '' : '.'}${P}`\n : never\n : never;\n\ntype Prev = [never, 0, 1, 2, 3, 4, 5, ...Array<0>];\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// This one based on answer from StackOverflow:\n// https://stackoverflow.com/questions/58434389/typescript-deep-keyof-of-a-nested-object\n\nexport type Flatten = [D] extends [never]\n ? never\n : T extends PluralForm // plural object\n ? ''\n : T extends object\n ? { [K in keyof T]-?: Join> }[keyof T]\n : '';\n\n// Fix it for you plural form\ntype PluralForm = Record<'one' | 'few' | 'many', string>;\n\ntype Join = K extends string | number\n ? P extends string | number\n ? `${K}${'' extends P ? '' : '.'}${P}`\n : never\n : never;\n\ntype Prev = [never, 0, 1, 2, 3, 4, 5, ...Array<0>];\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This helper generates Typescript types for i18n dictionary json\nfiles by flattening it with period delimiter. Supports plural forms."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Used for typing "},{"type":"element","tag":"a","props":{"href":"https://www.npmjs.com/package/i18n-js","rel":["nofollow"]},"children":[{"type":"text","value":"i18n.js"}]},{"type":"text","value":" dictionaries;"}]},{"type":"element","tag":"code","props":{"code":"import en from './en.json';\ntype TranslationPath = Flatten;\n\nconst t = (key: TranslationPath, options?: TranslateOptions) =>\n I18nLib.t(key, options);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2e7a7"},"children":[{"type":"text","value":"en"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-59d1cb"},"children":[{"type":"text","value":"'./en.json'"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"TranslationPath"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"Flatten"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"typeof"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2e7a7"},"children":[{"type":"text","value":"en"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":">;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3ba106"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5ae709"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8d3565"},"children":[{"type":"text","value":"t"}]},{"type":"element","tag":"span","props":{"class":"ct-5ae709"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1cdaff"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5ae709"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-c09440"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-1cdaff"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5ae709"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6436bb"},"children":[{"type":"text","value":"TranslationPath"}]},{"type":"element","tag":"span","props":{"class":"ct-5ae709"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c09440"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-1cdaff"},"children":[{"type":"text","value":"?:"}]},{"type":"element","tag":"span","props":{"class":"ct-5ae709"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6436bb"},"children":[{"type":"text","value":"TranslateOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-5ae709"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-3ba106"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2e7a7"},"children":[{"type":"text","value":"I18nLib"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b292a0"},"children":[{"type":"text","value":"t"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c2e7a7"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c2e7a7"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Flatten type defined here:"}]},{"type":"element","tag":"code","props":{"code":"// This one based on answer from StackOverflow:\n// https://stackoverflow.com/questions/58434389/typescript-deep-keyof-of-a-nested-object\n\nexport type Flatten = [D] extends [never]\n ? never\n : T extends PluralForm // plural object\n ? ''\n : T extends object\n ? { [K in keyof T]-?: Join> }[keyof T]\n : '';\n\n// Fix it for you plural form\ntype PluralForm = Record<'one' | 'few' | 'many', string>;\n\ntype Join = K extends string | number\n ? P extends string | number\n ? `${K}${'' extends P ? '' : '.'}${P}`\n : never\n : never;\n\ntype Prev = [never, 0, 1, 2, 3, 4, 5, ...Array<0>];\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-76590f"},"children":[{"type":"text","value":"// This one based on answer from StackOverflow:"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-76590f"},"children":[{"type":"text","value":"// https://stackoverflow.com/questions/58434389/typescript-deep-keyof-of-a-nested-object"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"Flatten"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"D"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-028e32"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"D"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"] "}]},{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"never"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"never"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"PluralForm"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-76590f"},"children":[{"type":"text","value":"// plural object"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-59d1cb"},"children":[{"type":"text","value":"''"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"object"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" { ["}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"in"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"keyof"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"]"}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"-?:"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"Join"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"Flatten"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"], "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"Prev"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"D"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"]>> }["}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"keyof"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-59d1cb"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-76590f"},"children":[{"type":"text","value":"// Fix it for you plural form"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"PluralForm"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"Record"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-59d1cb"},"children":[{"type":"text","value":"'one'"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-59d1cb"},"children":[{"type":"text","value":"'few'"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-59d1cb"},"children":[{"type":"text","value":"'many'"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":">;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"Join"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"number"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"number"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-59d1cb"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-59d1cb"},"children":[{"type":"text","value":"}${''"}]},{"type":"element","tag":"span","props":{"class":"ct-19a7d8"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-19a7d8"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-19a7d8"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-19a7d8"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-59d1cb"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-19a7d8"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-19a7d8"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-59d1cb"},"children":[{"type":"text","value":"'.'}${"}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-59d1cb"},"children":[{"type":"text","value":"}`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"never"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"never"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"Prev"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"never"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-028e32"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-028e32"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-028e32"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-028e32"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-028e32"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-028e32"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"Array"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-028e32"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":">];"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-19a7d8{color:#A5D6FF}.ct-028e32{color:#79C0FF}.ct-6d81df{color:#79C0FF}.ct-76590f{color:#8B949E}.ct-b292a0{color:#D2A8FF}.ct-6436bb{color:#FFA657}.ct-c09440{color:#FFA657}.ct-1cdaff{color:#FF7B72}.ct-8d3565{color:#D2A8FF}.ct-5ae709{color:#C9D1D9}.ct-3ba106{color:#FF7B72}.ct-635bfc{color:#FFA657}.ct-0fd30f{color:#FF7B72}.ct-59d1cb{color:#A5D6FF}.ct-c2e7a7{color:#C9D1D9}.ct-347f56{color:#C9D1D9}.ct-64ac72{color:#FF7B72}.light .ct-64ac72{color:#859900}.light .ct-347f56{color:#657B83}.light .ct-c2e7a7{color:#268BD2}.light .ct-59d1cb{color:#2AA198}.light .ct-0fd30f{color:#073642}.light .ct-635bfc{color:#268BD2}.light .ct-3ba106{color:#073642}.light .ct-5ae709{color:#657B83}.light .ct-8d3565{color:#268BD2}.light .ct-1cdaff{color:#859900}.light .ct-c09440{color:#657B83}.light .ct-6436bb{color:#268BD2}.light .ct-b292a0{color:#268BD2}.light .ct-76590f{color:#93A1A1}.light .ct-6d81df{color:#859900}.light .ct-028e32{color:#D33682}.light .ct-19a7d8{color:#657B83}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Typescript:Flatten object with periods.md","_source":"content","_file":"Typescript/Flatten object with periods.md","_extension":"md"},{"_path":"/typescript/type-guards","_dir":"typescript","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Type Guards","description":"Useful for type checking at compile and run time:","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful for type checking at compile and run time:"}]},{"type":"element","tag":"code","props":{"code":"function isFish(pet: Fish | Bird): pet is Fish {\n return (pet as Fish).swim !== undefined;\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"function isFish(pet: Fish | Bird): pet is Fish {\n return (pet as Fish).swim !== undefined;\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Usage:"}]},{"type":"element","tag":"code","props":{"code":"const pet = getSmallPet();\n \nif (isFish(pet)) {\n pet.swim();\n} else {\n pet.fly();\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const pet = getSmallPet();\n \nif (isFish(pet)) {\n pet.swim();\n} else {\n pet.fly();\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful for type checking at compile and run time:"}]},{"type":"element","tag":"code","props":{"code":"function isFish(pet: Fish | Bird): pet is Fish {\n return (pet as Fish).swim !== undefined;\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-71cb22"},"children":[{"type":"text","value":"function"}]},{"type":"element","tag":"span","props":{"class":"ct-d53be9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f7117e"},"children":[{"type":"text","value":"isFish"}]},{"type":"element","tag":"span","props":{"class":"ct-d53be9"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-193554"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-1b4c73"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-d53be9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ec387d"},"children":[{"type":"text","value":"Fish"}]},{"type":"element","tag":"span","props":{"class":"ct-d53be9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1b4c73"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-d53be9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ec387d"},"children":[{"type":"text","value":"Bird"}]},{"type":"element","tag":"span","props":{"class":"ct-d53be9"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-1b4c73"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-d53be9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-193554"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-d53be9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1b4c73"},"children":[{"type":"text","value":"is"}]},{"type":"element","tag":"span","props":{"class":"ct-d53be9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ec387d"},"children":[{"type":"text","value":"Fish"}]},{"type":"element","tag":"span","props":{"class":"ct-d53be9"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2ee476"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-c6422e"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2ee476"},"children":[{"type":"text","value":"as"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c38f96"},"children":[{"type":"text","value":"Fish"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-c6422e"},"children":[{"type":"text","value":"swim"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2ee476"},"children":[{"type":"text","value":"!=="}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bdc00b"},"children":[{"type":"text","value":"undefined"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Usage:"}]},{"type":"element","tag":"code","props":{"code":"const pet = getSmallPet();\n \nif (isFish(pet)) {\n pet.swim();\n} else {\n pet.fly();\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-94eca3"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-825d9d"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2ee476"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-168a18"},"children":[{"type":"text","value":"getSmallPet"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2ee476"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-168a18"},"children":[{"type":"text","value":"isFish"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c6422e"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6422e"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-168a18"},"children":[{"type":"text","value":"swim"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":"} "}]},{"type":"element","tag":"span","props":{"class":"ct-2ee476"},"children":[{"type":"text","value":"else"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6422e"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-168a18"},"children":[{"type":"text","value":"fly"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-168a18{color:#D2A8FF}.ct-825d9d{color:#79C0FF}.ct-94eca3{color:#FF7B72}.ct-bdc00b{color:#79C0FF}.ct-c38f96{color:#FFA657}.ct-c6422e{color:#C9D1D9}.ct-2ee476{color:#FF7B72}.ct-b77be2{color:#C9D1D9}.ct-ec387d{color:#FFA657}.ct-1b4c73{color:#FF7B72}.ct-193554{color:#FFA657}.ct-f7117e{color:#D2A8FF}.ct-d53be9{color:#C9D1D9}.ct-71cb22{color:#FF7B72}.light .ct-71cb22{color:#073642}.light .ct-d53be9{color:#657B83}.light .ct-f7117e{color:#268BD2}.light .ct-193554{color:#657B83}.light .ct-1b4c73{color:#859900}.light .ct-ec387d{color:#268BD2}.light .ct-b77be2{color:#657B83}.light .ct-2ee476{color:#859900}.light .ct-c6422e{color:#268BD2}.light .ct-c38f96{color:#268BD2}.light .ct-bdc00b{color:#B58900}.light .ct-94eca3{color:#073642}.light .ct-825d9d{color:#268BD2}.light .ct-168a18{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Typescript:Type guards.md","_source":"content","_file":"Typescript/Type guards.md","_extension":"md"}],"navigation":[{"title":"Blockchain","_path":"/blockchain","children":[{"title":"Common Typescript Examples","_path":"/blockchain/common-typescript-examples"},{"title":"Smart Contracts","_path":"/blockchain/smart-contracts"}]},{"title":"Css","_path":"/css","children":[{"title":"Automatic Grid Like Masonry With Pure CSS","_path":"/css/automatic-grid-like-masonry-with-pure-css"},{"title":"Sass Nth Child Iterate Mixin","_path":"/css/sass-nth-child-iterate-mixin"},{"title":"Test If Browser Supports CSS Rules","_path":"/css/test-if-browser-supports-css-rules"}]},{"title":"Docker","_path":"/docker","children":[{"title":"Building Static Pages With Docker","_path":"/docker/building-static-pages-with-docker"},{"title":"Common Things With Docker Mailserver","_path":"/docker/common-things-with-docker-mailserver"},{"title":"Drone Ci","_path":"/docker/drone-ci"},{"title":"Github Pages With Drone Ci","_path":"/docker/github-pages-with-drone-ci"},{"title":"Private Docker Registry","_path":"/docker/private-docker-registry"},{"title":"Refresh Containers On Pull","_path":"/docker/refresh-containers-on-pull"},{"title":"Seed Dump Inside Docker","_path":"/docker/seed-dump-inside-docker"},{"title":"Wait For Mysql","_path":"/docker/wait-for-mysql"},{"title":"Wait For Redis","_path":"/docker/wait-for-redis"}]},{"title":"Frontend","_path":"/frontend","children":[{"title":"React Native","_path":"/frontend/react-native","children":[{"title":"OAuth2 Login","_path":"/frontend/react-native/oauth2-login"},{"title":"Preserve FlatList Scroll Position In React Native","_path":"/frontend/react-native/preserve-flatlist-scroll-position-in-react-native"},{"title":"Useful Comands","_path":"/frontend/react-native/useful-comands"}]},{"title":"React","_path":"/frontend/react","children":[{"title":"Axios Refresh Token On React","_path":"/frontend/react/axios-refresh-token-on-react"},{"title":"Axios With AbortController","_path":"/frontend/react/axios-with-abortcontroller"},{"title":"Detect Hook Deps Changes With UseWhatsChanged","_path":"/frontend/react/detect-hook-deps-changes-with-usewhatschanged"}]},{"title":"Vue","_path":"/frontend/vue","children":[{"title":"Adding Global Properties To Component","_path":"/frontend/vue/adding-global-properties-to-component"},{"title":"Make Nuxt Handle Obsidian Highlights","_path":"/frontend/vue/make-nuxt-handle-obsidian-highlights"}]},{"title":"Webgl","_path":"/frontend/webgl","children":[{"title":"Basics Of WebGL (Drawing A Cube)","_path":"/frontend/webgl/basics-of-webgl-(drawing-a-cube)"},{"title":"Fragment Shaders","_path":"/frontend/webgl/fragment-shaders"},{"title":"Rendering Without Blocking In A Worker","_path":"/frontend/webgl/rendering-without-blocking-in-a-worker"},{"title":"Vertex Shaders","_path":"/frontend/webgl/vertex-shaders"}]}]},{"title":"Git","_path":"/git","children":[{"title":"Force Git To Use HTTPS","_path":"/git/force-git-to-use-https"},{"title":"Git Aliases And Useful Commands","_path":"/git/git-aliases-and-useful-commands"}]},{"title":"Golang","_path":"/golang","children":[{"title":"I18n In Golang","_path":"/golang/i18n-in-golang"}]},{"title":"Graphql","_path":"/graphql","children":[{"title":"Apollo Client Pagination","_path":"/graphql/apollo-client-pagination"},{"title":"Refresh Token In Apollo Client","_path":"/graphql/refresh-token-in-apollo-client"}]},{"title":"Linux","_path":"/linux","children":[{"title":"Certbot Well Known Auto Renew","_path":"/linux/certbot-well-known-auto-renew"},{"title":"Find Out Who Uses Swap","_path":"/linux/find-out-who-uses-swap"},{"title":"Fixing Lagging USB Headphones","_path":"/linux/fixing-lagging-usb-headphones"},{"title":"Gitea For Git Hosting","_path":"/linux/gitea-for-git-hosting"},{"title":"Google Photos Alternative With Photoprism","_path":"/linux/google-photos-alternative-with-photoprism"},{"title":"Linux On Asus Zenbook UM3402 YA","_path":"/linux/linux-on-asus-zenbook-um3402-ya"},{"title":"Resume Or Start Screen Session","_path":"/linux/resume-or-start-screen-session"},{"title":"Rsync File With SSH","_path":"/linux/rsync-file-with-ssh"},{"title":"Setting Up NGINX","_path":"/linux/setting-up-nginx"},{"title":"SSH","_path":"/linux/ssh"}]},{"title":"Obsidian","_path":"/obsidian","children":[{"title":"Self Hosted Obsidian Sync With CouchDB","_path":"/obsidian/self-hosted-obsidian-sync-with-couchdb"}]},{"title":"Sql","_path":"/sql","children":[{"title":"MySQL And MariaDB Setup","_path":"/sql/mysql-and-mariadb-setup"},{"title":"Postgress Setup","_path":"/sql/postgress-setup"}]},{"title":"Typescript","_path":"/typescript","children":[{"title":"Add Global Variable To Window","_path":"/typescript/add-global-variable-to-window"},{"title":"Flatten Object With Periods","_path":"/typescript/flatten-object-with-periods"},{"title":"Type Guards","_path":"/typescript/type-guards"}]}]} \ No newline at end of file +{"generatedAt":1711020859831,"generateTime":103,"contents":[{"_path":"/blockchain/common-typescript-examples","_dir":"blockchain","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Common Typescript Examples","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Simple #dapp example for tests: "},{"type":"element","tag":"a","props":{"href":"https://metamask.github.io/test-dapp/","rel":["nofollow"]},"children":[{"type":"text","value":"https://metamask.github.io/test-dapp/"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Interaction with smart contracts described in "},{"type":"element","tag":"a","props":{"href":"Smart%20contracts"},"children":[{"type":"text","value":"Smart contracts"}]}]}]},{"type":"element","tag":"h2","props":{"id":"connecting-to-node"},"children":[{"type":"text","value":"Connecting to node"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If #Metamask extension installed, "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Web3.givenProvider"}]},{"type":"text","value":" is available in global window. You can use "},{"type":"element","tag":"a","props":{"href":"https://infura.io","rel":["nofollow"]},"children":[{"type":"text","value":"Infura"}]},{"type":"text","value":" or your node instead:"}]},{"type":"element","tag":"code","props":{"code":"import Web3 from 'web3';\n\n// URL of your node\nconst PROVIDER_URL = 'https://...';\n\nexport const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import Web3 from 'web3';\n\n// URL of your node\nconst PROVIDER_URL = 'https://...';\n\nexport const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"getting-wallet-balance"},"children":[{"type":"text","value":"Getting wallet balance"}]},{"type":"element","tag":"code","props":{"code":"const getBalance = async (address: string) => {\n return await web3.eth.getBalance(address);\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const getBalance = async (address: string) => {\n return await web3.eth.getBalance(address);\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"getting-wallet-address"},"children":[{"type":"text","value":"Getting wallet address"}]},{"type":"element","tag":"code","props":{"code":"// first we need to authorize\nconst authorize = async () => {\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n}\n\n// then we can get wallet address\nconst getCurrentAddressUser = () => {\n return web3.currentProvider.selectedAddress;\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// first we need to authorize\nconst authorize = async () => {\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n}\n\n// then we can get wallet address\nconst getCurrentAddressUser = () => {\n return web3.currentProvider.selectedAddress;\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"sending-transaction"},"children":[{"type":"text","value":"Sending transaction"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sending "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"value"}]},{"type":"text","value":" tokens with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"memo"}]},{"type":"text","value":" as value:"}]},{"type":"element","tag":"code","props":{"code":"\nconst transfer = async ({ \n from, \n to, \n value, \n memo, \n privateKey, \n gasLimit = 44000 \n}) => {\n const nonce = await web3.eth.getTransactionCount(from);\n const gasPrice = await web3.eth.getGasPrice();\n \n const rawTx = {\n from,\n to,\n value: web3.utils.toHex(Web3.utils.toWei(value, 'ether')),\n gasLimit: web3.utils.toHex(gasLimit),\n gasPrice: web3.utils.toHex(gasPrice),\n nonce: web3.utils.toHex(nonce),\n data: memo,\n };\n \n const privateKeyBuffer = EthUtil.toBuffer(privateKey);\n \n const tx = new Transaction(rawTx);\n \n tx.sign(privateKeyBuffer);\n const serializedTx = tx.serialize();\n \n return this.web3.eth.sendSignedTransaction(\n `0x${serializedTx.toString('hex')}`\n );\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"\nconst transfer = async ({ \n from, \n to, \n value, \n memo, \n privateKey, \n gasLimit = 44000 \n}) => {\n const nonce = await web3.eth.getTransactionCount(from);\n const gasPrice = await web3.eth.getGasPrice();\n \n const rawTx = {\n from,\n to,\n value: web3.utils.toHex(Web3.utils.toWei(value, 'ether')),\n gasLimit: web3.utils.toHex(gasLimit),\n gasPrice: web3.utils.toHex(gasPrice),\n nonce: web3.utils.toHex(nonce),\n data: memo,\n };\n \n const privateKeyBuffer = EthUtil.toBuffer(privateKey);\n \n const tx = new Transaction(rawTx);\n \n tx.sign(privateKeyBuffer);\n const serializedTx = tx.serialize();\n \n return this.web3.eth.sendSignedTransaction(\n `0x${serializedTx.toString('hex')}`\n );\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"estimating-transaction-fee"},"children":[{"type":"text","value":"Estimating transaction FEE"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful to get fixed amount of tokens from user with pre-estimated fee."}]},{"type":"element","tag":"code","props":{"code":"import { web3 } from '.';\n\nconst estimateFee = async ({\n from,\n to,\n value,\n memo,\n}) => {\n const gasPrice = await web3.eth.getGasPrice();\n const gasLimit = await web3.eth.estimateGas({\n from,\n to,\n value: web3.utils.toHex(web3.utils.toWei(value, 'ether')),\n data: web3.utils.asciiToHex(memo),\n }).call();\n \n return web3.utils.fromWei(\n BigInt(gasPrice.toString())\n .multiply(BigInt(gasLimit.toString()))\n .toString()\n );\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { web3 } from '.';\n\nconst estimateFee = async ({\n from,\n to,\n value,\n memo,\n}) => {\n const gasPrice = await web3.eth.getGasPrice();\n const gasLimit = await web3.eth.estimateGas({\n from,\n to,\n value: web3.utils.toHex(web3.utils.toWei(value, 'ether')),\n data: web3.utils.asciiToHex(memo),\n }).call();\n \n return web3.utils.fromWei(\n BigInt(gasPrice.toString())\n .multiply(BigInt(gasLimit.toString()))\n .toString()\n );\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"subscribing-to-wallet-address-change"},"children":[{"type":"text","value":"Subscribing to wallet address change"}]},{"type":"element","tag":"code","props":{"code":"import { web3 } from '.';\n\nweb3.currentProvider.on('accountsChanged', callback);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { web3 } from '.';\n\nweb3.currentProvider.on('accountsChanged', callback);\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"watching-network-change"},"children":[{"type":"text","value":"Watching network change"}]},{"type":"element","tag":"code","props":{"code":"ethereum.on('chainChanged', handler: (chainId: string) => void);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"ethereum.on('chainChanged', handler: (chainId: string) => void);\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"adding-custom-token-to-wallet"},"children":[{"type":"text","value":"Adding custom token to wallet"}]},{"type":"element","tag":"code","props":{"code":"window.ethereum\n .request({\n method: 'wallet_watchAsset',\n params: {\n type: 'ERC20',\n options: {\n address: '0xb60e8dd61c5d32be8058bb8eb970870f07233155',\n symbol: 'FOO',\n decimals: 18,\n image: 'https://foo.io/token-image.svg',\n },\n },\n })\n .then((success) => {\n if (success) {\n console.log('FOO successfully added to wallet!')\n } else {\n throw new Error('Something went wrong.')\n }\n })\n .catch(console.error)\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"window.ethereum\n .request({\n method: 'wallet_watchAsset',\n params: {\n type: 'ERC20',\n options: {\n address: '0xb60e8dd61c5d32be8058bb8eb970870f07233155',\n symbol: 'FOO',\n decimals: 18,\n image: 'https://foo.io/token-image.svg',\n },\n },\n })\n .then((success) => {\n if (success) {\n console.log('FOO successfully added to wallet!')\n } else {\n throw new Error('Something went wrong.')\n }\n })\n .catch(console.error)\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"changing-network-to-custom"},"children":[{"type":"text","value":"Changing network to custom"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Checking current chainId:"}]},{"type":"element","tag":"code","props":{"code":"const getChainID = async () => {\n return ethereum.request({ method: 'eth_chainId' })\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const getChainID = async () => {\n return ethereum.request({ method: 'eth_chainId' })\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Asking wallet to change current network:"}]},{"type":"element","tag":"code","props":{"code":"try {\n await window.ethereum.request({\n method: 'wallet_switchEthereumChain',\n params: [{ chainId: '0x03' }], // ropsten chainID (3) in hex\n });\n} catch (switchError) {\n // This error code indicates that the chain has not been added to MetaMask.\n if (error.code === 4902) {\n try {\n await window.ethereum.request({\n method: 'wallet_addEthereumChain',\n params: [{ \n chainId: '0x03', // ropsten chainID (3) in hex\n chainName: 'Ropsten Test Network', \n nativeCurrency: { \n name: 'ETH',\n symbol: 'ETH',\n decimals: 18\n }, \n rpcUrls: ['https://ropsten.infura.io/v3/9aa3d95b3bc440fa88ea12eaa4456161'], \n blockExplorerUrls: ['https://ropsten.etherscan.io'] \n }] ,\n });\n } catch (addError) {\n // handle \"add\" error\n }\n }\n // handle other \"switch\" errors\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"try {\n await window.ethereum.request({\n method: 'wallet_switchEthereumChain',\n params: [{ chainId: '0x03' }], // ropsten chainID (3) in hex\n });\n} catch (switchError) {\n // This error code indicates that the chain has not been added to MetaMask.\n if (error.code === 4902) {\n try {\n await window.ethereum.request({\n method: 'wallet_addEthereumChain',\n params: [{ \n chainId: '0x03', // ropsten chainID (3) in hex\n chainName: 'Ropsten Test Network', \n nativeCurrency: { \n name: 'ETH',\n symbol: 'ETH',\n decimals: 18\n }, \n rpcUrls: ['https://ropsten.infura.io/v3/9aa3d95b3bc440fa88ea12eaa4456161'], \n blockExplorerUrls: ['https://ropsten.etherscan.io'] \n }] ,\n });\n } catch (addError) {\n // handle \"add\" error\n }\n }\n // handle other \"switch\" errors\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Simple #dapp example for tests: "},{"type":"element","tag":"a","props":{"href":"https://metamask.github.io/test-dapp/","rel":["nofollow"]},"children":[{"type":"text","value":"https://metamask.github.io/test-dapp/"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Interaction with smart contracts described in "},{"type":"element","tag":"a","props":{"href":"Smart%20contracts"},"children":[{"type":"text","value":"Smart contracts"}]}]}]},{"type":"element","tag":"h2","props":{"id":"connecting-to-node"},"children":[{"type":"text","value":"Connecting to node"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If #Metamask extension installed, "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Web3.givenProvider"}]},{"type":"text","value":" is available in global window. You can use "},{"type":"element","tag":"a","props":{"href":"https://infura.io","rel":["nofollow"]},"children":[{"type":"text","value":"Infura"}]},{"type":"text","value":" or your node instead:"}]},{"type":"element","tag":"code","props":{"code":"import Web3 from 'web3';\n\n// URL of your node\nconst PROVIDER_URL = 'https://...';\n\nexport const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'web3'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-06c9fd"},"children":[{"type":"text","value":"// URL of your node"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"PROVIDER_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'https://...'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"givenProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"PROVIDER_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"getting-wallet-balance"},"children":[{"type":"text","value":"Getting wallet balance"}]},{"type":"element","tag":"code","props":{"code":"const getBalance = async (address: string) => {\n return await web3.eth.getBalance(address);\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-343e52"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-044655"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-beff07"},"children":[{"type":"text","value":"getBalance"}]},{"type":"element","tag":"span","props":{"class":"ct-044655"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fbdb54"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-044655"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-343e52"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-044655"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-0feb94"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-fbdb54"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-044655"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5aec75"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-044655"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-343e52"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-044655"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"getBalance"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"getting-wallet-address"},"children":[{"type":"text","value":"Getting wallet address"}]},{"type":"element","tag":"code","props":{"code":"// first we need to authorize\nconst authorize = async () => {\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n}\n\n// then we can get wallet address\nconst getCurrentAddressUser = () => {\n return web3.currentProvider.selectedAddress;\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-06c9fd"},"children":[{"type":"text","value":"// first we need to authorize"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"({ method: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'eth_requestAccounts'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-06c9fd"},"children":[{"type":"text","value":"// then we can get wallet address"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"getCurrentAddressUser"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"selectedAddress"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"sending-transaction"},"children":[{"type":"text","value":"Sending transaction"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sending "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"value"}]},{"type":"text","value":" tokens with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"memo"}]},{"type":"text","value":" as value:"}]},{"type":"element","tag":"code","props":{"code":"\nconst transfer = async ({ \n from, \n to, \n value, \n memo, \n privateKey, \n gasLimit = 44000 \n}) => {\n const nonce = await web3.eth.getTransactionCount(from);\n const gasPrice = await web3.eth.getGasPrice();\n \n const rawTx = {\n from,\n to,\n value: web3.utils.toHex(Web3.utils.toWei(value, 'ether')),\n gasLimit: web3.utils.toHex(gasLimit),\n gasPrice: web3.utils.toHex(gasPrice),\n nonce: web3.utils.toHex(nonce),\n data: memo,\n };\n \n const privateKeyBuffer = EthUtil.toBuffer(privateKey);\n \n const tx = new Transaction(rawTx);\n \n tx.sign(privateKeyBuffer);\n const serializedTx = tx.serialize();\n \n return this.web3.eth.sendSignedTransaction(\n `0x${serializedTx.toString('hex')}`\n );\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"transfer"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" ({ "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"}) "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"nonce"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"getTransactionCount"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"getGasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"rawTx"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" value: "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toWei"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'ether'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":")),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" gasLimit: "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" gasPrice: "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" nonce: "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"nonce"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" data: "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"privateKeyBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"EthUtil"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"tx"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"Transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"rawTx"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"tx"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"sign"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"privateKeyBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"serializedTx"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"tx"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"serialize"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"this"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"sendSignedTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"`0x${"}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"serializedTx"}]},{"type":"element","tag":"span","props":{"class":"ct-7a93f8"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-7a93f8"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'hex'"}]},{"type":"element","tag":"span","props":{"class":"ct-7a93f8"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"}`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"estimating-transaction-fee"},"children":[{"type":"text","value":"Estimating transaction FEE"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful to get fixed amount of tokens from user with pre-estimated fee."}]},{"type":"element","tag":"code","props":{"code":"import { web3 } from '.';\n\nconst estimateFee = async ({\n from,\n to,\n value,\n memo,\n}) => {\n const gasPrice = await web3.eth.getGasPrice();\n const gasLimit = await web3.eth.estimateGas({\n from,\n to,\n value: web3.utils.toHex(web3.utils.toWei(value, 'ether')),\n data: web3.utils.asciiToHex(memo),\n }).call();\n \n return web3.utils.fromWei(\n BigInt(gasPrice.toString())\n .multiply(BigInt(gasLimit.toString()))\n .toString()\n );\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"estimateFee"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" ({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"}) "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"getGasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"estimateGas"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" value: "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toWei"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'ether'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":")),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" data: "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"asciiToHex"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" })."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"call"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"fromWei"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7549d7"},"children":[{"type":"text","value":"BigInt"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"())"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"multiply"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7549d7"},"children":[{"type":"text","value":"BigInt"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"()))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"()"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"subscribing-to-wallet-address-change"},"children":[{"type":"text","value":"Subscribing to wallet address change"}]},{"type":"element","tag":"code","props":{"code":"import { web3 } from '.';\n\nweb3.currentProvider.on('accountsChanged', callback);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'accountsChanged'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"callback"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"watching-network-change"},"children":[{"type":"text","value":"Watching network change"}]},{"type":"element","tag":"code","props":{"code":"ethereum.on('chainChanged', handler: (chainId: string) => void);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'chainChanged'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"handler"}]},{"type":"element","tag":"span","props":{"class":"ct-ae222c"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"adding-custom-token-to-wallet"},"children":[{"type":"text","value":"Adding custom token to wallet"}]},{"type":"element","tag":"code","props":{"code":"window.ethereum\n .request({\n method: 'wallet_watchAsset',\n params: {\n type: 'ERC20',\n options: {\n address: '0xb60e8dd61c5d32be8058bb8eb970870f07233155',\n symbol: 'FOO',\n decimals: 18,\n image: 'https://foo.io/token-image.svg',\n },\n },\n })\n .then((success) => {\n if (success) {\n console.log('FOO successfully added to wallet!')\n } else {\n throw new Error('Something went wrong.')\n }\n })\n .catch(console.error)\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"window"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"ethereum"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" method: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'wallet_watchAsset'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" params: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" type: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'ERC20'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" options: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" address: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'0xb60e8dd61c5d32be8058bb8eb970870f07233155'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" symbol: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'FOO'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" decimals: "}]},{"type":"element","tag":"span","props":{"class":"ct-1b62bb"},"children":[{"type":"text","value":"18"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" image: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'https://foo.io/token-image.svg'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-044655"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-beff07"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-044655"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-0feb94"},"children":[{"type":"text","value":"success"}]},{"type":"element","tag":"span","props":{"class":"ct-044655"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-343e52"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-044655"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"success"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'FOO successfully added to wallet!'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"else"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7549d7"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'Something went wrong.'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":")"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"changing-network-to-custom"},"children":[{"type":"text","value":"Changing network to custom"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Checking current chainId:"}]},{"type":"element","tag":"code","props":{"code":"const getChainID = async () => {\n return ethereum.request({ method: 'eth_chainId' })\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"getChainID"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"({ method: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'eth_chainId'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Asking wallet to change current network:"}]},{"type":"element","tag":"code","props":{"code":"try {\n await window.ethereum.request({\n method: 'wallet_switchEthereumChain',\n params: [{ chainId: '0x03' }], // ropsten chainID (3) in hex\n });\n} catch (switchError) {\n // This error code indicates that the chain has not been added to MetaMask.\n if (error.code === 4902) {\n try {\n await window.ethereum.request({\n method: 'wallet_addEthereumChain',\n params: [{ \n chainId: '0x03', // ropsten chainID (3) in hex\n chainName: 'Ropsten Test Network', \n nativeCurrency: { \n name: 'ETH',\n symbol: 'ETH',\n decimals: 18\n }, \n rpcUrls: ['https://ropsten.infura.io/v3/9aa3d95b3bc440fa88ea12eaa4456161'], \n blockExplorerUrls: ['https://ropsten.etherscan.io'] \n }] ,\n });\n } catch (addError) {\n // handle \"add\" error\n }\n }\n // handle other \"switch\" errors\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"window"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" method: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'wallet_switchEthereumChain'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" params: [{ chainId: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'0x03'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" }], "}]},{"type":"element","tag":"span","props":{"class":"ct-06c9fd"},"children":[{"type":"text","value":"// ropsten chainID (3) in hex"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"} "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"switchError"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06c9fd"},"children":[{"type":"text","value":"// This error code indicates that the chain has not been added to MetaMask."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"code"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1b62bb"},"children":[{"type":"text","value":"4902"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"window"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" method: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'wallet_addEthereumChain'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" params: [{ "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" chainId: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'0x03'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-06c9fd"},"children":[{"type":"text","value":"// ropsten chainID (3) in hex"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" chainName: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'Ropsten Test Network'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" nativeCurrency: { "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" name: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'ETH'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" symbol: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'ETH'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" decimals: "}]},{"type":"element","tag":"span","props":{"class":"ct-1b62bb"},"children":[{"type":"text","value":"18"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" }, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" rpcUrls: ["}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'https://ropsten.infura.io/v3/9aa3d95b3bc440fa88ea12eaa4456161'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"], "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" blockExplorerUrls: ["}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'https://ropsten.etherscan.io'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"] "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" }] ,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"addError"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06c9fd"},"children":[{"type":"text","value":"// handle \"add\" error"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06c9fd"},"children":[{"type":"text","value":"// handle other \"switch\" errors"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-1b62bb{color:#79C0FF}.ct-ae222c{color:#C9D1D9}.ct-7549d7{color:#79C0FF}.ct-7a93f8{color:#A5D6FF}.ct-5aec75{color:#79C0FF}.ct-0feb94{color:#FFA657}.ct-fbdb54{color:#FF7B72}.ct-beff07{color:#D2A8FF}.ct-044655{color:#C9D1D9}.ct-343e52{color:#FF7B72}.ct-eb243d{color:#D2A8FF}.ct-c29390{color:#79C0FF}.ct-b49b42{color:#FF7B72}.ct-06c9fd{color:#8B949E}.ct-d5c300{color:#A5D6FF}.ct-5cf544{color:#C9D1D9}.ct-e988dc{color:#C9D1D9}.ct-e0e232{color:#FF7B72}.light .ct-e0e232{color:#859900}.light .ct-e988dc{color:#657B83}.light .ct-5cf544{color:#268BD2}.light .ct-d5c300{color:#2AA198}.light .ct-06c9fd{color:#93A1A1}.light .ct-b49b42{color:#073642}.light .ct-c29390{color:#268BD2}.light .ct-eb243d{color:#268BD2}.light .ct-343e52{color:#073642}.light .ct-044655{color:#657B83}.light .ct-beff07{color:#268BD2}.light .ct-fbdb54{color:#859900}.light .ct-0feb94{color:#657B83}.light .ct-5aec75{color:#859900}.light .ct-7a93f8{color:#657B83}.light .ct-7549d7{color:#859900}.light .ct-ae222c{color:#859900}.light .ct-1b62bb{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"connecting-to-node","depth":2,"text":"Connecting to node"},{"id":"getting-wallet-balance","depth":2,"text":"Getting wallet balance"},{"id":"getting-wallet-address","depth":2,"text":"Getting wallet address"},{"id":"sending-transaction","depth":2,"text":"Sending transaction"},{"id":"estimating-transaction-fee","depth":2,"text":"Estimating transaction FEE"},{"id":"subscribing-to-wallet-address-change","depth":2,"text":"Subscribing to wallet address change"},{"id":"watching-network-change","depth":2,"text":"Watching network change"},{"id":"adding-custom-token-to-wallet","depth":2,"text":"Adding custom token to wallet"},{"id":"changing-network-to-custom","depth":2,"text":"Changing network to custom"}]}},"_type":"markdown","_id":"content:Blockchain:Common typescript examples.md","_source":"content","_file":"Blockchain/Common typescript examples.md","_extension":"md"},{"_path":"/blockchain/smart-contracts","_dir":"blockchain","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Smart Contracts","description":"For common functions see Common typescript examples.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For common functions see "},{"type":"element","tag":"a","props":{"href":"Common%20typescript%20examples"},"children":[{"type":"text","value":"Common typescript examples"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"getting-smart-contract-instance"},"children":[{"type":"text","value":"Getting smart contract instance"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful for calling smart contract methods:"}]},{"type":"element","tag":"code","props":{"code":"import { Contract } from 'web3-eth-contract';\nimport { web3 } from '.';\n\nconst getContract = (abi: object, address?: string): Contract => {\n const abiFromJson = JSON.parse(JSON.stringify(abi));\n return new web3.eth.Contract(abiFromJson, address);\n};\n\nexport default getContract;\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { Contract } from 'web3-eth-contract';\nimport { web3 } from '.';\n\nconst getContract = (abi: object, address?: string): Contract => {\n const abiFromJson = JSON.parse(JSON.stringify(abi));\n return new web3.eth.Contract(abiFromJson, address);\n};\n\nexport default getContract;\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"executing-contract-method"},"children":[{"type":"text","value":"Executing contract method"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Contract has "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"read"}]},{"type":"text","value":" and "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"write"}]},{"type":"text","value":" methods. To get a list of methods, you can paste contract address on "},{"type":"element","tag":"a","props":{"href":"https://etherscan.io/token/0xdac17f958d2ee523a2206206994597c13d831ec7#readContract","rel":["nofollow"]},"children":[{"type":"text","value":"https://etherscan.io/ ETH"}]},{"type":"text","value":" or any other service."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Read"}]},{"type":"text","value":" methods doesn't require spending "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"gas"}]},{"type":"text","value":". "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Write"}]},{"type":"text","value":" methods cost some amount of "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"gas"}]},{"type":"text","value":", hence they will be executed with confirmation from user."}]},{"type":"element","tag":"h3","props":{"id":"example-for-metamask-without-private-key"},"children":[{"type":"text","value":"Example for #Metamask without private key"}]},{"type":"element","tag":"code","props":{"code":"// see example below\nimport { getContract } from '.';\n\n// ABI of contract\nconst CONTRACT_ABI = { /* ... */ };\n // address for contract\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n\nexport const executeContractMethod = async ({}) => {\n // getting contract\n const contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n \n // Calling write method\n try {\n // authorizing with Metamask\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n // getting wallet address\n const addressUser = web3.currentProvider.selectedAddress;\n // calling \"store\" store method for contract\n // payload should include `from` address, that matches\n // current user's wallet\n await contract.methods.store(0, 'Parameter').send({\n from: addressUser,\n });\n } catch (e) {\n throw new Error(e);\n }\n \n // calling read method\n try {\n // this method can return data\n const result = await contract.methods.retrieve().call();\n } catch (e) {\n throw new Error(e);\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// see example below\nimport { getContract } from '.';\n\n// ABI of contract\nconst CONTRACT_ABI = { /* ... */ };\n // address for contract\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n\nexport const executeContractMethod = async ({}) => {\n // getting contract\n const contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n \n // Calling write method\n try {\n // authorizing with Metamask\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n // getting wallet address\n const addressUser = web3.currentProvider.selectedAddress;\n // calling \"store\" store method for contract\n // payload should include `from` address, that matches\n // current user's wallet\n await contract.methods.store(0, 'Parameter').send({\n from: addressUser,\n });\n } catch (e) {\n throw new Error(e);\n }\n \n // calling read method\n try {\n // this method can return data\n const result = await contract.methods.retrieve().call();\n } catch (e) {\n throw new Error(e);\n }\n}\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"nodejs-and-react-native-example"},"children":[{"type":"text","value":"Node.js and React Native example"}]},{"type":"element","tag":"code","props":{"code":"// see example below\nimport { getContract } from '.';\n\n// ABI контракта\nconst CONTRACT_ABI = { /* ... */ };\n// contract address\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n// getting contract\nconst contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n// account's private key\nconst privateKey = '...';\n\n// write-methods requires private key\nconst executeContractMethod = async (val: number) => {\n const transaction = contract.methods.store(val);\n const account = web3.eth.accounts.privateKeyToAccount(privateKey);\n const options = {\n to: CONTRACT_ADDRESS,\n data: transaction.encodeABI(),\n gas: await transaction.estimateGas({ from: account.address }),\n gasPrice: await web3.eth.getGasPrice(),\n };\n const signed = await web3.eth.accounts.signTransaction(\n options,\n privateKey,\n );\n await web3.eth.sendSignedTransaction(signed.rawTransaction!);\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// see example below\nimport { getContract } from '.';\n\n// ABI контракта\nconst CONTRACT_ABI = { /* ... */ };\n// contract address\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n// getting contract\nconst contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n// account's private key\nconst privateKey = '...';\n\n// write-methods requires private key\nconst executeContractMethod = async (val: number) => {\n const transaction = contract.methods.store(val);\n const account = web3.eth.accounts.privateKeyToAccount(privateKey);\n const options = {\n to: CONTRACT_ADDRESS,\n data: transaction.encodeABI(),\n gas: await transaction.estimateGas({ from: account.address }),\n gasPrice: await web3.eth.getGasPrice(),\n };\n const signed = await web3.eth.accounts.signTransaction(\n options,\n privateKey,\n );\n await web3.eth.sendSignedTransaction(signed.rawTransaction!);\n};\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"calling-a-batch-of-contracts-methods"},"children":[{"type":"text","value":"Calling a batch of contract's methods"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Function calls batch of requests, returning array of results. For example:"}]},{"type":"element","tag":"code","props":{"code":" const requests = [\n contract.method.balanceOf().call,\n contract.method.getStaked().call\n ]\n\n const result = await makeBatchRequest(request);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" const requests = [\n contract.method.balanceOf().call,\n contract.method.getStaked().call\n ]\n\n const result = await makeBatchRequest(request);\n"}]}]}]},{"type":"element","tag":"code","props":{"code":"const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n\nconst makeBatchRequest = (calls: any[]) => {\n try {\n const web3 = getWeb3NoAccount();\n const batch = new web3.BatchRequest();\n\n const promises = calls.map((call) => {\n return new Promise((resolve, reject) => {\n batch.add(\n call.request({}, (err, result) => {\n if (err) {\n reject(err);\n } else {\n resolve(result);\n }\n })\n );\n });\n });\n\n batch.execute();\n\n return Promise.all(promises);\n } catch {\n return null;\n }\n};\n\nexport default makeBatchRequest;\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n\nconst makeBatchRequest = (calls: any[]) => {\n try {\n const web3 = getWeb3NoAccount();\n const batch = new web3.BatchRequest();\n\n const promises = calls.map((call) => {\n return new Promise((resolve, reject) => {\n batch.add(\n call.request({}, (err, result) => {\n if (err) {\n reject(err);\n } else {\n resolve(result);\n }\n })\n );\n });\n });\n\n batch.execute();\n\n return Promise.all(promises);\n } catch {\n return null;\n }\n};\n\nexport default makeBatchRequest;\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"subscribing-to-smart-contract-events"},"children":[{"type":"text","value":"Subscribing to smart contract events"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There're different ways to subscribe for contract events. For all of them you will need following variables:"}]},{"type":"element","tag":"code","props":{"code":" import Web3 from 'web3';\n const web3 = new Web3('YOUR_RPC_ENDPOINT_HERE');\n const ABI = 'YOUR ABI HERE';\n const CONTRACT_ADDRESS = 'YOUR CONTRACT ADDRESS HERE';\n const myContract = new Web3.Contract(ABI, CONTRACT_ADDRESS);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" import Web3 from 'web3';\n const web3 = new Web3('YOUR_RPC_ENDPOINT_HERE');\n const ABI = 'YOUR ABI HERE';\n const CONTRACT_ADDRESS = 'YOUR CONTRACT ADDRESS HERE';\n const myContract = new Web3.Contract(ABI, CONTRACT_ADDRESS);\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"by-accessing-contractevents"},"children":[{"type":"text","value":"By accessing contract.events"}]},{"type":"element","tag":"code","props":{"code":"referralProgramContract.events\n .RegisterUser()\n .on('connected', (subscriptionId: string) => {\n console.log(`| UserRegistered | events | ${subscriptionId}`);\n })\n .on(\n 'data',\n async (event: {\n removed: boolean;\n returnValues: RegisterUserResponseInterface;\n }) => {\n try {\n if (event.removed) {\n return;\n }\n const { user, referrer } = event.returnValues;\n console.log(user, referrer);\n } catch (e) {\n console.log(`| ONCE | ${e}`);\n }\n },\n )\n .on('error', (error: ErrnoException) => {\n console.log(error);\n });\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"referralProgramContract.events\n .RegisterUser()\n .on('connected', (subscriptionId: string) => {\n console.log(`| UserRegistered | events | ${subscriptionId}`);\n })\n .on(\n 'data',\n async (event: {\n removed: boolean;\n returnValues: RegisterUserResponseInterface;\n }) => {\n try {\n if (event.removed) {\n return;\n }\n const { user, referrer } = event.returnValues;\n console.log(user, referrer);\n } catch (e) {\n console.log(`| ONCE | ${e}`);\n }\n },\n )\n .on('error', (error: ErrnoException) => {\n console.log(error);\n });\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"with-filtering"},"children":[{"type":"text","value":"With filtering"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We're listening to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Transfer"}]},{"type":"text","value":" event here:"}]},{"type":"element","tag":"code","props":{"code":" let options = {\n filter: {\n value: [],\n },\n fromBlock: 0\n };\n\n myContract.events.Transfer(options)\n .on('data', event => console.log(event))\n .on('changed', changed => console.log(changed))\n .on('error', err => throw err)\n .on('connected', str => console.log(str))\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" let options = {\n filter: {\n value: [],\n },\n fromBlock: 0\n };\n\n myContract.events.Transfer(options)\n .on('data', event => console.log(event))\n .on('changed', changed => console.log(changed))\n .on('error', err => throw err)\n .on('connected', str => console.log(str))\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"common-subscribe-method"},"children":[{"type":"text","value":"Common Subscribe method"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Filtering options can also be specified:"}]},{"type":"element","tag":"code","props":{"code":" let options = {\n fromBlock: 0,\n address: ['address-1', 'address-2'], //Only get events from specific addresses\n topics: [] //What topics to subscribe to\n };\n\n let subscription = ('logs', options, (err,event) => {\n if (!err)\n console.log(event)\n });\n\n subscription.on('data', event => console.log(event))\n subscription.on('changed', changed => console.log(changed))\n subscription.on('error', err => { throw err })\n subscription.on('connected', nr => console.log(nr))\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" let options = {\n fromBlock: 0,\n address: ['address-1', 'address-2'], //Only get events from specific addresses\n topics: [] //What topics to subscribe to\n };\n\n let subscription = ('logs', options, (err,event) => {\n if (!err)\n console.log(event)\n });\n\n subscription.on('data', event => console.log(event))\n subscription.on('changed', changed => console.log(changed))\n subscription.on('error', err => { throw err })\n subscription.on('connected', nr => console.log(nr))\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"getting-event-history"},"children":[{"type":"text","value":"Getting event history"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Getting history for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Transfer"}]},{"type":"text","value":" events for specific values. More info can be found "},{"type":"element","tag":"a","props":{"href":"https://web3js.readthedocs.io/en/v1.2.11/web3-eth-subscribe.html#","rel":["nofollow"]},"children":[{"type":"text","value":"here"}]}]},{"type":"element","tag":"code","props":{"code":" //example options(optional)\n let options = {\n filter: {\n // only get events where transfer value was 1000 or 1337\n value: ['1000', '1337'] \n },\n // number | \"earliest\" | \"pending\" | \"latest\"\n fromBlock: 0, \n toBlock: 'latest'\n };\n\n myContract.getPastEvents('Transfer', options)\n .then(results => console.log(results))\n .catch(err => throw err);\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" //example options(optional)\n let options = {\n filter: {\n // only get events where transfer value was 1000 or 1337\n value: ['1000', '1337'] \n },\n // number | \"earliest\" | \"pending\" | \"latest\"\n fromBlock: 0, \n toBlock: 'latest'\n };\n\n myContract.getPastEvents('Transfer', options)\n .then(results => console.log(results))\n .catch(err => throw err);\n\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For common functions see "},{"type":"element","tag":"a","props":{"href":"Common%20typescript%20examples"},"children":[{"type":"text","value":"Common typescript examples"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"getting-smart-contract-instance"},"children":[{"type":"text","value":"Getting smart contract instance"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful for calling smart contract methods:"}]},{"type":"element","tag":"code","props":{"code":"import { Contract } from 'web3-eth-contract';\nimport { web3 } from '.';\n\nconst getContract = (abi: object, address?: string): Contract => {\n const abiFromJson = JSON.parse(JSON.stringify(abi));\n return new web3.eth.Contract(abiFromJson, address);\n};\n\nexport default getContract;\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"Contract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'web3-eth-contract'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bbedd3"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bed189"},"children":[{"type":"text","value":"abi"}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-82c1f9"},"children":[{"type":"text","value":"object"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bed189"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":"?:"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-82c1f9"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d007af"},"children":[{"type":"text","value":"abiFromJson"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c58381"},"children":[{"type":"text","value":"JSON"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d007af"},"children":[{"type":"text","value":"parse"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"Contract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"abiFromJson"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-2e08a5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-2e08a5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"executing-contract-method"},"children":[{"type":"text","value":"Executing contract method"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Contract has "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"read"}]},{"type":"text","value":" and "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"write"}]},{"type":"text","value":" methods. To get a list of methods, you can paste contract address on "},{"type":"element","tag":"a","props":{"href":"https://etherscan.io/token/0xdac17f958d2ee523a2206206994597c13d831ec7#readContract","rel":["nofollow"]},"children":[{"type":"text","value":"https://etherscan.io/ ETH"}]},{"type":"text","value":" or any other service."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Read"}]},{"type":"text","value":" methods doesn't require spending "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"gas"}]},{"type":"text","value":". "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Write"}]},{"type":"text","value":" methods cost some amount of "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"gas"}]},{"type":"text","value":", hence they will be executed with confirmation from user."}]},{"type":"element","tag":"h3","props":{"id":"example-for-metamask-without-private-key"},"children":[{"type":"text","value":"Example for #Metamask without private key"}]},{"type":"element","tag":"code","props":{"code":"// see example below\nimport { getContract } from '.';\n\n// ABI of contract\nconst CONTRACT_ABI = { /* ... */ };\n // address for contract\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n\nexport const executeContractMethod = async ({}) => {\n // getting contract\n const contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n \n // Calling write method\n try {\n // authorizing with Metamask\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n // getting wallet address\n const addressUser = web3.currentProvider.selectedAddress;\n // calling \"store\" store method for contract\n // payload should include `from` address, that matches\n // current user's wallet\n await contract.methods.store(0, 'Parameter').send({\n from: addressUser,\n });\n } catch (e) {\n throw new Error(e);\n }\n \n // calling read method\n try {\n // this method can return data\n const result = await contract.methods.retrieve().call();\n } catch (e) {\n throw new Error(e);\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// see example below"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// ABI of contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"/* ... */"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// address for contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'0xdea164f67df4dbfe675d5271c9d404e0260f33bb'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"executeContractMethod"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ({}) "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// getting contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// Calling write method"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// authorizing with Metamask"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"({ method: "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'eth_requestAccounts'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// getting wallet address"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"addressUser"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"selectedAddress"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// calling \"store\" store method for contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// payload should include `from` address, that matches"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// current user's wallet"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"methods"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"store"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-2bb2d2"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'Parameter'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"send"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" from: "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"addressUser"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2ef3a"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// calling read method"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// this method can return data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"methods"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"retrieve"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"()."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"call"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2ef3a"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"nodejs-and-react-native-example"},"children":[{"type":"text","value":"Node.js and React Native example"}]},{"type":"element","tag":"code","props":{"code":"// see example below\nimport { getContract } from '.';\n\n// ABI контракта\nconst CONTRACT_ABI = { /* ... */ };\n// contract address\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n// getting contract\nconst contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n// account's private key\nconst privateKey = '...';\n\n// write-methods requires private key\nconst executeContractMethod = async (val: number) => {\n const transaction = contract.methods.store(val);\n const account = web3.eth.accounts.privateKeyToAccount(privateKey);\n const options = {\n to: CONTRACT_ADDRESS,\n data: transaction.encodeABI(),\n gas: await transaction.estimateGas({ from: account.address }),\n gasPrice: await web3.eth.getGasPrice(),\n };\n const signed = await web3.eth.accounts.signTransaction(\n options,\n privateKey,\n );\n await web3.eth.sendSignedTransaction(signed.rawTransaction!);\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// see example below"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// ABI контракта"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"/* ... */"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// contract address"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'0xdea164f67df4dbfe675d5271c9d404e0260f33bb'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// getting contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// account's private key"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// write-methods requires private key"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bbedd3"},"children":[{"type":"text","value":"executeContractMethod"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bed189"},"children":[{"type":"text","value":"val"}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-82c1f9"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"methods"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"store"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"val"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"account"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"accounts"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"privateKeyToAccount"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" to: "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" data: "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"encodeABI"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"(),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" gas: "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"estimateGas"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"({ from: "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"account"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" gasPrice: "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"getGasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"(),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"signed"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"accounts"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"signTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"sendSignedTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"signed"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"rawTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"calling-a-batch-of-contracts-methods"},"children":[{"type":"text","value":"Calling a batch of contract's methods"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Function calls batch of requests, returning array of results. For example:"}]},{"type":"element","tag":"code","props":{"code":" const requests = [\n contract.method.balanceOf().call,\n contract.method.getStaked().call\n ]\n\n const result = await makeBatchRequest(request);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"requests"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"method"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"balanceOf"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"()."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"call"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"method"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"getStaked"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"()."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"call"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"makeBatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"code","props":{"code":"const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n\nconst makeBatchRequest = (calls: any[]) => {\n try {\n const web3 = getWeb3NoAccount();\n const batch = new web3.BatchRequest();\n\n const promises = calls.map((call) => {\n return new Promise((resolve, reject) => {\n batch.add(\n call.request({}, (err, result) => {\n if (err) {\n reject(err);\n } else {\n resolve(result);\n }\n })\n );\n });\n });\n\n batch.execute();\n\n return Promise.all(promises);\n } catch {\n return null;\n }\n};\n\nexport default makeBatchRequest;\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"givenProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"PROVIDER_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bbedd3"},"children":[{"type":"text","value":"makeBatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bed189"},"children":[{"type":"text","value":"calls"}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-82c1f9"},"children":[{"type":"text","value":"any"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":"[]) "}]},{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"getWeb3NoAccount"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"batch"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"BatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"promises"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"calls"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"map"}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-82c1f9"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-bed189"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bed189"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"batch"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"add"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"else"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"batch"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"execute"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2ef3a"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"all"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"promises"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-391539"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-2e08a5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-2e08a5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"makeBatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"subscribing-to-smart-contract-events"},"children":[{"type":"text","value":"Subscribing to smart contract events"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There're different ways to subscribe for contract events. For all of them you will need following variables:"}]},{"type":"element","tag":"code","props":{"code":" import Web3 from 'web3';\n const web3 = new Web3('YOUR_RPC_ENDPOINT_HERE');\n const ABI = 'YOUR ABI HERE';\n const CONTRACT_ADDRESS = 'YOUR CONTRACT ADDRESS HERE';\n const myContract = new Web3.Contract(ABI, CONTRACT_ADDRESS);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'web3'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'YOUR_RPC_ENDPOINT_HERE'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'YOUR ABI HERE'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'YOUR CONTRACT ADDRESS HERE'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"myContract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"Contract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"by-accessing-contractevents"},"children":[{"type":"text","value":"By accessing contract.events"}]},{"type":"element","tag":"code","props":{"code":"referralProgramContract.events\n .RegisterUser()\n .on('connected', (subscriptionId: string) => {\n console.log(`| UserRegistered | events | ${subscriptionId}`);\n })\n .on(\n 'data',\n async (event: {\n removed: boolean;\n returnValues: RegisterUserResponseInterface;\n }) => {\n try {\n if (event.removed) {\n return;\n }\n const { user, referrer } = event.returnValues;\n console.log(user, referrer);\n } catch (e) {\n console.log(`| ONCE | ${e}`);\n }\n },\n )\n .on('error', (error: ErrnoException) => {\n console.log(error);\n });\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"referralProgramContract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"events"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"RegisterUser"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"()"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-bbedd3"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5da781"},"children":[{"type":"text","value":"'connected'"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":", ("}]},{"type":"element","tag":"span","props":{"class":"ct-bed189"},"children":[{"type":"text","value":"subscriptionId"}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-82c1f9"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"`| UserRegistered | events | ${"}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"subscriptionId"}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'data'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bed189"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bed189"},"children":[{"type":"text","value":"removed"}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-82c1f9"},"children":[{"type":"text","value":"boolean"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bed189"},"children":[{"type":"text","value":"returnValues"}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-41d808"},"children":[{"type":"text","value":"RegisterUserResponseInterface"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"removed"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"user"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"referrer"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"returnValues"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"user"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"referrer"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"`| ONCE | ${"}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" )"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-bbedd3"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5da781"},"children":[{"type":"text","value":"'error'"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":", ("}]},{"type":"element","tag":"span","props":{"class":"ct-bed189"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-41d808"},"children":[{"type":"text","value":"ErrnoException"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" });"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"with-filtering"},"children":[{"type":"text","value":"With filtering"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We're listening to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Transfer"}]},{"type":"text","value":" event here:"}]},{"type":"element","tag":"code","props":{"code":" let options = {\n filter: {\n value: [],\n },\n fromBlock: 0\n };\n\n myContract.events.Transfer(options)\n .on('data', event => console.log(event))\n .on('changed', changed => console.log(changed))\n .on('error', err => throw err)\n .on('connected', str => console.log(str))\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" filter: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" value: [],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" fromBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-2bb2d2"},"children":[{"type":"text","value":"0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"myContract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"events"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"Transfer"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'data'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'changed'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"changed"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'error'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'connected'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"str"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"))"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"common-subscribe-method"},"children":[{"type":"text","value":"Common Subscribe method"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Filtering options can also be specified:"}]},{"type":"element","tag":"code","props":{"code":" let options = {\n fromBlock: 0,\n address: ['address-1', 'address-2'], //Only get events from specific addresses\n topics: [] //What topics to subscribe to\n };\n\n let subscription = ('logs', options, (err,event) => {\n if (!err)\n console.log(event)\n });\n\n subscription.on('data', event => console.log(event))\n subscription.on('changed', changed => console.log(changed))\n subscription.on('error', err => { throw err })\n subscription.on('connected', nr => console.log(nr))\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" fromBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-2bb2d2"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" address: ["}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'address-1'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'address-2'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"], "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"//Only get events from specific addresses"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" topics: [] "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"//What topics to subscribe to"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'logs'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'data'"}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'changed'"}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"changed"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'error'"}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'connected'"}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"nr"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"))"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"getting-event-history"},"children":[{"type":"text","value":"Getting event history"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Getting history for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Transfer"}]},{"type":"text","value":" events for specific values. More info can be found "},{"type":"element","tag":"a","props":{"href":"https://web3js.readthedocs.io/en/v1.2.11/web3-eth-subscribe.html#","rel":["nofollow"]},"children":[{"type":"text","value":"here"}]}]},{"type":"element","tag":"code","props":{"code":" //example options(optional)\n let options = {\n filter: {\n // only get events where transfer value was 1000 or 1337\n value: ['1000', '1337'] \n },\n // number | \"earliest\" | \"pending\" | \"latest\"\n fromBlock: 0, \n toBlock: 'latest'\n };\n\n myContract.getPastEvents('Transfer', options)\n .then(results => console.log(results))\n .catch(err => throw err);\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"//example options(optional)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" filter: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// only get events where transfer value was 1000 or 1337"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" value: ["}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'1000'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'1337'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"] "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// number | \"earliest\" | \"pending\" | \"latest\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" fromBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-2bb2d2"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" toBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'latest'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"myContract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"getPastEvents"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'Transfer'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"results"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-41d808{color:#FFA657}.ct-5da781{color:#A5D6FF}.ct-391539{color:#79C0FF}.ct-c2ef3a{color:#79C0FF}.ct-2bb2d2{color:#79C0FF}.ct-9207a0{color:#79C0FF}.ct-890deb{color:#FF7B72}.ct-295134{color:#8B949E}.ct-2e08a5{color:#FFA657}.ct-61346a{color:#D2A8FF}.ct-c58381{color:#79C0FF}.ct-d007af{color:#79C0FF}.ct-82c1f9{color:#79C0FF}.ct-bed189{color:#FFA657}.ct-f3c518{color:#FF7B72}.ct-bbedd3{color:#D2A8FF}.ct-177e39{color:#C9D1D9}.ct-2690b3{color:#FF7B72}.ct-9c9782{color:#A5D6FF}.ct-56249b{color:#C9D1D9}.ct-fc252f{color:#C9D1D9}.ct-1ef187{color:#FF7B72}.light .ct-1ef187{color:#859900}.light .ct-fc252f{color:#657B83}.light .ct-56249b{color:#268BD2}.light .ct-9c9782{color:#2AA198}.light .ct-2690b3{color:#073642}.light .ct-177e39{color:#657B83}.light .ct-bbedd3{color:#268BD2}.light .ct-f3c518{color:#859900}.light .ct-bed189{color:#657B83}.light .ct-82c1f9{color:#859900}.light .ct-d007af{color:#268BD2}.light .ct-c58381{color:#657B83}.light .ct-61346a{color:#268BD2}.light .ct-2e08a5{color:#657B83}.light .ct-295134{color:#93A1A1}.light .ct-890deb{color:#073642}.light .ct-9207a0{color:#268BD2}.light .ct-2bb2d2{color:#D33682}.light .ct-c2ef3a{color:#859900}.light .ct-391539{color:#B58900}.light .ct-5da781{color:#2AA198}.light .ct-41d808{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"getting-smart-contract-instance","depth":2,"text":"Getting smart contract instance"},{"id":"executing-contract-method","depth":2,"text":"Executing contract method","children":[{"id":"example-for-metamask-without-private-key","depth":3,"text":"Example for #Metamask without private key"},{"id":"nodejs-and-react-native-example","depth":3,"text":"Node.js and React Native example"},{"id":"calling-a-batch-of-contracts-methods","depth":3,"text":"Calling a batch of contract's methods"}]},{"id":"subscribing-to-smart-contract-events","depth":2,"text":"Subscribing to smart contract events","children":[{"id":"by-accessing-contractevents","depth":3,"text":"By accessing contract.events"},{"id":"with-filtering","depth":3,"text":"With filtering"},{"id":"common-subscribe-method","depth":3,"text":"Common Subscribe method"},{"id":"getting-event-history","depth":3,"text":"Getting event history"}]}]}},"_type":"markdown","_id":"content:Blockchain:Smart contracts.md","_source":"content","_file":"Blockchain/Smart contracts.md","_extension":"md"},{"_path":"/css/automatic-grid-like-masonry-with-pure-css","_dir":"css","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Automatic Grid Like Masonry With Pure CSS","description":"Grid, that places items by density. Pure #css solution. Can be used with items, that take different amount of rows/columns.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Grid, that places items by density. Pure #css solution. Can be used with items, that take different amount of rows/columns."}]},{"type":"element","tag":"code","props":{"code":"$cell: 250px;\n$gap: 20px;\n\n.grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax($cell, 1fr));\n grid-auto-rows: 256px;\n grid-auto-flow: row dense;\n grid-column-gap: $gap;\n grid-row-gap: $gap;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"$cell: 250px;\n$gap: 20px;\n\n.grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax($cell, 1fr));\n grid-auto-rows: 256px;\n grid-auto-flow: row dense;\n grid-column-gap: $gap;\n grid-row-gap: $gap;\n}\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"basic-elements-with-double-height-or-width"},"children":[{"type":"text","value":"Basic elements with double height or width"}]},{"type":"element","tag":"code","props":{"code":".h-2 { // takes 2 columns\n grid-column-end: span 2;\n}\n\n.v-2 { // takes 2 rows\n grid-row-end: span 2;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":".h-2 { // takes 2 columns\n grid-column-end: span 2;\n}\n\n.v-2 { // takes 2 rows\n grid-row-end: span 2;\n}\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"header-that-fills-all-columns"},"children":[{"type":"text","value":"Header, that fills all columns"}]},{"type":"element","tag":"code","props":{"code":".full-width {\n grid-row: 1 / 2; // height: 1 row\n grid-column: 1 / -1;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":".full-width {\n grid-row: 1 / 2; // height: 1 row\n grid-column: 1 / -1;\n}\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"stamp-element-that-takes-3-rows-in-the-top-right-corner"},"children":[{"type":"text","value":"Stamp element, that takes 3 rows in the top right corner"}]},{"type":"element","tag":"code","props":{"code":".top-right {\n grid-row: 1 / 3; // height here\n grid-column: -2 / -1; // width here\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":".top-right {\n grid-row: 1 / 3; // height here\n grid-column: -2 / -1; // width here\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Grid, that places items by density. Pure #css solution. Can be used with items, that take different amount of rows/columns."}]},{"type":"element","tag":"code","props":{"code":"$cell: 250px;\n$gap: 20px;\n\n.grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax($cell, 1fr));\n grid-auto-rows: 256px;\n grid-auto-flow: row dense;\n grid-column-gap: $gap;\n grid-row-gap: $gap;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b7c931"},"children":[{"type":"text","value":"$cell: "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"250"}]},{"type":"element","tag":"span","props":{"class":"ct-535298"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b7c931"},"children":[{"type":"text","value":"$gap: "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"20"}]},{"type":"element","tag":"span","props":{"class":"ct-535298"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0deccd"},"children":[{"type":"text","value":".grid"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac4382"},"children":[{"type":"text","value":"display"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-03adce"},"children":[{"type":"text","value":"grid"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac4382"},"children":[{"type":"text","value":"grid-template-columns"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-5c090b"},"children":[{"type":"text","value":"repeat"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3e58c4"},"children":[{"type":"text","value":"auto-fit"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-5c090b"},"children":[{"type":"text","value":"minmax"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3e58c4"},"children":[{"type":"text","value":"$cell"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-401198"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-7bc134"},"children":[{"type":"text","value":"fr"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f6288"},"children":[{"type":"text","value":"grid-auto-rows"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"256"}]},{"type":"element","tag":"span","props":{"class":"ct-535298"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac4382"},"children":[{"type":"text","value":"grid-auto-flow"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-03adce"},"children":[{"type":"text","value":"row"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03adce"},"children":[{"type":"text","value":"dense"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac4382"},"children":[{"type":"text","value":"grid-column-gap"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3e58c4"},"children":[{"type":"text","value":"$gap"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac4382"},"children":[{"type":"text","value":"grid-row-gap"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3e58c4"},"children":[{"type":"text","value":"$gap"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"basic-elements-with-double-height-or-width"},"children":[{"type":"text","value":"Basic elements with double height or width"}]},{"type":"element","tag":"code","props":{"code":".h-2 { // takes 2 columns\n grid-column-end: span 2;\n}\n\n.v-2 { // takes 2 rows\n grid-row-end: span 2;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0deccd"},"children":[{"type":"text","value":".h-2"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-202ff2"},"children":[{"type":"text","value":"// takes 2 columns"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f6288"},"children":[{"type":"text","value":"grid-column-end"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-7f6288"},"children":[{"type":"text","value":"span"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0deccd"},"children":[{"type":"text","value":".v-2"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-202ff2"},"children":[{"type":"text","value":"// takes 2 rows"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f6288"},"children":[{"type":"text","value":"grid-row-end"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-7f6288"},"children":[{"type":"text","value":"span"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"header-that-fills-all-columns"},"children":[{"type":"text","value":"Header, that fills all columns"}]},{"type":"element","tag":"code","props":{"code":".full-width {\n grid-row: 1 / 2; // height: 1 row\n grid-column: 1 / -1;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0deccd"},"children":[{"type":"text","value":".full-width"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f6288"},"children":[{"type":"text","value":"grid-row"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535298"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-202ff2"},"children":[{"type":"text","value":"// height: 1 row"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f6288"},"children":[{"type":"text","value":"grid-column"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" / "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"-1"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"stamp-element-that-takes-3-rows-in-the-top-right-corner"},"children":[{"type":"text","value":"Stamp element, that takes 3 rows in the top right corner"}]},{"type":"element","tag":"code","props":{"code":".top-right {\n grid-row: 1 / 3; // height here\n grid-column: -2 / -1; // width here\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0deccd"},"children":[{"type":"text","value":".top-right"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f6288"},"children":[{"type":"text","value":"grid-row"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535298"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-202ff2"},"children":[{"type":"text","value":"// height here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f6288"},"children":[{"type":"text","value":"grid-column"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"-2"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" / "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"-1"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-202ff2"},"children":[{"type":"text","value":"// width here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-202ff2{color:#8B949E}.ct-7f6288{color:#79C0FF}.ct-7bc134{color:#FF7B72}.ct-401198{color:#79C0FF}.ct-3e58c4{color:#FFA657}.ct-5c090b{color:#79C0FF}.ct-03adce{color:#79C0FF}.ct-ac4382{color:#79C0FF}.ct-dd221a{color:#C9D1D9}.ct-0deccd{color:#79C0FF}.ct-cd1102{color:#C9D1D9}.ct-535298{color:#FF7B72}.ct-a9479e{color:#79C0FF}.ct-b7c931{color:#FFA657}.light .ct-b7c931{color:#657B83}.light .ct-a9479e{color:#D33682}.light .ct-535298{color:#859900}.light .ct-cd1102{color:#657B83}.light .ct-0deccd{color:#93A1A1}.light .ct-dd221a{color:#657B83}.light .ct-ac4382{color:#859900}.light .ct-03adce{color:#657B83}.light .ct-5c090b{color:#268BD2}.light .ct-3e58c4{color:#657B83}.light .ct-401198{color:#D33682}.light .ct-7bc134{color:#859900}.light .ct-7f6288{color:#859900}.light .ct-202ff2{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"basic-elements-with-double-height-or-width","depth":3,"text":"Basic elements with double height or width"},{"id":"header-that-fills-all-columns","depth":3,"text":"Header, that fills all columns"},{"id":"stamp-element-that-takes-3-rows-in-the-top-right-corner","depth":3,"text":"Stamp element, that takes 3 rows in the top right corner"}]}},"_type":"markdown","_id":"content:CSS:Automatic Grid like Masonry with pure CSS.md","_source":"content","_file":"CSS/Automatic Grid like Masonry with pure CSS.md","_extension":"md"},{"_path":"/css/sass-nth-child-iterate-mixin","_dir":"css","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Sass Nth Child Iterate Mixin","description":"Say, we need to color n items by specific colors, which depend on its position. #SCSS supports iteration over lists for that purposes:","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say, we need to color "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"n"}]},{"type":"text","value":" items by specific colors, which depend on its position. #SCSS supports "},{"type":"element","tag":"a","props":{"href":"https://sass-lang.com/documentation/at-rules/control/each","rel":["nofollow"]},"children":[{"type":"text","value":"iteration over lists"}]},{"type":"text","value":" for that purposes:"}]},{"type":"element","tag":"code","props":{"code":"@mixin color-per-child($colors) {\n @each $color in $colors {\n &:nth-child(#{index(($colors), ($color))}) {\n color: $color;\n }\n }\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"@mixin color-per-child($colors) {\n @each $color in $colors {\n &:nth-child(#{index(($colors), ($color))}) {\n color: $color;\n }\n }\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Usage is simple:"}]},{"type":"element","tag":"code","props":{"code":".item {\n @include color_per_child((#ded187, #dbde87, #bade87, #9cde87, #87deaa));\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":".item {\n @include color_per_child((#ded187, #dbde87, #bade87, #9cde87, #87deaa));\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say, we need to color "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"n"}]},{"type":"text","value":" items by specific colors, which depend on its position. #SCSS supports "},{"type":"element","tag":"a","props":{"href":"https://sass-lang.com/documentation/at-rules/control/each","rel":["nofollow"]},"children":[{"type":"text","value":"iteration over lists"}]},{"type":"text","value":" for that purposes:"}]},{"type":"element","tag":"code","props":{"code":"@mixin color-per-child($colors) {\n @each $color in $colors {\n &:nth-child(#{index(($colors), ($color))}) {\n color: $color;\n }\n }\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd9d85"},"children":[{"type":"text","value":"@mixin"}]},{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3da580"},"children":[{"type":"text","value":"color-per-child"}]},{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ba84b2"},"children":[{"type":"text","value":"$colors"}]},{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cd9d85"},"children":[{"type":"text","value":"@each"}]},{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba84b2"},"children":[{"type":"text","value":"$color"}]},{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cd9d85"},"children":[{"type":"text","value":"in"}]},{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba84b2"},"children":[{"type":"text","value":"$colors"}]},{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6b63c"},"children":[{"type":"text","value":"&"}]},{"type":"element","tag":"span","props":{"class":"ct-c81df3"},"children":[{"type":"text","value":":nth-child"}]},{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ba84b2"},"children":[{"type":"text","value":"#{"}]},{"type":"element","tag":"span","props":{"class":"ct-a33ddb"},"children":[{"type":"text","value":"index"}]},{"type":"element","tag":"span","props":{"class":"ct-ba84b2"},"children":[{"type":"text","value":"(($colors), ($color))}"}]},{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-204ad4"},"children":[{"type":"text","value":"color"}]},{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ba84b2"},"children":[{"type":"text","value":"$color"}]},{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Usage is simple:"}]},{"type":"element","tag":"code","props":{"code":".item {\n @include color_per_child((#ded187, #dbde87, #bade87, #9cde87, #87deaa));\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-97f073"},"children":[{"type":"text","value":".item"}]},{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56dec9"},"children":[{"type":"text","value":"@include"}]},{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf611e"},"children":[{"type":"text","value":"color_per_child"}]},{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-4ac007"},"children":[{"type":"text","value":"#ded187"}]},{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-4ac007"},"children":[{"type":"text","value":"#dbde87"}]},{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-4ac007"},"children":[{"type":"text","value":"#bade87"}]},{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-4ac007"},"children":[{"type":"text","value":"#9cde87"}]},{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-4ac007"},"children":[{"type":"text","value":"#87deaa"}]},{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-4ac007{color:#79C0FF}.ct-bf611e{color:#D2A8FF}.ct-56dec9{color:#FF7B72}.ct-97f073{color:#79C0FF}.ct-59d711{color:#C9D1D9}.ct-204ad4{color:#79C0FF}.ct-a33ddb{color:#79C0FF}.ct-c81df3{color:#79C0FF}.ct-c6b63c{color:#7EE787}.ct-ba84b2{color:#FFA657}.ct-3da580{color:#D2A8FF}.ct-c05fcc{color:#C9D1D9}.ct-cd9d85{color:#FF7B72}.light .ct-cd9d85{color:#859900}.light .ct-c05fcc{color:#657B83}.light .ct-3da580{color:#268BD2}.light .ct-ba84b2{color:#657B83}.light .ct-c6b63c{color:#268BD2}.light .ct-c81df3{color:#93A1A1}.light .ct-a33ddb{color:#268BD2}.light .ct-204ad4{color:#859900}.light .ct-59d711{color:#657B83}.light .ct-97f073{color:#93A1A1}.light .ct-56dec9{color:#859900}.light .ct-bf611e{color:#268BD2}.light .ct-4ac007{color:#CB4B16}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:CSS:Sass nth-child iterate mixin.md","_source":"content","_file":"CSS/Sass nth-child iterate mixin.md","_extension":"md"},{"_path":"/css/test-if-browser-supports-css-rules","_dir":"css","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Test If Browser Supports CSS Rules","description":"To test if browser supports some #CSS rules, do following:","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To test if browser supports some #CSS rules, do following:"}]},{"type":"element","tag":"code","props":{"code":"@supports (backdrop-filter: blur(5px)) {\n backdrop-filter: blur(5px);\n}\n","language":"css"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"@supports (backdrop-filter: blur(5px)) {\n backdrop-filter: blur(5px);\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"@mixin"}]},{"type":"text","value":" will only apply rule if browser support backdrop filtering:"}]},{"type":"element","tag":"code","props":{"code":"@mixin can_backdrop {\n @supports (\n (-webkit-backdrop-filter: blur(5px)) or \n (backdrop-filter: blur(5px))\n ) {\n @content;\n }\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"@mixin can_backdrop {\n @supports (\n (-webkit-backdrop-filter: blur(5px)) or \n (backdrop-filter: blur(5px))\n ) {\n @content;\n }\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To test if browser supports some #CSS rules, do following:"}]},{"type":"element","tag":"code","props":{"code":"@supports (backdrop-filter: blur(5px)) {\n backdrop-filter: blur(5px);\n}\n","language":"css"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-45aa1d"},"children":[{"type":"text","value":"@supports"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-86d011"},"children":[{"type":"text","value":"backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-4cf4bf"},"children":[{"type":"text","value":"blur"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-0a3d5b"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-45aa1d"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ee1d29"},"children":[{"type":"text","value":"backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":": blur(5px);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"@mixin"}]},{"type":"text","value":" will only apply rule if browser support backdrop filtering:"}]},{"type":"element","tag":"code","props":{"code":"@mixin can_backdrop {\n @supports (\n (-webkit-backdrop-filter: blur(5px)) or \n (backdrop-filter: blur(5px))\n ) {\n @content;\n }\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-45aa1d"},"children":[{"type":"text","value":"@mixin"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6fdca5"},"children":[{"type":"text","value":"can_backdrop"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-45aa1d"},"children":[{"type":"text","value":"@supports"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b96a7c"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-fd3bac"},"children":[{"type":"text","value":"-webkit-backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-b96a7c"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-e2d865"},"children":[{"type":"text","value":"blur"}]},{"type":"element","tag":"span","props":{"class":"ct-b96a7c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d53fb7"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-1caf5e"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-b96a7c"},"children":[{"type":"text","value":")) "}]},{"type":"element","tag":"span","props":{"class":"ct-b98b1b"},"children":[{"type":"text","value":"or"}]},{"type":"element","tag":"span","props":{"class":"ct-b96a7c"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-86d011"},"children":[{"type":"text","value":"backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-4cf4bf"},"children":[{"type":"text","value":"blur"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-0a3d5b"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-45aa1d"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-45aa1d"},"children":[{"type":"text","value":"@content"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-b98b1b{color:#79C0FF}.ct-1caf5e{color:#FF7B72}.ct-d53fb7{color:#79C0FF}.ct-e2d865{color:#79C0FF}.ct-fd3bac{color:#79C0FF}.ct-b96a7c{color:#C9D1D9}.ct-6fdca5{color:#D2A8FF}.ct-ee1d29{color:#7EE787}.ct-0a3d5b{color:#79C0FF}.ct-4cf4bf{color:#79C0FF}.ct-86d011{color:#79C0FF}.ct-786564{color:#C9D1D9}.ct-45aa1d{color:#FF7B72}.light .ct-45aa1d{color:#859900}.light .ct-786564{color:#657B83}.light .ct-86d011{color:#859900}.light .ct-4cf4bf{color:#268BD2}.light .ct-0a3d5b{color:#D33682}.light .ct-ee1d29{color:#268BD2}.light .ct-6fdca5{color:#268BD2}.light .ct-b96a7c{color:#657B83}.light .ct-fd3bac{color:#859900}.light .ct-e2d865{color:#268BD2}.light .ct-d53fb7{color:#D33682}.light .ct-1caf5e{color:#859900}.light .ct-b98b1b{color:#657B83}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:CSS:Test if browser supports CSS rules.md","_source":"content","_file":"CSS/Test if browser supports CSS rules.md","_extension":"md"},{"_path":"/docker/building-static-pages-with-docker","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Building Static Pages With Docker","description":"Sample #Dockerfile for static Typescript builds such a #nextjs, #gatsby or #nuxt:","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sample #Dockerfile for static Typescript builds such a #nextjs, #gatsby or #nuxt:"}]},{"type":"element","tag":"code","props":{"code":"FROM node:16-alpine as builder\nWORKDIR /app\nCOPY package.json yarn.lock ./\nRUN yarn\nCOPY . .\n\n# your generate command here\nRUN yarn generate\n\nFROM nginx\nCOPY --from=builder /app/dist /usr/share/nginx/html\n","language":"Dockerfile"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"FROM node:16-alpine as builder\nWORKDIR /app\nCOPY package.json yarn.lock ./\nRUN yarn\nCOPY . .\n\n# your generate command here\nRUN yarn generate\n\nFROM nginx\nCOPY --from=builder /app/dist /usr/share/nginx/html\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sample #Dockerfile for static Typescript builds such a #nextjs, #gatsby or #nuxt:"}]},{"type":"element","tag":"code","props":{"code":"FROM node:16-alpine as builder\nWORKDIR /app\nCOPY package.json yarn.lock ./\nRUN yarn\nCOPY . .\n\n# your generate command here\nRUN yarn generate\n\nFROM nginx\nCOPY --from=builder /app/dist /usr/share/nginx/html\n","language":"Dockerfile"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"FROM node:16-alpine as builder\nWORKDIR /app\nCOPY package.json yarn.lock ./\nRUN yarn\nCOPY . .\n\n# your generate command here\nRUN yarn generate\n\nFROM nginx\nCOPY --from=builder /app/dist /usr/share/nginx/html"}]}]}]}]}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Docker:Building static pages with Docker.md","_source":"content","_file":"Docker/Building static pages with Docker.md","_extension":"md"},{"_path":"/docker/common-things-with-docker-mailserver","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Common Things With Docker Mailserver","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"1-docker-mailserver-ssl-alert-number-42"},"children":[{"type":"text","value":"1. docker-mailserver SSL alert number 42"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"I was getting following error after setting up TLS certificates in docker-mailserver after setting it up with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"letsencrypt"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"TLS handshaking: SSL_accept() failed: error:14094412:SSL routines:ssl3_read_bytes:sslv3 alert bad certificate: SSL alert number 42\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"TLS handshaking: SSL_accept() failed: error:14094412:SSL routines:ssl3_read_bytes:sslv3 alert bad certificate: SSL alert number 42\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The problem was caused by two reasons"}]},{"type":"element","tag":"h3","props":{"id":"11-letsencrypt-and-wildcard-domains"},"children":[{"type":"text","value":"1.1. Letsencrypt and wildcard domains"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"My "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"MX"}]},{"type":"text","value":" domain was "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"example.com"}]},{"type":"text","value":", bu "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"letsencrypt"}]},{"type":"text","value":" have been set up with wildcard certificate on "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"*.example.com"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"So, specifying "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_MODE=letsencrypt"}]},{"type":"text","value":" made it searching for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/letsencrypt/mail.example.com"}]},{"type":"text","value":", when it was just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/letsencrypt/example.com"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION"}]},{"type":"text","value":":"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change .env file to:"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_MODE=manual"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_KEY_PATH=/etc/letsencrypt/example.com/fullchain.pem"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_KEY_PATH=/etc/letsencrypt/example.com/privkey.pem"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to modify "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-compose"}]},{"type":"text","value":" volumes and pass certs from host filesystem. Note: they're not "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail.example.com"}]},{"type":"text","value":", they're just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"example.com"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"a","props":{"href":"https://github.com/docker-mailserver/docker-mailserver/issues/1607","rel":["nofollow"]},"children":[{"type":"text","value":"ticket"}]},{"type":"text","value":" describes it well."}]},{"type":"element","tag":"h3","props":{"id":"12-docker-was-using-internal-hostname-of-docker-mailserver"},"children":[{"type":"text","value":"1.2. Docker was using internal hostname of docker-mailserver"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Internal hostname for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-mailserver"}]},{"type":"text","value":" was just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail"}]},{"type":"text","value":", and other container tried to send emails to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail:25"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION:"}]},{"type":"text","value":" change internal hostname in your app settings to actual, specified in your certificates and MX record."}]},{"type":"element","tag":"h3","props":{"id":"2-docker-mailserver-not-listening-on-25-port-smtp"},"children":[{"type":"text","value":"2. docker-mailserver not listening on 25 port (SMTP)"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Solution was to add quotes in your docker compose, just like that:"}]},{"type":"element","tag":"code","props":{"code":" ports:\n - \"25:25\"\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" ports:\n - \"25:25\"\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"a","props":{"href":"https://github.com/docker-mailserver/docker-mailserver/issues/684#issuecomment-322029794","rel":["nofollow"]},"children":[{"type":"text","value":"ticket"}]},{"type":"text","value":" solved it"}]},{"type":"element","tag":"h3","props":{"id":"3-connect-to-docker-mailserver-from-other-docker-compose"},"children":[{"type":"text","value":"3. Connect to docker-mailserver from other docker-compose"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"I've had "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mailserver/compose.yaml"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"application/compose.yaml"}]},{"type":"text","value":" and needed to connect "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"application"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mailserver"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"// application/compose.yaml\napp:\n networks:\n - shared\nnetworks:\n shared:\n driver: bridge\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// application/compose.yaml\napp:\n networks:\n - shared\nnetworks:\n shared:\n driver: bridge\n"}]}]}]},{"type":"element","tag":"code","props":{"code":"/// mailserver/compose.yaml\nmail:\n networks:\n - \"application_shared\"\nnetworks:\n application_shared:\n external: true\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"/// mailserver/compose.yaml\nmail:\n networks:\n - \"application_shared\"\nnetworks:\n application_shared:\n external: true\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"4-how-to-convert-dkim-mailtxt-to-dns-record"},"children":[{"type":"text","value":"4. How to convert DKIM mail.txt to DNS record"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"My "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail.txt"}]},{"type":"text","value":" was like:"}]},{"type":"element","tag":"code","props":{"code":"mail._domainkey IN TXT ( \"v=DKIM1; h=sha256; k=rsa; \"\n \"p=sOmEJuNkLiKeRaNdOmOrLikeThat\"\n \"eVeNmOrERANdOmStuFf\" ) ; ----- DKIM key mail for example.com\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"mail._domainkey IN TXT ( \"v=DKIM1; h=sha256; k=rsa; \"\n \"p=sOmEJuNkLiKeRaNdOmOrLikeThat\"\n \"eVeNmOrERANdOmStuFf\" ) ; ----- DKIM key mail for example.com\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION"}]},{"type":"text","value":": concatenate all strings inside round brackets:"}]},{"type":"element","tag":"code","props":{"code":"v=DKIM1; h=sha256; k=rsa; p=sOmEJuNkLiKeRaNdOmOrLikeThateVeNmOrERANdOmStuFf\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"v=DKIM1; h=sha256; k=rsa; p=sOmEJuNkLiKeRaNdOmOrLikeThateVeNmOrERANdOmStuFf\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"And add them as a "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"TXT"}]},{"type":"text","value":" record on my DNS provider control panel under "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail._domainkey"}]},{"type":"text","value":" record."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Solution was right in "},{"type":"element","tag":"a","props":{"href":"https://docker-mailserver.github.io/docker-mailserver/edge/config/best-practices/dkim_dmarc_spf/#dkim-dns","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]},{"type":"text","value":", just hidden a little bit."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"1-docker-mailserver-ssl-alert-number-42"},"children":[{"type":"text","value":"1. docker-mailserver SSL alert number 42"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"I was getting following error after setting up TLS certificates in docker-mailserver after setting it up with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"letsencrypt"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"TLS handshaking: SSL_accept() failed: error:14094412:SSL routines:ssl3_read_bytes:sslv3 alert bad certificate: SSL alert number 42\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"TLS handshaking: SSL_accept() failed: error:14094412:SSL routines:ssl3_read_bytes:sslv3 alert bad certificate: SSL alert number 42"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The problem was caused by two reasons"}]},{"type":"element","tag":"h3","props":{"id":"11-letsencrypt-and-wildcard-domains"},"children":[{"type":"text","value":"1.1. Letsencrypt and wildcard domains"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"My "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"MX"}]},{"type":"text","value":" domain was "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"example.com"}]},{"type":"text","value":", bu "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"letsencrypt"}]},{"type":"text","value":" have been set up with wildcard certificate on "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"*.example.com"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"So, specifying "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_MODE=letsencrypt"}]},{"type":"text","value":" made it searching for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/letsencrypt/mail.example.com"}]},{"type":"text","value":", when it was just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/letsencrypt/example.com"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION"}]},{"type":"text","value":":"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change .env file to:"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_MODE=manual"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_KEY_PATH=/etc/letsencrypt/example.com/fullchain.pem"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_KEY_PATH=/etc/letsencrypt/example.com/privkey.pem"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to modify "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-compose"}]},{"type":"text","value":" volumes and pass certs from host filesystem. Note: they're not "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail.example.com"}]},{"type":"text","value":", they're just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"example.com"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"a","props":{"href":"https://github.com/docker-mailserver/docker-mailserver/issues/1607","rel":["nofollow"]},"children":[{"type":"text","value":"ticket"}]},{"type":"text","value":" describes it well."}]},{"type":"element","tag":"h3","props":{"id":"12-docker-was-using-internal-hostname-of-docker-mailserver"},"children":[{"type":"text","value":"1.2. Docker was using internal hostname of docker-mailserver"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Internal hostname for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-mailserver"}]},{"type":"text","value":" was just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail"}]},{"type":"text","value":", and other container tried to send emails to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail:25"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION:"}]},{"type":"text","value":" change internal hostname in your app settings to actual, specified in your certificates and MX record."}]},{"type":"element","tag":"h3","props":{"id":"2-docker-mailserver-not-listening-on-25-port-smtp"},"children":[{"type":"text","value":"2. docker-mailserver not listening on 25 port (SMTP)"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Solution was to add quotes in your docker compose, just like that:"}]},{"type":"element","tag":"code","props":{"code":" ports:\n - \"25:25\"\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f60a1"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-f39305"},"children":[{"type":"text","value":"\"25:25\""}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"a","props":{"href":"https://github.com/docker-mailserver/docker-mailserver/issues/684#issuecomment-322029794","rel":["nofollow"]},"children":[{"type":"text","value":"ticket"}]},{"type":"text","value":" solved it"}]},{"type":"element","tag":"h3","props":{"id":"3-connect-to-docker-mailserver-from-other-docker-compose"},"children":[{"type":"text","value":"3. Connect to docker-mailserver from other docker-compose"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"I've had "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mailserver/compose.yaml"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"application/compose.yaml"}]},{"type":"text","value":" and needed to connect "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"application"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mailserver"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"// application/compose.yaml\napp:\n networks:\n - shared\nnetworks:\n shared:\n driver: bridge\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f39305"},"children":[{"type":"text","value":"// application/compose.yaml"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0f60a1"},"children":[{"type":"text","value":"app"}]},{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f60a1"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-f39305"},"children":[{"type":"text","value":"shared"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0f60a1"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f60a1"},"children":[{"type":"text","value":"shared"}]},{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f60a1"},"children":[{"type":"text","value":"driver"}]},{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-f39305"},"children":[{"type":"text","value":"bridge"}]}]}]}]}]},{"type":"element","tag":"code","props":{"code":"/// mailserver/compose.yaml\nmail:\n networks:\n - \"application_shared\"\nnetworks:\n application_shared:\n external: true\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f39305"},"children":[{"type":"text","value":"/// mailserver/compose.yaml"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0f60a1"},"children":[{"type":"text","value":"mail"}]},{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f60a1"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-f39305"},"children":[{"type":"text","value":"\"application_shared\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0f60a1"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f60a1"},"children":[{"type":"text","value":"application_shared"}]},{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f60a1"},"children":[{"type":"text","value":"external"}]},{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-51eecb"},"children":[{"type":"text","value":"true"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"4-how-to-convert-dkim-mailtxt-to-dns-record"},"children":[{"type":"text","value":"4. How to convert DKIM mail.txt to DNS record"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"My "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail.txt"}]},{"type":"text","value":" was like:"}]},{"type":"element","tag":"code","props":{"code":"mail._domainkey IN TXT ( \"v=DKIM1; h=sha256; k=rsa; \"\n \"p=sOmEJuNkLiKeRaNdOmOrLikeThat\"\n \"eVeNmOrERANdOmStuFf\" ) ; ----- DKIM key mail for example.com\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"mail._domainkey IN TXT ( \"v=DKIM1; h=sha256; k=rsa; \"\n \"p=sOmEJuNkLiKeRaNdOmOrLikeThat\"\n \"eVeNmOrERANdOmStuFf\" ) ; ----- DKIM key mail for example.com"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION"}]},{"type":"text","value":": concatenate all strings inside round brackets:"}]},{"type":"element","tag":"code","props":{"code":"v=DKIM1; h=sha256; k=rsa; p=sOmEJuNkLiKeRaNdOmOrLikeThateVeNmOrERANdOmStuFf\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"v=DKIM1; h=sha256; k=rsa; p=sOmEJuNkLiKeRaNdOmOrLikeThateVeNmOrERANdOmStuFf"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"And add them as a "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"TXT"}]},{"type":"text","value":" record on my DNS provider control panel under "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail._domainkey"}]},{"type":"text","value":" record."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Solution was right in "},{"type":"element","tag":"a","props":{"href":"https://docker-mailserver.github.io/docker-mailserver/edge/config/best-practices/dkim_dmarc_spf/#dkim-dns","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]},{"type":"text","value":", just hidden a little bit."}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-51eecb{color:#79C0FF}.ct-f39305{color:#A5D6FF}.ct-0f60a1{color:#7EE787}.ct-0706b6{color:#C9D1D9}.light .ct-0706b6{color:#657B83}.light .ct-0f60a1{color:#268BD2}.light .ct-f39305{color:#2AA198}.light .ct-51eecb{color:#B58900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"1-docker-mailserver-ssl-alert-number-42","depth":2,"text":"1. docker-mailserver SSL alert number 42","children":[{"id":"11-letsencrypt-and-wildcard-domains","depth":3,"text":"1.1. Letsencrypt and wildcard domains"},{"id":"12-docker-was-using-internal-hostname-of-docker-mailserver","depth":3,"text":"1.2. Docker was using internal hostname of docker-mailserver"},{"id":"2-docker-mailserver-not-listening-on-25-port-smtp","depth":3,"text":"2. docker-mailserver not listening on 25 port (SMTP)"},{"id":"3-connect-to-docker-mailserver-from-other-docker-compose","depth":3,"text":"3. Connect to docker-mailserver from other docker-compose"},{"id":"4-how-to-convert-dkim-mailtxt-to-dns-record","depth":3,"text":"4. How to convert DKIM mail.txt to DNS record"}]}]}},"_type":"markdown","_id":"content:Docker:Common things with docker-mailserver.md","_source":"content","_file":"Docker/Common things with docker-mailserver.md","_extension":"md"},{"_path":"/docker/drone-ci","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Drone Ci","description":"Can be used with Private docker registry to deploy things using #docker.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Can be used with "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"Private docker registry"}]},{"type":"text","value":" to deploy things using #docker."}]},{"type":"element","tag":"h2","props":{"id":"pushing-to-private-docker_registry"},"children":[{"type":"text","value":"Pushing to private docker_registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should specify "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_login"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_password"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_registry"}]},{"type":"text","value":" organizations variables in your "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"drone"}]},{"type":"text","value":". And "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker_repo"}]},{"type":"text","value":" variable for your repo as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker.yourdomain.com/your-image"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is example of "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".droneci"}]},{"type":"text","value":" for "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"private docker registry"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build-master\n image: plugins/docker\n when:\n branch:\n - master\n settings:\n dockerfile: Dockerfile\n tag:\n - ${DRONE_BRANCH}\n username:\n from_secret: global_docker_login\n password:\n from_secret: global_docker_password\n registry:\n from_secret: global_docker_registry\n repo:\n from_secret: docker_repo\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build-master\n image: plugins/docker\n when:\n branch:\n - master\n settings:\n dockerfile: Dockerfile\n tag:\n - ${DRONE_BRANCH}\n username:\n from_secret: global_docker_login\n password:\n from_secret: global_docker_password\n registry:\n from_secret: global_docker_registry\n repo:\n from_secret: docker_repo\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"docker-compose-file-for-drone-ci"},"children":[{"type":"text","value":"Docker-compose file for drone-ci"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone"}]},{"type":"text","value":" service is ui itself and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone-agent"}]},{"type":"text","value":" is runner for builds, that can be started on different machine (or machines)."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"secret_id"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"rpc_secret"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone.url"}]},{"type":"text","value":" to something you like."}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nservices:\n drone:\n container_name: drone\n image: drone/drone:latest\n environment:\n - DRONE_GITHUB_CLIENT_ID=secret_id\n - DRONE_GITHUB_CLIENT_SECRET=client_secret\n - DRONE_RPC_SECRET=rpc_secret\n - DRONE_SERVER_HOST=drone.url\n - DRONE_USER_CREATE=\"username:user,admin:true\"\n - DRONE_SERVER_PROTO=https\n - DRONE_TLS_AUTOCERT=false\n - DRONE_GIT_ALWAYS_AUTH=false\n - DRONE_LOGS_DEBUG=true\n - DRONE_LOGS_TRACE=true\n restart: always\n volumes:\n - ./data:/data\n ports:\n - 8090:80\n drone-agent:\n container_name: drone__agent\n image: drone/agent:latest\n command: agent\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n environment:\n - DRONE_RPC_SERVER=https://drone.url\n - DRONE_RPC_SECRET=rpc_secret\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: \"3\"\n\nservices:\n drone:\n container_name: drone\n image: drone/drone:latest\n environment:\n - DRONE_GITHUB_CLIENT_ID=secret_id\n - DRONE_GITHUB_CLIENT_SECRET=client_secret\n - DRONE_RPC_SECRET=rpc_secret\n - DRONE_SERVER_HOST=drone.url\n - DRONE_USER_CREATE=\"username:user,admin:true\"\n - DRONE_SERVER_PROTO=https\n - DRONE_TLS_AUTOCERT=false\n - DRONE_GIT_ALWAYS_AUTH=false\n - DRONE_LOGS_DEBUG=true\n - DRONE_LOGS_TRACE=true\n restart: always\n volumes:\n - ./data:/data\n ports:\n - 8090:80\n drone-agent:\n container_name: drone__agent\n image: drone/agent:latest\n command: agent\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n environment:\n - DRONE_RPC_SERVER=https://drone.url\n - DRONE_RPC_SECRET=rpc_secret\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"caching-builds"},"children":[{"type":"text","value":"Caching builds"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Haven't checked that yet, but there's a "},{"type":"element","tag":"a","props":{"href":"https://laszlo.cloud/the-ultimate-droneci-caching-guide","rel":["nofollow"]},"children":[{"type":"text","value":"manual"}]},{"type":"text","value":" from "},{"type":"element","tag":"a","props":{"href":"https://laszlo.cloud/","rel":["nofollow"]},"children":[{"type":"text","value":"Laszlo Fogas"}]},{"type":"text","value":" about that."}]},{"type":"element","tag":"h2","props":{"id":"get-user-info"},"children":[{"type":"text","value":"Get user info"}]},{"type":"element","tag":"code","props":{"code":"export DRONE_SERVER=https://drone.url\nexport DRONE_TOKEN=password\ndrone info\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"export DRONE_SERVER=https://drone.url\nexport DRONE_TOKEN=password\ndrone info\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"mark-user-as-trusted"},"children":[{"type":"text","value":"Mark user as trusted"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes it won't help, then connect to drone database with sqlite and change user's trusted flag to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"1"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"drone repo update $1 --trusted=true && drone repo info $1\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"drone repo update $1 --trusted=true && drone repo info $1\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Can be used with "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"Private docker registry"}]},{"type":"text","value":" to deploy things using #docker."}]},{"type":"element","tag":"h2","props":{"id":"pushing-to-private-docker_registry"},"children":[{"type":"text","value":"Pushing to private docker_registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should specify "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_login"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_password"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_registry"}]},{"type":"text","value":" organizations variables in your "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"drone"}]},{"type":"text","value":". And "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker_repo"}]},{"type":"text","value":" variable for your repo as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker.yourdomain.com/your-image"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is example of "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".droneci"}]},{"type":"text","value":" for "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"private docker registry"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build-master\n image: plugins/docker\n when:\n branch:\n - master\n settings:\n dockerfile: Dockerfile\n tag:\n - ${DRONE_BRANCH}\n username:\n from_secret: global_docker_login\n password:\n from_secret: global_docker_password\n registry:\n from_secret: global_docker_registry\n repo:\n from_secret: docker_repo\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"kind"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"pipeline"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"build"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"docker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"platform"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"os"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"linux"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"arch"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"amd64"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"steps"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"build-master"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"plugins/docker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"when"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"branch"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"master"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"settings"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"dockerfile"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"Dockerfile"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"tag"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"${DRONE_BRANCH}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"username"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"global_docker_login"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"password"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"global_docker_password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"registry"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"global_docker_registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"repo"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"docker_repo"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"docker-compose-file-for-drone-ci"},"children":[{"type":"text","value":"Docker-compose file for drone-ci"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone"}]},{"type":"text","value":" service is ui itself and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone-agent"}]},{"type":"text","value":" is runner for builds, that can be started on different machine (or machines)."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"secret_id"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"rpc_secret"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone.url"}]},{"type":"text","value":" to something you like."}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nservices:\n drone:\n container_name: drone\n image: drone/drone:latest\n environment:\n - DRONE_GITHUB_CLIENT_ID=secret_id\n - DRONE_GITHUB_CLIENT_SECRET=client_secret\n - DRONE_RPC_SECRET=rpc_secret\n - DRONE_SERVER_HOST=drone.url\n - DRONE_USER_CREATE=\"username:user,admin:true\"\n - DRONE_SERVER_PROTO=https\n - DRONE_TLS_AUTOCERT=false\n - DRONE_GIT_ALWAYS_AUTH=false\n - DRONE_LOGS_DEBUG=true\n - DRONE_LOGS_TRACE=true\n restart: always\n volumes:\n - ./data:/data\n ports:\n - 8090:80\n drone-agent:\n container_name: drone__agent\n image: drone/agent:latest\n command: agent\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n environment:\n - DRONE_RPC_SERVER=https://drone.url\n - DRONE_RPC_SECRET=rpc_secret\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"\"3\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"drone"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"drone"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"drone/drone:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_GITHUB_CLIENT_ID=secret_id"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_GITHUB_CLIENT_SECRET=client_secret"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_RPC_SECRET=rpc_secret"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_SERVER_HOST=drone.url"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_USER_CREATE=\"username:user,admin:true\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_SERVER_PROTO=https"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_TLS_AUTOCERT=false"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_GIT_ALWAYS_AUTH=false"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_LOGS_DEBUG=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_LOGS_TRACE=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"./data:/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"8090:80"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"drone-agent"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"drone__agent"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"drone/agent:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"command"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"agent"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"/var/run/docker.sock:/var/run/docker.sock"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_RPC_SERVER=https://drone.url"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_RPC_SECRET=rpc_secret"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"caching-builds"},"children":[{"type":"text","value":"Caching builds"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Haven't checked that yet, but there's a "},{"type":"element","tag":"a","props":{"href":"https://laszlo.cloud/the-ultimate-droneci-caching-guide","rel":["nofollow"]},"children":[{"type":"text","value":"manual"}]},{"type":"text","value":" from "},{"type":"element","tag":"a","props":{"href":"https://laszlo.cloud/","rel":["nofollow"]},"children":[{"type":"text","value":"Laszlo Fogas"}]},{"type":"text","value":" about that."}]},{"type":"element","tag":"h2","props":{"id":"get-user-info"},"children":[{"type":"text","value":"Get user info"}]},{"type":"element","tag":"code","props":{"code":"export DRONE_SERVER=https://drone.url\nexport DRONE_TOKEN=password\ndrone info\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0734fc"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" DRONE_SERVER=https://drone.url"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0734fc"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" DRONE_TOKEN=password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":"drone info"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"mark-user-as-trusted"},"children":[{"type":"text","value":"Mark user as trusted"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes it won't help, then connect to drone database with sqlite and change user's trusted flag to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"1"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"drone repo update $1 --trusted=true && drone repo info $1\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":"drone repo update "}]},{"type":"element","tag":"span","props":{"class":"ct-9f67ad"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-55c6c3"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" --trusted=true "}]},{"type":"element","tag":"span","props":{"class":"ct-303659"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" drone repo info "}]},{"type":"element","tag":"span","props":{"class":"ct-9f67ad"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-55c6c3"},"children":[{"type":"text","value":"1"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-303659{color:#FF7B72}.ct-55c6c3{color:#C9D1D9}.ct-9f67ad{color:#C9D1D9}.ct-0734fc{color:#FF7B72}.ct-404a3d{color:#A5D6FF}.ct-2da089{color:#C9D1D9}.ct-d1fd60{color:#7EE787}.light .ct-d1fd60{color:#268BD2}.light .ct-2da089{color:#657B83}.light .ct-404a3d{color:#2AA198}.light .ct-0734fc{color:#073642}.light .ct-9f67ad{color:#859900}.light .ct-55c6c3{color:#268BD2}.light .ct-303659{color:#859900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"pushing-to-private-docker_registry","depth":2,"text":"Pushing to private docker_registry"},{"id":"docker-compose-file-for-drone-ci","depth":2,"text":"Docker-compose file for drone-ci"},{"id":"caching-builds","depth":2,"text":"Caching builds"},{"id":"get-user-info","depth":2,"text":"Get user info"},{"id":"mark-user-as-trusted","depth":2,"text":"Mark user as trusted"}]}},"_type":"markdown","_id":"content:Docker:Drone-ci.md","_source":"content","_file":"Docker/Drone-ci.md","_extension":"md"},{"_path":"/docker/github-pages-with-drone-ci","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Github Pages With Drone Ci","description":"To deploy github pages with Drone-ci you will need .drone.yml as specified below. You also should define secrets github_username and github_token (get it here) in your drone's repository setup.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To deploy github pages with "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":" you will need "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".drone.yml"}]},{"type":"text","value":" as specified below. You also should define secrets "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"github_username"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"github_token"}]},{"type":"text","value":" (get it "},{"type":"element","tag":"a","props":{"href":"https://github.com/settings/tokens","rel":["nofollow"]},"children":[{"type":"text","value":"here"}]},{"type":"text","value":") in your drone's repository setup."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Github repository should be named as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"yourname.github.io"}]},{"type":"text","value":" and it could be accessed at "},{"type":"element","tag":"a","props":{"href":"https://yourname.github.io/","rel":["nofollow"]},"children":[{"type":"text","value":"https://yourname.github.io/"}]},{"type":"text","value":". Otherwise it'll be available at "},{"type":"element","tag":"a","props":{"href":"https://yourname.github.io/repo-name/","rel":["nofollow"]},"children":[{"type":"text","value":"https://yourname.github.io/repo-name/"}]},{"type":"text","value":", what you might not like."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should create branch named "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gh-pages"}]},{"type":"text","value":" in that repo and setup GH Pages at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https://github.com//.github.io/settings/pages"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This config will update "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gh-pages"}]},{"type":"text","value":" branch in your project, which will contain only generated content. I know, that's bad, but there's no better way to do that with generic drone plugins."}]},{"type":"element","tag":"code","props":{"code":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build\n image: node:16\n commands:\n - yarn\n - yarn generate\n - rm -rf ./docs\n - mv ./.output/public ./docs\n - touch ./docs/.nojekyll\n - name: publish\n image: plugins/gh-pages\n settings:\n target_branch: gh-pages\n username:\n from_secret: github_username\n password:\n from_secret: github_token\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build\n image: node:16\n commands:\n - yarn\n - yarn generate\n - rm -rf ./docs\n - mv ./.output/public ./docs\n - touch ./docs/.nojekyll\n - name: publish\n image: plugins/gh-pages\n settings:\n target_branch: gh-pages\n username:\n from_secret: github_username\n password:\n from_secret: github_token\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Here we're moving "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./.output/public"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./docs"}]},{"type":"text","value":", because #nuxt creates symlink for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docs"}]},{"type":"text","value":" and git can't work with that."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Also we create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".nojekyll"}]},{"type":"text","value":" at the root of repo, so github's internal engine won't "},{"type":"element","tag":"a","props":{"href":"https://github.blog/2009-12-29-bypassing-jekyll-on-github-pages/","rel":["nofollow"]},"children":[{"type":"text","value":"ignore files that start with underscore"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"additional-reading"},"children":[{"type":"text","value":"Additional reading"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://plugins.drone.io/plugins/gh-pages","rel":["nofollow"]},"children":[{"type":"text","value":"Drone Github Pages Documentation"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.blog/2009-12-29-bypassing-jekyll-on-github-pages/","rel":["nofollow"]},"children":[{"type":"text","value":"Bypassing Jekyll on GitHub Pages"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To deploy github pages with "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":" you will need "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".drone.yml"}]},{"type":"text","value":" as specified below. You also should define secrets "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"github_username"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"github_token"}]},{"type":"text","value":" (get it "},{"type":"element","tag":"a","props":{"href":"https://github.com/settings/tokens","rel":["nofollow"]},"children":[{"type":"text","value":"here"}]},{"type":"text","value":") in your drone's repository setup."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Github repository should be named as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"yourname.github.io"}]},{"type":"text","value":" and it could be accessed at "},{"type":"element","tag":"a","props":{"href":"https://yourname.github.io/","rel":["nofollow"]},"children":[{"type":"text","value":"https://yourname.github.io/"}]},{"type":"text","value":". Otherwise it'll be available at "},{"type":"element","tag":"a","props":{"href":"https://yourname.github.io/repo-name/","rel":["nofollow"]},"children":[{"type":"text","value":"https://yourname.github.io/repo-name/"}]},{"type":"text","value":", what you might not like."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should create branch named "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gh-pages"}]},{"type":"text","value":" in that repo and setup GH Pages at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https://github.com//.github.io/settings/pages"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This config will update "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gh-pages"}]},{"type":"text","value":" branch in your project, which will contain only generated content. I know, that's bad, but there's no better way to do that with generic drone plugins."}]},{"type":"element","tag":"code","props":{"code":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build\n image: node:16\n commands:\n - yarn\n - yarn generate\n - rm -rf ./docs\n - mv ./.output/public ./docs\n - touch ./docs/.nojekyll\n - name: publish\n image: plugins/gh-pages\n settings:\n target_branch: gh-pages\n username:\n from_secret: github_username\n password:\n from_secret: github_token\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"kind"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"pipeline"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"build"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"docker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"platform"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"os"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"linux"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"arch"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"amd64"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"steps"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"build"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"node:16"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"commands"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"yarn"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"yarn generate"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"rm -rf ./docs"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"mv ./.output/public ./docs"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"touch ./docs/.nojekyll"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"publish"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"plugins/gh-pages"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"settings"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"target_branch"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"gh-pages"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"username"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"github_username"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"password"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"github_token"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Here we're moving "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./.output/public"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./docs"}]},{"type":"text","value":", because #nuxt creates symlink for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docs"}]},{"type":"text","value":" and git can't work with that."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Also we create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".nojekyll"}]},{"type":"text","value":" at the root of repo, so github's internal engine won't "},{"type":"element","tag":"a","props":{"href":"https://github.blog/2009-12-29-bypassing-jekyll-on-github-pages/","rel":["nofollow"]},"children":[{"type":"text","value":"ignore files that start with underscore"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"additional-reading"},"children":[{"type":"text","value":"Additional reading"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://plugins.drone.io/plugins/gh-pages","rel":["nofollow"]},"children":[{"type":"text","value":"Drone Github Pages Documentation"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.blog/2009-12-29-bypassing-jekyll-on-github-pages/","rel":["nofollow"]},"children":[{"type":"text","value":"Bypassing Jekyll on GitHub Pages"}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-ebd133{color:#A5D6FF}.ct-b98996{color:#C9D1D9}.ct-c98cc9{color:#7EE787}.light .ct-c98cc9{color:#268BD2}.light .ct-b98996{color:#657B83}.light .ct-ebd133{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"additional-reading","depth":2,"text":"Additional reading"}]}},"_type":"markdown","_id":"content:Docker:Github pages with drone-ci.md","_source":"content","_file":"Docker/Github pages with drone-ci.md","_extension":"md"},{"_path":"/docker/private-docker-registry","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Private Docker Registry","description":"Suitable to work with Drone-ci for hosting private #docker images.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Suitable to work with "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":" for hosting private #docker images."}]},{"type":"element","tag":"h2","props":{"id":"sample-docker-compose-for-custom-docker-registry"},"children":[{"type":"text","value":"Sample docker-compose for custom docker registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This one brings up private docker registry with ui. First you'll need to generate password for it:"}]},{"type":"element","tag":"code","props":{"code":"docker run \\\n --entrypoint htpasswd registry:2 \\\n -Bbn user mypassword > auth/registry.password\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"docker run \\\n --entrypoint htpasswd registry:2 \\\n -Bbn user mypassword > auth/registry.password\n"}]}]}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\nservices:\n registry:\n container_name: docker__registry\n image: registry:2\n ports:\n - 5000:5000\n restart: always\n environment:\n - REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=/data\n - REGISTRY_AUTH=htpasswd\n - REGISTRY_AUTH_HTPASSWD_REALM=Registry\n - REGISTRY_AUTH_HTPASSWD_PATH=/auth/registry.password\n - REGISTRY_HTTP_SECRET=password\n - REGISTRY_STORAGE_DELETE_ENABLED=true\n volumes:\n - ./registry/auth:/auth\n - ./registry/data:/data\n ui:\n container_name: docker__ui\n image: parabuzzle/craneoperator:latest\n ports:\n - 80:80\n restart: always\n environment:\n - REGISTRY_HOST=registry\n - REGISTRY_PORT=5000\n - REGISTRY_PROTOCOL=http\n - ALLOW_REGISTRY_LOGIN=true\n - REGISTRY_ALLOW_DELETE=true\n - USERNAME=registry\n - PASSWORD=password\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: \"3\"\nservices:\n registry:\n container_name: docker__registry\n image: registry:2\n ports:\n - 5000:5000\n restart: always\n environment:\n - REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=/data\n - REGISTRY_AUTH=htpasswd\n - REGISTRY_AUTH_HTPASSWD_REALM=Registry\n - REGISTRY_AUTH_HTPASSWD_PATH=/auth/registry.password\n - REGISTRY_HTTP_SECRET=password\n - REGISTRY_STORAGE_DELETE_ENABLED=true\n volumes:\n - ./registry/auth:/auth\n - ./registry/data:/data\n ui:\n container_name: docker__ui\n image: parabuzzle/craneoperator:latest\n ports:\n - 80:80\n restart: always\n environment:\n - REGISTRY_HOST=registry\n - REGISTRY_PORT=5000\n - REGISTRY_PROTOCOL=http\n - ALLOW_REGISTRY_LOGIN=true\n - REGISTRY_ALLOW_DELETE=true\n - USERNAME=registry\n - PASSWORD=password\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"squash-layers-on-registry"},"children":[{"type":"text","value":"Squash layers on registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you need to squash all layers in docker registry to free up disk space."}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Run this command to mark oldest layers"}]}]},{"type":"element","tag":"code","props":{"code":"# Try this first\ndocker run \\\n --rm anoxis/registry-cli \\\n -r https://registry.url \\\n -l user:password \\\n --delete \\\n --num 2\n\n# Then this \ndocker run -it \\\n -v /path/to/registry/data:/registry \\\n -e REGISTRY_URL=https://registry.url \\\n -e DRY_RUN=\"false\" \\\n -e REGISTRY_AUTH=\"user:password\" \\\n mortensrasmussen/docker-registry-manifest-cleanup\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"# Try this first\ndocker run \\\n --rm anoxis/registry-cli \\\n -r https://registry.url \\\n -l user:password \\\n --delete \\\n --num 2\n\n# Then this \ndocker run -it \\\n -v /path/to/registry/data:/registry \\\n -e REGISTRY_URL=https://registry.url \\\n -e DRY_RUN=\"false\" \\\n -e REGISTRY_AUTH=\"user:password\" \\\n mortensrasmussen/docker-registry-manifest-cleanup\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Suitable to work with "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":" for hosting private #docker images."}]},{"type":"element","tag":"h2","props":{"id":"sample-docker-compose-for-custom-docker-registry"},"children":[{"type":"text","value":"Sample docker-compose for custom docker registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This one brings up private docker registry with ui. First you'll need to generate password for it:"}]},{"type":"element","tag":"code","props":{"code":"docker run \\\n --entrypoint htpasswd registry:2 \\\n -Bbn user mypassword > auth/registry.password\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":"docker run \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" --entrypoint htpasswd registry:2 \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" -Bbn user mypassword "}]},{"type":"element","tag":"span","props":{"class":"ct-ac602b"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" auth/registry.password"}]}]}]}]}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\nservices:\n registry:\n container_name: docker__registry\n image: registry:2\n ports:\n - 5000:5000\n restart: always\n environment:\n - REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=/data\n - REGISTRY_AUTH=htpasswd\n - REGISTRY_AUTH_HTPASSWD_REALM=Registry\n - REGISTRY_AUTH_HTPASSWD_PATH=/auth/registry.password\n - REGISTRY_HTTP_SECRET=password\n - REGISTRY_STORAGE_DELETE_ENABLED=true\n volumes:\n - ./registry/auth:/auth\n - ./registry/data:/data\n ui:\n container_name: docker__ui\n image: parabuzzle/craneoperator:latest\n ports:\n - 80:80\n restart: always\n environment:\n - REGISTRY_HOST=registry\n - REGISTRY_PORT=5000\n - REGISTRY_PROTOCOL=http\n - ALLOW_REGISTRY_LOGIN=true\n - REGISTRY_ALLOW_DELETE=true\n - USERNAME=registry\n - PASSWORD=password\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"\"3\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"registry"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"docker__registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"registry:2"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"5000:5000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"REGISTRY_AUTH=htpasswd"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"REGISTRY_AUTH_HTPASSWD_REALM=Registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"REGISTRY_AUTH_HTPASSWD_PATH=/auth/registry.password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"REGISTRY_HTTP_SECRET=password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"REGISTRY_STORAGE_DELETE_ENABLED=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"./registry/auth:/auth"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"./registry/data:/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"ui"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"docker__ui"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"parabuzzle/craneoperator:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"80:80"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"REGISTRY_HOST=registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"REGISTRY_PORT=5000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"REGISTRY_PROTOCOL=http"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"ALLOW_REGISTRY_LOGIN=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"REGISTRY_ALLOW_DELETE=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"USERNAME=registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"PASSWORD=password"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"squash-layers-on-registry"},"children":[{"type":"text","value":"Squash layers on registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you need to squash all layers in docker registry to free up disk space."}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Run this command to mark oldest layers"}]}]},{"type":"element","tag":"code","props":{"code":"# Try this first\ndocker run \\\n --rm anoxis/registry-cli \\\n -r https://registry.url \\\n -l user:password \\\n --delete \\\n --num 2\n\n# Then this \ndocker run -it \\\n -v /path/to/registry/data:/registry \\\n -e REGISTRY_URL=https://registry.url \\\n -e DRY_RUN=\"false\" \\\n -e REGISTRY_AUTH=\"user:password\" \\\n mortensrasmussen/docker-registry-manifest-cleanup\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a663a1"},"children":[{"type":"text","value":"# Try this first"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":"docker run \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" --rm anoxis/registry-cli \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" -r https://registry.url \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" -l user:password \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" --delete \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" --num 2"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a663a1"},"children":[{"type":"text","value":"# Then this "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":"docker run -it \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" -v /path/to/registry/data:/registry \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" -e REGISTRY_URL=https://registry.url \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" -e DRY_RUN="}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" -e REGISTRY_AUTH="}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"\"user:password\""}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" mortensrasmussen/docker-registry-manifest-cleanup"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-a663a1{color:#8B949E}.ct-12b57b{color:#A5D6FF}.ct-0ddb55{color:#7EE787}.ct-ac602b{color:#FF7B72}.ct-28deb7{color:#C9D1D9}.light .ct-28deb7{color:#657B83}.light .ct-ac602b{color:#859900}.light .ct-0ddb55{color:#268BD2}.light .ct-12b57b{color:#2AA198}.light .ct-a663a1{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"sample-docker-compose-for-custom-docker-registry","depth":2,"text":"Sample docker-compose for custom docker registry"},{"id":"squash-layers-on-registry","depth":2,"text":"Squash layers on registry"}]}},"_type":"markdown","_id":"content:Docker:Private docker registry.md","_source":"content","_file":"Docker/Private docker registry.md","_extension":"md"},{"_path":"/docker/refresh-containers-on-pull","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Refresh Containers On Pull","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"setting-up-watchtower"},"children":[{"type":"text","value":"Setting up watchtower"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://containrrr.dev/watchtower/","rel":["nofollow"]},"children":[{"type":"text","value":"Watchtower"}]},{"type":"text","value":" will automatically pull updated #docker containers. Can be used with "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"Private docker registry"}]},{"type":"text","value":" and "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nservices:\n watchtower:\n container_name: docker__watchtower\n image: v2tec/watchtower\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n - /home/user/.docker/config.json:/config.json\n command: --interval 60 image_1 image_2\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: \"3\"\n\nservices:\n watchtower:\n container_name: docker__watchtower\n image: v2tec/watchtower\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n - /home/user/.docker/config.json:/config.json\n command: --interval 60 image_1 image_2\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"setting-up-watchtower"},"children":[{"type":"text","value":"Setting up watchtower"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://containrrr.dev/watchtower/","rel":["nofollow"]},"children":[{"type":"text","value":"Watchtower"}]},{"type":"text","value":" will automatically pull updated #docker containers. Can be used with "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"Private docker registry"}]},{"type":"text","value":" and "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nservices:\n watchtower:\n container_name: docker__watchtower\n image: v2tec/watchtower\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n - /home/user/.docker/config.json:/config.json\n command: --interval 60 image_1 image_2\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1eb56c"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-7a2acd"},"children":[{"type":"text","value":"\"3\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1eb56c"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1eb56c"},"children":[{"type":"text","value":"watchtower"}]},{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1eb56c"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-7a2acd"},"children":[{"type":"text","value":"docker__watchtower"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1eb56c"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-7a2acd"},"children":[{"type":"text","value":"v2tec/watchtower"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1eb56c"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-7a2acd"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1eb56c"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-7a2acd"},"children":[{"type":"text","value":"/var/run/docker.sock:/var/run/docker.sock"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-7a2acd"},"children":[{"type":"text","value":"/home/user/.docker/config.json:/config.json"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1eb56c"},"children":[{"type":"text","value":"command"}]},{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-7a2acd"},"children":[{"type":"text","value":"--interval 60 image_1 image_2"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-7a2acd{color:#A5D6FF}.ct-b5287a{color:#C9D1D9}.ct-1eb56c{color:#7EE787}.light .ct-1eb56c{color:#268BD2}.light .ct-b5287a{color:#657B83}.light .ct-7a2acd{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"setting-up-watchtower","depth":2,"text":"Setting up watchtower"}]}},"_type":"markdown","_id":"content:Docker:Refresh containers on pull.md","_source":"content","_file":"Docker/Refresh containers on pull.md","_extension":"md"},{"_path":"/docker/seed-dump-inside-docker","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Seed Dump Inside Docker","description":"If you need to seed .sql dump in #docker container, just run this command. Also you can try to rsync file with SSH to get it from remote host.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If you need to seed "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".sql"}]},{"type":"text","value":" dump in #docker container, just run this command. Also you can try to "},{"type":"element","tag":"a","props":{"href":"/linux/Rsync%20file%20with%20SSH"},"children":[{"type":"text","value":"rsync file with SSH"}]},{"type":"text","value":" to get it from remote host."}]},{"type":"element","tag":"code","props":{"code":"#####\n# usage: ./script.sh \"/path/to/dump.sql\"\n#####\n\nDUMP_PATH=$1\nCONTAINER=\"db\"\nUSER=root\nPASSWORD=password\nDB=database\n\ncat \"$DUMP_PATH\" | docker exec -i $CONTAINER mysql -u$USER -p$PASSWORD $DB\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"#####\n# usage: ./script.sh \"/path/to/dump.sql\"\n#####\n\nDUMP_PATH=$1\nCONTAINER=\"db\"\nUSER=root\nPASSWORD=password\nDB=database\n\ncat \"$DUMP_PATH\" | docker exec -i $CONTAINER mysql -u$USER -p$PASSWORD $DB\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If you need to seed "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".sql"}]},{"type":"text","value":" dump in #docker container, just run this command. Also you can try to "},{"type":"element","tag":"a","props":{"href":"/linux/Rsync%20file%20with%20SSH"},"children":[{"type":"text","value":"rsync file with SSH"}]},{"type":"text","value":" to get it from remote host."}]},{"type":"element","tag":"code","props":{"code":"#####\n# usage: ./script.sh \"/path/to/dump.sql\"\n#####\n\nDUMP_PATH=$1\nCONTAINER=\"db\"\nUSER=root\nPASSWORD=password\nDB=database\n\ncat \"$DUMP_PATH\" | docker exec -i $CONTAINER mysql -u$USER -p$PASSWORD $DB\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a24274"},"children":[{"type":"text","value":"#####"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a24274"},"children":[{"type":"text","value":"# usage: ./script.sh \"/path/to/dump.sql\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a24274"},"children":[{"type":"text","value":"#####"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":"DUMP_PATH="}]},{"type":"element","tag":"span","props":{"class":"ct-0f4d33"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-f3d07f"},"children":[{"type":"text","value":"1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":"CONTAINER="}]},{"type":"element","tag":"span","props":{"class":"ct-919b14"},"children":[{"type":"text","value":"\"db\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":"USER=root"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":"PASSWORD=password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":"DB=database"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":"cat "}]},{"type":"element","tag":"span","props":{"class":"ct-919b14"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-0f4d33"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-f3d07f"},"children":[{"type":"text","value":"DUMP_PATH"}]},{"type":"element","tag":"span","props":{"class":"ct-919b14"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e38e69"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":" docker "}]},{"type":"element","tag":"span","props":{"class":"ct-010366"},"children":[{"type":"text","value":"exec"}]},{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":" -i "}]},{"type":"element","tag":"span","props":{"class":"ct-0f4d33"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-f3d07f"},"children":[{"type":"text","value":"CONTAINER"}]},{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":" mysql -u"}]},{"type":"element","tag":"span","props":{"class":"ct-0f4d33"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-f3d07f"},"children":[{"type":"text","value":"USER"}]},{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":" -p"}]},{"type":"element","tag":"span","props":{"class":"ct-0f4d33"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-f3d07f"},"children":[{"type":"text","value":"PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f4d33"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-f3d07f"},"children":[{"type":"text","value":"DB"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-010366{color:#79C0FF}.ct-e38e69{color:#FF7B72}.ct-919b14{color:#A5D6FF}.ct-f3d07f{color:#C9D1D9}.ct-0f4d33{color:#C9D1D9}.ct-7b2cb4{color:#C9D1D9}.ct-a24274{color:#8B949E}.light .ct-a24274{color:#93A1A1}.light .ct-7b2cb4{color:#657B83}.light .ct-0f4d33{color:#859900}.light .ct-f3d07f{color:#268BD2}.light .ct-919b14{color:#2AA198}.light .ct-e38e69{color:#859900}.light .ct-010366{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Docker:Seed dump inside docker.md","_source":"content","_file":"Docker/Seed dump inside docker.md","_extension":"md"},{"_path":"/docker/wait-for-mysql","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Wait For Mysql","description":"wait-for-it.sh doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before #mysql is ready to accept connections","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vishnubob/wait-for-it","rel":["nofollow"]},"children":[{"type":"text","value":"wait-for-it.sh"}]},{"type":"text","value":" doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before #mysql is ready to accept connections"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This script waits for first successful query from database or exits with non-zero status after timeout."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$query"}]},{"type":"text","value":" for the actually working one."}]},{"type":"element","tag":"code","props":{"code":"# Waits for mysql to become actually available\nwait_for_mysql() {\n query=\"SELECT count(*) FROM users\"\n \n timeout=180 # 3 minutes limit\n i=0\n \n while ! docker exec -it \"$1\" mysql --user=\"$2\" --password=\"$3\" -e \"$query\" $4 >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly query MySQL after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_mysql miin-mysql-dev root password database\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"# Waits for mysql to become actually available\nwait_for_mysql() {\n query=\"SELECT count(*) FROM users\"\n \n timeout=180 # 3 minutes limit\n i=0\n \n while ! docker exec -it \"$1\" mysql --user=\"$2\" --password=\"$3\" -e \"$query\" $4 >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly query MySQL after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_mysql miin-mysql-dev root password database\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Wait%20for%20redis"},"children":[{"type":"text","value":"Wait for redis"}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vishnubob/wait-for-it","rel":["nofollow"]},"children":[{"type":"text","value":"wait-for-it.sh"}]},{"type":"text","value":" doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before #mysql is ready to accept connections"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This script waits for first successful query from database or exits with non-zero status after timeout."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$query"}]},{"type":"text","value":" for the actually working one."}]},{"type":"element","tag":"code","props":{"code":"# Waits for mysql to become actually available\nwait_for_mysql() {\n query=\"SELECT count(*) FROM users\"\n \n timeout=180 # 3 minutes limit\n i=0\n \n while ! docker exec -it \"$1\" mysql --user=\"$2\" --password=\"$3\" -e \"$query\" $4 >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly query MySQL after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_mysql miin-mysql-dev root password database\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b14eb"},"children":[{"type":"text","value":"# Waits for mysql to become actually available"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-46a328"},"children":[{"type":"text","value":"wait_for_mysql"}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":"() {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" query="}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":"\"SELECT count(*) FROM users\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" timeout=180 "}]},{"type":"element","tag":"span","props":{"class":"ct-5b14eb"},"children":[{"type":"text","value":"# 3 minutes limit"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" i=0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":"while"}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" docker "}]},{"type":"element","tag":"span","props":{"class":"ct-174785"},"children":[{"type":"text","value":"exec"}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" -it "}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-7edd79"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-b5713d"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" mysql --user="}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-7edd79"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-b5713d"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" -e "}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-7edd79"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-b5713d"},"children":[{"type":"text","value":"query"}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":"do"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" sleep 1"}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" i="}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":"$(("}]},{"type":"element","tag":"span","props":{"class":"ct-7edd79"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-b5713d"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-ad6a7c"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" [[ "}]},{"type":"element","tag":"span","props":{"class":"ct-7edd79"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-b5713d"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-7edd79"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":"-ge"}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7edd79"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-b5713d"},"children":[{"type":"text","value":"timeout"}]},{"type":"element","tag":"span","props":{"class":"ct-7edd79"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" ]]"}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":";"}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":"then"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-174785"},"children":[{"type":"text","value":"echo"}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":"\"[Error] can't properly query MySQL after "}]},{"type":"element","tag":"span","props":{"class":"ct-7edd79"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-b5713d"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-7edd79"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":" secs\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-174785"},"children":[{"type":"text","value":"exit"}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" 1"}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":"fi"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":"done"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b14eb"},"children":[{"type":"text","value":"# usage: wait_for_mysql miin-mysql-dev root password database"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Wait%20for%20redis"},"children":[{"type":"text","value":"Wait for redis"}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-ad6a7c{color:#79C0FF}.ct-b5713d{color:#C9D1D9}.ct-7edd79{color:#C9D1D9}.ct-174785{color:#79C0FF}.ct-bb4b9c{color:#FF7B72}.ct-4afbe3{color:#A5D6FF}.ct-ec2995{color:#C9D1D9}.ct-46a328{color:#D2A8FF}.ct-5b14eb{color:#8B949E}.light .ct-5b14eb{color:#93A1A1}.light .ct-46a328{color:#268BD2}.light .ct-ec2995{color:#657B83}.light .ct-4afbe3{color:#2AA198}.light .ct-bb4b9c{color:#859900}.light .ct-174785{color:#268BD2}.light .ct-7edd79{color:#859900}.light .ct-b5713d{color:#268BD2}.light .ct-ad6a7c{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Docker:Wait for mysql.md","_source":"content","_file":"Docker/Wait for mysql.md","_extension":"md"},{"_path":"/docker/wait-for-redis","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Wait For Redis","description":"wait-for-it.sh doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before redis is ready to accept connections","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vishnubob/wait-for-it","rel":["nofollow"]},"children":[{"type":"text","value":"wait-for-it.sh"}]},{"type":"text","value":" doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before redis is ready to accept connections"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This script waits for first successful ping or exits with non-zero status after 3 minutes."}]},{"type":"element","tag":"code","props":{"code":"# Waits for redis to become actually available\nwait_for_redis() {\n timeout=180 # 3 minutes\n i=0\n while ! docker exec -it \"$1\" redis-cli -h localhost -p 6379 -a \"$2\" ping | grep \"PONG\" >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly ping Redis container after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_redis miin-redis-dev password\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"# Waits for redis to become actually available\nwait_for_redis() {\n timeout=180 # 3 minutes\n i=0\n while ! docker exec -it \"$1\" redis-cli -h localhost -p 6379 -a \"$2\" ping | grep \"PONG\" >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly ping Redis container after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_redis miin-redis-dev password\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Wait%20for%20mysql"},"children":[{"type":"text","value":"Wait for mysql"}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vishnubob/wait-for-it","rel":["nofollow"]},"children":[{"type":"text","value":"wait-for-it.sh"}]},{"type":"text","value":" doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before redis is ready to accept connections"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This script waits for first successful ping or exits with non-zero status after 3 minutes."}]},{"type":"element","tag":"code","props":{"code":"# Waits for redis to become actually available\nwait_for_redis() {\n timeout=180 # 3 minutes\n i=0\n while ! docker exec -it \"$1\" redis-cli -h localhost -p 6379 -a \"$2\" ping | grep \"PONG\" >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly ping Redis container after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_redis miin-redis-dev password\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3d82fe"},"children":[{"type":"text","value":"# Waits for redis to become actually available"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a45584"},"children":[{"type":"text","value":"wait_for_redis"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":"() {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" timeout=180 "}]},{"type":"element","tag":"span","props":{"class":"ct-3d82fe"},"children":[{"type":"text","value":"# 3 minutes"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" i=0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":"while"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" docker "}]},{"type":"element","tag":"span","props":{"class":"ct-48c63c"},"children":[{"type":"text","value":"exec"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" -it "}]},{"type":"element","tag":"span","props":{"class":"ct-5a6fca"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-1904d6"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-9f136f"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5a6fca"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" redis-cli -h localhost -p 6379 -a "}]},{"type":"element","tag":"span","props":{"class":"ct-5a6fca"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-1904d6"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-9f136f"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-5a6fca"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" ping "}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" grep "}]},{"type":"element","tag":"span","props":{"class":"ct-5a6fca"},"children":[{"type":"text","value":"\"PONG\""}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":"/dev/null "}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":"2>&1;"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":"do"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" sleep 1"}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" i="}]},{"type":"element","tag":"span","props":{"class":"ct-5a6fca"},"children":[{"type":"text","value":"$(("}]},{"type":"element","tag":"span","props":{"class":"ct-1904d6"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-9f136f"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-e51a4c"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5a6fca"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" [[ "}]},{"type":"element","tag":"span","props":{"class":"ct-1904d6"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-9f136f"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-1904d6"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":"-ge"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1904d6"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-9f136f"},"children":[{"type":"text","value":"timeout"}]},{"type":"element","tag":"span","props":{"class":"ct-1904d6"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" ]]"}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":";"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":"then"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-48c63c"},"children":[{"type":"text","value":"echo"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5a6fca"},"children":[{"type":"text","value":"\"[Error] can't properly ping Redis container after "}]},{"type":"element","tag":"span","props":{"class":"ct-1904d6"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-9f136f"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-1904d6"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-5a6fca"},"children":[{"type":"text","value":" secs\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-48c63c"},"children":[{"type":"text","value":"exit"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" 1"}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":"fi"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":"done"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3d82fe"},"children":[{"type":"text","value":"# usage: wait_for_redis miin-redis-dev password"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Wait%20for%20mysql"},"children":[{"type":"text","value":"Wait for mysql"}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-e51a4c{color:#79C0FF}.ct-9f136f{color:#C9D1D9}.ct-1904d6{color:#C9D1D9}.ct-5a6fca{color:#A5D6FF}.ct-48c63c{color:#79C0FF}.ct-363153{color:#FF7B72}.ct-717443{color:#C9D1D9}.ct-a45584{color:#D2A8FF}.ct-3d82fe{color:#8B949E}.light .ct-3d82fe{color:#93A1A1}.light .ct-a45584{color:#268BD2}.light .ct-717443{color:#657B83}.light .ct-363153{color:#859900}.light .ct-48c63c{color:#268BD2}.light .ct-5a6fca{color:#2AA198}.light .ct-1904d6{color:#859900}.light .ct-9f136f{color:#268BD2}.light .ct-e51a4c{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Docker:Wait for redis.md","_source":"content","_file":"Docker/Wait for redis.md","_extension":"md"},{"_path":"/frontend/react-native/oauth2-login","_dir":"react-native","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"OAuth2 Login","description":"Use #oauth2 login with React-Native","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Use #oauth2 login with React-Native"}]},{"type":"element","tag":"h2","props":{"id":"common-oauth2-providers"},"children":[{"type":"text","value":"Common OAuth2 providers"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Can be handled by "},{"type":"element","tag":"a","props":{"href":"react-native-app-auth"},"children":[{"type":"text","value":"react-native-app-auth"}]},{"type":"text","value":" by redirecting to url "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"com.yourapp://oauth2provider"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h3","props":{"id":"example-for-google"},"children":[{"type":"text","value":"Example for #Google"}]},{"type":"element","tag":"code","props":{"code":"import { authorize } from 'react-native-app-auth';\n\nconst GOOGLE_OAUTH_CLIENT = '...';\n\n// ...\nconst authState = await authorize({\n issuer: 'https://accounts.google.com',\n clientId: `${GOOGLE_OAUTH_CLIENT}.apps.googleusercontent.com`,\n redirectUrl: `com.yourapp:/oauth2redirect/google`,\n scopes: ['openid', 'profile'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { authorize } from 'react-native-app-auth';\n\nconst GOOGLE_OAUTH_CLIENT = '...';\n\n// ...\nconst authState = await authorize({\n issuer: 'https://accounts.google.com',\n clientId: `${GOOGLE_OAUTH_CLIENT}.apps.googleusercontent.com`,\n redirectUrl: `com.yourapp:/oauth2redirect/google`,\n scopes: ['openid', 'profile'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"example-for-yandex"},"children":[{"type":"text","value":"Example for #Yandex"}]},{"type":"element","tag":"code","props":{"code":"const YANDEX_OAUTH_CLIENT = '...';\nconst YANDEX_OAUTH_SECRET = '...'; // better hide it somehow\nconst APP_ID = 'com.yourapp';\n\nconst authState = await authorize({\n serviceConfiguration: {\n authorizationEndpoint: `https://oauth.yandex.ru/authorize?response_type=code&client_id=${YANDEX_OAUTH_CLIENT}&redirect_uri=${APP_ID}:/oauth2redirect`,\n // TODO: replace it with your own backend to secure client_secret:\n tokenEndpoint: `https://oauth.yandex.ru/token?grant_type=authorization_code&client_id=${YANDEX_OAUTH_CLIENT}&client_secret=${YANDEX_OAUTH_SECRET}`,\n },\n clientId: YANDEX_OAUTH_CLIENT,\n redirectUrl: `${APP_ID}:/oauth2redirect`,\n scopes: ['login:info', 'login:avatar'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n\ncallback(authState.accessToken);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const YANDEX_OAUTH_CLIENT = '...';\nconst YANDEX_OAUTH_SECRET = '...'; // better hide it somehow\nconst APP_ID = 'com.yourapp';\n\nconst authState = await authorize({\n serviceConfiguration: {\n authorizationEndpoint: `https://oauth.yandex.ru/authorize?response_type=code&client_id=${YANDEX_OAUTH_CLIENT}&redirect_uri=${APP_ID}:/oauth2redirect`,\n // TODO: replace it with your own backend to secure client_secret:\n tokenEndpoint: `https://oauth.yandex.ru/token?grant_type=authorization_code&client_id=${YANDEX_OAUTH_CLIENT}&client_secret=${YANDEX_OAUTH_SECRET}`,\n },\n clientId: YANDEX_OAUTH_CLIENT,\n redirectUrl: `${APP_ID}:/oauth2redirect`,\n scopes: ['login:info', 'login:avatar'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n\ncallback(authState.accessToken);\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"apple-id-login"},"children":[{"type":"text","value":"Apple ID login"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/invertase/react-native-apple-authentication","rel":["nofollow"]},"children":[{"type":"text","value":"react-native-apple-authentication"}]},{"type":"text","value":" has its own "},{"type":"element","tag":"a","props":{"href":"https://github.com/invertase/react-native-apple-authentication/tree/main/docs","rel":["nofollow"]},"children":[{"type":"text","value":"documentation"}]},{"type":"text","value":" on setting up OAuth using Apple ID."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Use #oauth2 login with React-Native"}]},{"type":"element","tag":"h2","props":{"id":"common-oauth2-providers"},"children":[{"type":"text","value":"Common OAuth2 providers"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Can be handled by "},{"type":"element","tag":"a","props":{"href":"react-native-app-auth"},"children":[{"type":"text","value":"react-native-app-auth"}]},{"type":"text","value":" by redirecting to url "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"com.yourapp://oauth2provider"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h3","props":{"id":"example-for-google"},"children":[{"type":"text","value":"Example for #Google"}]},{"type":"element","tag":"code","props":{"code":"import { authorize } from 'react-native-app-auth';\n\nconst GOOGLE_OAUTH_CLIENT = '...';\n\n// ...\nconst authState = await authorize({\n issuer: 'https://accounts.google.com',\n clientId: `${GOOGLE_OAUTH_CLIENT}.apps.googleusercontent.com`,\n redirectUrl: `com.yourapp:/oauth2redirect/google`,\n scopes: ['openid', 'profile'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fcc1c9"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-7e1821"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-fcc1c9"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"'react-native-app-auth'"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-61e140"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"GOOGLE_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcc1c9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-066bc3"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-61e140"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"authState"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcc1c9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcc1c9"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d120b8"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" issuer: "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"'https://accounts.google.com'"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" clientId: "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"GOOGLE_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"}.apps.googleusercontent.com`"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" redirectUrl: "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"`com.yourapp:/oauth2redirect/google`"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" scopes: ["}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"'openid'"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"'profile'"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":"],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" dangerouslyAllowInsecureHttpRequests: "}]},{"type":"element","tag":"span","props":{"class":"ct-d8fab0"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":"});"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"example-for-yandex"},"children":[{"type":"text","value":"Example for #Yandex"}]},{"type":"element","tag":"code","props":{"code":"const YANDEX_OAUTH_CLIENT = '...';\nconst YANDEX_OAUTH_SECRET = '...'; // better hide it somehow\nconst APP_ID = 'com.yourapp';\n\nconst authState = await authorize({\n serviceConfiguration: {\n authorizationEndpoint: `https://oauth.yandex.ru/authorize?response_type=code&client_id=${YANDEX_OAUTH_CLIENT}&redirect_uri=${APP_ID}:/oauth2redirect`,\n // TODO: replace it with your own backend to secure client_secret:\n tokenEndpoint: `https://oauth.yandex.ru/token?grant_type=authorization_code&client_id=${YANDEX_OAUTH_CLIENT}&client_secret=${YANDEX_OAUTH_SECRET}`,\n },\n clientId: YANDEX_OAUTH_CLIENT,\n redirectUrl: `${APP_ID}:/oauth2redirect`,\n scopes: ['login:info', 'login:avatar'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n\ncallback(authState.accessToken);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-61e140"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcc1c9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-61e140"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"YANDEX_OAUTH_SECRET"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcc1c9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-066bc3"},"children":[{"type":"text","value":"// better hide it somehow"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-61e140"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"APP_ID"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcc1c9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"'com.yourapp'"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-61e140"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"authState"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcc1c9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcc1c9"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d120b8"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" serviceConfiguration: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" authorizationEndpoint: "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"`https://oauth.yandex.ru/authorize?response_type=code&client_id=${"}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"}&redirect_uri=${"}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"APP_ID"}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"}:/oauth2redirect`"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-066bc3"},"children":[{"type":"text","value":"// TODO: replace it with your own backend to secure client_secret:"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" tokenEndpoint: "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"`https://oauth.yandex.ru/token?grant_type=authorization_code&client_id=${"}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"}&client_secret=${"}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"YANDEX_OAUTH_SECRET"}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" clientId: "}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" redirectUrl: "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"APP_ID"}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"}:/oauth2redirect`"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" scopes: ["}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"'login:info'"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"'login:avatar'"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":"],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" dangerouslyAllowInsecureHttpRequests: "}]},{"type":"element","tag":"span","props":{"class":"ct-d8fab0"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":"});"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d120b8"},"children":[{"type":"text","value":"callback"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7e1821"},"children":[{"type":"text","value":"authState"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7e1821"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"apple-id-login"},"children":[{"type":"text","value":"Apple ID login"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/invertase/react-native-apple-authentication","rel":["nofollow"]},"children":[{"type":"text","value":"react-native-apple-authentication"}]},{"type":"text","value":" has its own "},{"type":"element","tag":"a","props":{"href":"https://github.com/invertase/react-native-apple-authentication/tree/main/docs","rel":["nofollow"]},"children":[{"type":"text","value":"documentation"}]},{"type":"text","value":" on setting up OAuth using Apple ID."}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-d8fab0{color:#79C0FF}.ct-d120b8{color:#D2A8FF}.ct-066bc3{color:#8B949E}.ct-9cb20b{color:#79C0FF}.ct-61e140{color:#FF7B72}.ct-536010{color:#A5D6FF}.ct-7e1821{color:#C9D1D9}.ct-43a365{color:#C9D1D9}.ct-fcc1c9{color:#FF7B72}.light .ct-fcc1c9{color:#859900}.light .ct-43a365{color:#657B83}.light .ct-7e1821{color:#268BD2}.light .ct-536010{color:#2AA198}.light .ct-61e140{color:#073642}.light .ct-9cb20b{color:#268BD2}.light .ct-066bc3{color:#93A1A1}.light .ct-d120b8{color:#268BD2}.light .ct-d8fab0{color:#B58900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"common-oauth2-providers","depth":2,"text":"Common OAuth2 providers","children":[{"id":"example-for-google","depth":3,"text":"Example for #Google"},{"id":"example-for-yandex","depth":3,"text":"Example for #Yandex"}]},{"id":"apple-id-login","depth":2,"text":"Apple ID login"}]}},"_type":"markdown","_id":"content:Frontend:React Native:OAuth2 login.md","_source":"content","_file":"Frontend/React Native/OAuth2 login.md","_extension":"md"},{"_path":"/frontend/react-native/preserve-flatlist-scroll-position-in-react-native","_dir":"react-native","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Preserve FlatList Scroll Position In React Native","description":"Sometimes you need to keep scroll position of FlatList in React Native after some user interactions.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you need to keep scroll position of "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"FlatList"}]},{"type":"text","value":" in React Native after some user interactions."}]},{"type":"element","tag":"code","props":{"code":"// interact() is doing some stuff, that changes FlatList scroll size\ntype Props = { interact: () => void; }\n\nconst SomeList: FC = ({ interact }) => {\n const scrollPosition = useRef(0);\n const scrollHeight = useRef(0);\n \n // set it to `true` before interaction and back to `false` right after\n const shouldKeepScrollPosition = useRef(false);\n\n const onScroll = useCallback(\n (event: NativeSyntheticEvent) => {\n scrollPosition.current = event.nativeEvent.contentOffset.y;\n },\n [],\n );\n\n const onContentSizeChange = useCallback((_: number, h: number) => {\n if (!shouldKeepScrollPosition.current) {\n scrollHeight.current = h;\n return;\n }\n\n ref.current?.scrollToOffset({\n offset: scrollPosition.current + (h - scrollHeight.current),\n animated: false,\n });\n\n scrollHeight.current = h;\n }, []);\n\n // onInteraction wraps interaction to preserve scroll position\n const onInteraction = useCallback(\n () => {\n shouldKeepScrollPosition.current = true;\n\n setTimeout(() => {\n interact();\n }, 0);\n\n setTimeout(() => {\n shouldKeepScrollPosition.current = false;\n }, 500);\n },\n [setSelectedSubThemes],\n );\n \n return (\n \n )\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// interact() is doing some stuff, that changes FlatList scroll size\ntype Props = { interact: () => void; }\n\nconst SomeList: FC = ({ interact }) => {\n const scrollPosition = useRef(0);\n const scrollHeight = useRef(0);\n \n // set it to `true` before interaction and back to `false` right after\n const shouldKeepScrollPosition = useRef(false);\n\n const onScroll = useCallback(\n (event: NativeSyntheticEvent) => {\n scrollPosition.current = event.nativeEvent.contentOffset.y;\n },\n [],\n );\n\n const onContentSizeChange = useCallback((_: number, h: number) => {\n if (!shouldKeepScrollPosition.current) {\n scrollHeight.current = h;\n return;\n }\n\n ref.current?.scrollToOffset({\n offset: scrollPosition.current + (h - scrollHeight.current),\n animated: false,\n });\n\n scrollHeight.current = h;\n }, []);\n\n // onInteraction wraps interaction to preserve scroll position\n const onInteraction = useCallback(\n () => {\n shouldKeepScrollPosition.current = true;\n\n setTimeout(() => {\n interact();\n }, 0);\n\n setTimeout(() => {\n shouldKeepScrollPosition.current = false;\n }, 500);\n },\n [setSelectedSubThemes],\n );\n \n return (\n \n )\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you need to keep scroll position of "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"FlatList"}]},{"type":"text","value":" in React Native after some user interactions."}]},{"type":"element","tag":"code","props":{"code":"// interact() is doing some stuff, that changes FlatList scroll size\ntype Props = { interact: () => void; }\n\nconst SomeList: FC = ({ interact }) => {\n const scrollPosition = useRef(0);\n const scrollHeight = useRef(0);\n \n // set it to `true` before interaction and back to `false` right after\n const shouldKeepScrollPosition = useRef(false);\n\n const onScroll = useCallback(\n (event: NativeSyntheticEvent) => {\n scrollPosition.current = event.nativeEvent.contentOffset.y;\n },\n [],\n );\n\n const onContentSizeChange = useCallback((_: number, h: number) => {\n if (!shouldKeepScrollPosition.current) {\n scrollHeight.current = h;\n return;\n }\n\n ref.current?.scrollToOffset({\n offset: scrollPosition.current + (h - scrollHeight.current),\n animated: false,\n });\n\n scrollHeight.current = h;\n }, []);\n\n // onInteraction wraps interaction to preserve scroll position\n const onInteraction = useCallback(\n () => {\n shouldKeepScrollPosition.current = true;\n\n setTimeout(() => {\n interact();\n }, 0);\n\n setTimeout(() => {\n shouldKeepScrollPosition.current = false;\n }, 500);\n },\n [setSelectedSubThemes],\n );\n \n return (\n \n )\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8b01d3"},"children":[{"type":"text","value":"// interact() is doing some stuff, that changes FlatList scroll size"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0920bc"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2a35fc"},"children":[{"type":"text","value":"Props"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-27f128"},"children":[{"type":"text","value":"interact"}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-0920bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-96b611"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"; }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-57abf7"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2333e8"},"children":[{"type":"text","value":"SomeList"}]},{"type":"element","tag":"span","props":{"class":"ct-f3fc59"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9684c2"},"children":[{"type":"text","value":"FC"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-9684c2"},"children":[{"type":"text","value":"Props"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-f3fc59"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" ({ "}]},{"type":"element","tag":"span","props":{"class":"ct-6a1dbc"},"children":[{"type":"text","value":"interact"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-57abf7"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0920bc"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f8e248"},"children":[{"type":"text","value":"scrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27f128"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c7d63c"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0920bc"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f8e248"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27f128"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c7d63c"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8b01d3"},"children":[{"type":"text","value":"// set it to `true` before interaction and back to `false` right after"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0920bc"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f8e248"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27f128"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c502a7"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0920bc"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f8e248"},"children":[{"type":"text","value":"onScroll"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27f128"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-6a1dbc"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-f3fc59"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9684c2"},"children":[{"type":"text","value":"NativeSyntheticEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-9684c2"},"children":[{"type":"text","value":"NativeScrollEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":">) "}]},{"type":"element","tag":"span","props":{"class":"ct-57abf7"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"scrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"nativeEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"contentOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"y"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" [],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-57abf7"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-75adcf"},"children":[{"type":"text","value":"onContentSizeChange"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f3fc59"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2333e8"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-6a1dbc"},"children":[{"type":"text","value":"_"}]},{"type":"element","tag":"span","props":{"class":"ct-f3fc59"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-628890"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6a1dbc"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-f3fc59"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-628890"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-57abf7"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"ref"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-27f128"},"children":[{"type":"text","value":"scrollToOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" offset: "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"scrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" animated: "}]},{"type":"element","tag":"span","props":{"class":"ct-c502a7"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" }, []);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8b01d3"},"children":[{"type":"text","value":"// onInteraction wraps interaction to preserve scroll position"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0920bc"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f8e248"},"children":[{"type":"text","value":"onInteraction"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27f128"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-0920bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c502a7"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f8e248"},"children":[{"type":"text","value":"setTimeout"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-0920bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27f128"},"children":[{"type":"text","value":"interact"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" }, "}]},{"type":"element","tag":"span","props":{"class":"ct-c7d63c"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f8e248"},"children":[{"type":"text","value":"setTimeout"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-0920bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c502a7"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" }, "}]},{"type":"element","tag":"span","props":{"class":"ct-c7d63c"},"children":[{"type":"text","value":"500"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"setSelectedSubThemes"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-459b98"},"children":[{"type":"text","value":"FlatList"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8b01d3"},"children":[{"type":"text","value":"// ...required FlatList options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"ref"}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"ref"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"onContentSizeChange"}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"onContentSizeChange"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"onRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"onRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"onScroll"}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"onScroll"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"/>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" )"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-459b98{color:#FFA657}.ct-628890{color:#79C0FF}.ct-75adcf{color:#79C0FF}.ct-592d02{color:#C9D1D9}.ct-c502a7{color:#79C0FF}.ct-c7d63c{color:#79C0FF}.ct-f8e248{color:#79C0FF}.ct-6a1dbc{color:#FFA657}.ct-9684c2{color:#FFA657}.ct-f3fc59{color:#FF7B72}.ct-2333e8{color:#D2A8FF}.ct-36565b{color:#C9D1D9}.ct-57abf7{color:#FF7B72}.ct-96b611{color:#79C0FF}.ct-27f128{color:#D2A8FF}.ct-6295d2{color:#FF7B72}.ct-2a35fc{color:#FFA657}.ct-691188{color:#C9D1D9}.ct-0920bc{color:#FF7B72}.ct-8b01d3{color:#8B949E}.light .ct-8b01d3{color:#93A1A1}.light .ct-0920bc{color:#073642}.light .ct-691188{color:#657B83}.light .ct-2a35fc{color:#268BD2}.light .ct-6295d2{color:#859900}.light .ct-27f128{color:#268BD2}.light .ct-96b611{color:#859900}.light .ct-57abf7{color:#073642}.light .ct-36565b{color:#657B83}.light .ct-2333e8{color:#268BD2}.light .ct-f3fc59{color:#859900}.light .ct-9684c2{color:#268BD2}.light .ct-6a1dbc{color:#657B83}.light .ct-f8e248{color:#268BD2}.light .ct-c7d63c{color:#D33682}.light .ct-c502a7{color:#B58900}.light .ct-592d02{color:#268BD2}.light .ct-75adcf{color:#268BD2}.light .ct-628890{color:#859900}.light .ct-459b98{color:#657B83}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:React Native:Preserve FlatList scroll position in React Native.md","_source":"content","_file":"Frontend/React Native/Preserve FlatList scroll position in React Native.md","_extension":"md"},{"_path":"/frontend/react-native/useful-comands","_dir":"react-native","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Useful Comands","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"show-android-logcat"},"children":[{"type":"text","value":"Show android logcat"}]},{"type":"element","tag":"code","props":{"code":"adb logcat com.application:I \"*:S\"\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"adb logcat com.application:I \"*:S\"\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"get-apks-sha-256"},"children":[{"type":"text","value":"Get .apk's SHA-256"}]},{"type":"element","tag":"code","props":{"code":"keytool -printcert -jarfile \"$1\"\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"keytool -printcert -jarfile \"$1\"\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"assemble-debug-release-on-android"},"children":[{"type":"text","value":"Assemble debug release on Android"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Packages release with bundled resources."}]},{"type":"element","tag":"code","props":{"code":"npx react-native bundle \\\n --platform android \\\n --dev false \\\n --entry-file index.js \\\n --bundle-output android/app/src/main/assets/index.android.bundle \\\n --assets-dest android/app/src/main/res/\n\ncd android && ./gradlew assembleDebug\n\n# do your stuff\n\n./gradlew clean\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"npx react-native bundle \\\n --platform android \\\n --dev false \\\n --entry-file index.js \\\n --bundle-output android/app/src/main/assets/index.android.bundle \\\n --assets-dest android/app/src/main/res/\n\ncd android && ./gradlew assembleDebug\n\n# do your stuff\n\n./gradlew clean\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"send-release-to-android-device"},"children":[{"type":"text","value":"Send release to Android device"}]},{"type":"element","tag":"code","props":{"code":"cd ./android \\\n && ./gradlew assembleRelease \\\n && adb install ./app/build/outputs/apk/release/app-release.apk\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"cd ./android \\\n && ./gradlew assembleRelease \\\n && adb install ./app/build/outputs/apk/release/app-release.apk\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"deep-links"},"children":[{"type":"text","value":"Deep links"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://zarah.dev/2022/02/08/android12-deeplinks.html","rel":["nofollow"]},"children":[{"type":"text","value":"https://zarah.dev/2022/02/08/android12-deeplinks.html"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://developer.android.com/training/app-links/verify-site-associations#invoke-domain-verification","rel":["nofollow"]},"children":[{"type":"text","value":"https://developer.android.com/training/app-links/verify-site-associations#invoke-domain-verification"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://digitalassetlinks.googleapis.com/v1/statements:list?source.web.site=https://miin.ru&relation=delegate_permission/common.handle_all_urls","rel":["nofollow"]},"children":[{"type":"text","value":"https://digitalassetlinks.googleapis.com/v1/statements:list?source.web.site=https://miin.ru&relation=delegate_permission/common.handle_all_urls"}]}]}]},{"type":"element","tag":"h3","props":{"id":"open-deep-links"},"children":[{"type":"text","value":"Open deep links"}]},{"type":"element","tag":"code","props":{"code":"# ios \nxcrun simctl openurl booted $1\n\n# android\nadb shell am start -W -a android.intent.action.VIEW -d $1 \\\ncom.application\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"# ios \nxcrun simctl openurl booted $1\n\n# android\nadb shell am start -W -a android.intent.action.VIEW -d $1 \\\ncom.application\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"reverify-links-on-android"},"children":[{"type":"text","value":"Reverify links on Android"}]},{"type":"element","tag":"code","props":{"code":"PACKAGE=\"com.application\"\n\nadb shell pm set-app-links --package $PACKAGE 0 all && \\\n adb shell pm verify-app-links --re-verify $PACKAGE\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"PACKAGE=\"com.application\"\n\nadb shell pm set-app-links --package $PACKAGE 0 all && \\\n adb shell pm verify-app-links --re-verify $PACKAGE\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"show-android-logcat"},"children":[{"type":"text","value":"Show android logcat"}]},{"type":"element","tag":"code","props":{"code":"adb logcat com.application:I \"*:S\"\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":"adb logcat com.application:I "}]},{"type":"element","tag":"span","props":{"class":"ct-ff9586"},"children":[{"type":"text","value":"\"*:S\""}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"get-apks-sha-256"},"children":[{"type":"text","value":"Get .apk's SHA-256"}]},{"type":"element","tag":"code","props":{"code":"keytool -printcert -jarfile \"$1\"\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":"keytool -printcert -jarfile "}]},{"type":"element","tag":"span","props":{"class":"ct-ff9586"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-5cb82a"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7e13bb"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-ff9586"},"children":[{"type":"text","value":"\""}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"assemble-debug-release-on-android"},"children":[{"type":"text","value":"Assemble debug release on Android"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Packages release with bundled resources."}]},{"type":"element","tag":"code","props":{"code":"npx react-native bundle \\\n --platform android \\\n --dev false \\\n --entry-file index.js \\\n --bundle-output android/app/src/main/assets/index.android.bundle \\\n --assets-dest android/app/src/main/res/\n\ncd android && ./gradlew assembleDebug\n\n# do your stuff\n\n./gradlew clean\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":"npx react-native bundle \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" --platform android \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" --dev "}]},{"type":"element","tag":"span","props":{"class":"ct-4e0208"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" --entry-file index.js \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" --bundle-output android/app/src/main/assets/index.android.bundle \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" --assets-dest android/app/src/main/res/"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e0208"},"children":[{"type":"text","value":"cd"}]},{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" android "}]},{"type":"element","tag":"span","props":{"class":"ct-1200ba"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" ./gradlew assembleDebug"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25c1b4"},"children":[{"type":"text","value":"# do your stuff"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":"./gradlew clean"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"send-release-to-android-device"},"children":[{"type":"text","value":"Send release to Android device"}]},{"type":"element","tag":"code","props":{"code":"cd ./android \\\n && ./gradlew assembleRelease \\\n && adb install ./app/build/outputs/apk/release/app-release.apk\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e0208"},"children":[{"type":"text","value":"cd"}]},{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" ./android \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1200ba"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" ./gradlew assembleRelease \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1200ba"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" adb install ./app/build/outputs/apk/release/app-release.apk"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"deep-links"},"children":[{"type":"text","value":"Deep links"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://zarah.dev/2022/02/08/android12-deeplinks.html","rel":["nofollow"]},"children":[{"type":"text","value":"https://zarah.dev/2022/02/08/android12-deeplinks.html"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://developer.android.com/training/app-links/verify-site-associations#invoke-domain-verification","rel":["nofollow"]},"children":[{"type":"text","value":"https://developer.android.com/training/app-links/verify-site-associations#invoke-domain-verification"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://digitalassetlinks.googleapis.com/v1/statements:list?source.web.site=https://miin.ru&relation=delegate_permission/common.handle_all_urls","rel":["nofollow"]},"children":[{"type":"text","value":"https://digitalassetlinks.googleapis.com/v1/statements:list?source.web.site=https://miin.ru&relation=delegate_permission/common.handle_all_urls"}]}]}]},{"type":"element","tag":"h3","props":{"id":"open-deep-links"},"children":[{"type":"text","value":"Open deep links"}]},{"type":"element","tag":"code","props":{"code":"# ios \nxcrun simctl openurl booted $1\n\n# android\nadb shell am start -W -a android.intent.action.VIEW -d $1 \\\ncom.application\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25c1b4"},"children":[{"type":"text","value":"# ios "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":"xcrun simctl openurl booted "}]},{"type":"element","tag":"span","props":{"class":"ct-5cb82a"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7e13bb"},"children":[{"type":"text","value":"1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25c1b4"},"children":[{"type":"text","value":"# android"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":"adb shell am start -W -a android.intent.action.VIEW -d "}]},{"type":"element","tag":"span","props":{"class":"ct-5cb82a"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7e13bb"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":"com.application"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"reverify-links-on-android"},"children":[{"type":"text","value":"Reverify links on Android"}]},{"type":"element","tag":"code","props":{"code":"PACKAGE=\"com.application\"\n\nadb shell pm set-app-links --package $PACKAGE 0 all && \\\n adb shell pm verify-app-links --re-verify $PACKAGE\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":"PACKAGE="}]},{"type":"element","tag":"span","props":{"class":"ct-ff9586"},"children":[{"type":"text","value":"\"com.application\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":"adb shell pm set-app-links --package "}]},{"type":"element","tag":"span","props":{"class":"ct-5cb82a"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7e13bb"},"children":[{"type":"text","value":"PACKAGE"}]},{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" 0 all "}]},{"type":"element","tag":"span","props":{"class":"ct-1200ba"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" adb shell pm verify-app-links --re-verify "}]},{"type":"element","tag":"span","props":{"class":"ct-5cb82a"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7e13bb"},"children":[{"type":"text","value":"PACKAGE"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-25c1b4{color:#8B949E}.ct-1200ba{color:#FF7B72}.ct-4e0208{color:#79C0FF}.ct-7e13bb{color:#C9D1D9}.ct-5cb82a{color:#C9D1D9}.ct-ff9586{color:#A5D6FF}.ct-af80c7{color:#C9D1D9}.light .ct-af80c7{color:#657B83}.light .ct-ff9586{color:#2AA198}.light .ct-5cb82a{color:#859900}.light .ct-7e13bb{color:#268BD2}.light .ct-4e0208{color:#268BD2}.light .ct-1200ba{color:#859900}.light .ct-25c1b4{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"show-android-logcat","depth":2,"text":"Show android logcat"},{"id":"get-apks-sha-256","depth":2,"text":"Get .apk's SHA-256"},{"id":"assemble-debug-release-on-android","depth":2,"text":"Assemble debug release on Android"},{"id":"send-release-to-android-device","depth":2,"text":"Send release to Android device"},{"id":"deep-links","depth":2,"text":"Deep links","children":[{"id":"open-deep-links","depth":3,"text":"Open deep links"},{"id":"reverify-links-on-android","depth":3,"text":"Reverify links on Android"}]}]}},"_type":"markdown","_id":"content:Frontend:React Native:Useful comands.md","_source":"content","_file":"Frontend/React Native/Useful comands.md","_extension":"md"},{"_path":"/frontend/react/axios-refresh-token-on-react","_dir":"react","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Axios Refresh Token On React","description":" component, that will handle token refresh if needed. Refresh function should, probably, be passed through component props.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":""}]},{"type":"text","value":" component, that will handle token refresh if needed. Refresh function should, probably, be passed through component props."}]},{"type":"element","tag":"code","props":{"code":"import axios from \"axios\";\nimport React, {\n createContext,\n FC,\n PropsWithChildren,\n useCallback,\n useContext,\n useEffect,\n useRef,\n} from \"react\";\n\ninterface APIProviderProps extends PropsWithChildren {\n tokens: {\n access: string;\n refresh: string;\n };\n logout: () => void;\n}\n\nconst APIContext = createContext({\n client: axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n }),\n});\n\nconst APIProvider: FC = ({ \n tokens, \n logout, \n children,\n}) => {\n const client = useRef(\n axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n })\n ).current;\n\n const refreshTokens = useCallback<() => string>(() => {\n // TODO: implement me\n throw new Error(\"not implemented\");\n }, []);\n\n useEffect(() => {\n if (!tokens.access) {\n return;\n }\n\n // append `access` token to all requests\n const req = client.interceptors.request.use(\n async (config) => {\n config.headers = {\n Authorization: `Bearer ${tokens.access}`,\n };\n return config;\n },\n (error) => {\n Promise.reject(error);\n }\n );\n\n // refreshing interceptor\n const resp = client.interceptors.response.use(\n (response) => {\n return response;\n },\n async function (error) {\n const originalRequest = error.config;\n\n if (error.response.status === 401 && !originalRequest._retry) {\n originalRequest._retry = true;\n\n const newToken = refreshTokens;\n\n return axios({\n ...originalRequest,\n headers: {\n ...originalRequest.headers,\n Authorization: \"Bearer \" + newToken,\n },\n });\n }\n\n logout();\n return Promise.reject(error);\n }\n );\n\n return () => {\n axios.interceptors.request.eject(req);\n axios.interceptors.request.eject(resp);\n };\n }, [client, tokens.access, tokens.refresh, refreshTokens, logout]);\n\n return (\n \n {children}\n \n );\n};\n\nexport const useAPI = () => useContext(APIContext).client;\n\nexport { APIProvider };\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import axios from \"axios\";\nimport React, {\n createContext,\n FC,\n PropsWithChildren,\n useCallback,\n useContext,\n useEffect,\n useRef,\n} from \"react\";\n\ninterface APIProviderProps extends PropsWithChildren {\n tokens: {\n access: string;\n refresh: string;\n };\n logout: () => void;\n}\n\nconst APIContext = createContext({\n client: axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n }),\n});\n\nconst APIProvider: FC = ({ \n tokens, \n logout, \n children,\n}) => {\n const client = useRef(\n axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n })\n ).current;\n\n const refreshTokens = useCallback<() => string>(() => {\n // TODO: implement me\n throw new Error(\"not implemented\");\n }, []);\n\n useEffect(() => {\n if (!tokens.access) {\n return;\n }\n\n // append `access` token to all requests\n const req = client.interceptors.request.use(\n async (config) => {\n config.headers = {\n Authorization: `Bearer ${tokens.access}`,\n };\n return config;\n },\n (error) => {\n Promise.reject(error);\n }\n );\n\n // refreshing interceptor\n const resp = client.interceptors.response.use(\n (response) => {\n return response;\n },\n async function (error) {\n const originalRequest = error.config;\n\n if (error.response.status === 401 && !originalRequest._retry) {\n originalRequest._retry = true;\n\n const newToken = refreshTokens;\n\n return axios({\n ...originalRequest,\n headers: {\n ...originalRequest.headers,\n Authorization: \"Bearer \" + newToken,\n },\n });\n }\n\n logout();\n return Promise.reject(error);\n }\n );\n\n return () => {\n axios.interceptors.request.eject(req);\n axios.interceptors.request.eject(resp);\n };\n }, [client, tokens.access, tokens.refresh, refreshTokens, logout]);\n\n return (\n \n {children}\n \n );\n};\n\nexport const useAPI = () => useContext(APIContext).client;\n\nexport { APIProvider };\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":""}]},{"type":"text","value":" component, that will handle token refresh if needed. Refresh function should, probably, be passed through component props."}]},{"type":"element","tag":"code","props":{"code":"import axios from \"axios\";\nimport React, {\n createContext,\n FC,\n PropsWithChildren,\n useCallback,\n useContext,\n useEffect,\n useRef,\n} from \"react\";\n\ninterface APIProviderProps extends PropsWithChildren {\n tokens: {\n access: string;\n refresh: string;\n };\n logout: () => void;\n}\n\nconst APIContext = createContext({\n client: axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n }),\n});\n\nconst APIProvider: FC = ({ \n tokens, \n logout, \n children,\n}) => {\n const client = useRef(\n axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n })\n ).current;\n\n const refreshTokens = useCallback<() => string>(() => {\n // TODO: implement me\n throw new Error(\"not implemented\");\n }, []);\n\n useEffect(() => {\n if (!tokens.access) {\n return;\n }\n\n // append `access` token to all requests\n const req = client.interceptors.request.use(\n async (config) => {\n config.headers = {\n Authorization: `Bearer ${tokens.access}`,\n };\n return config;\n },\n (error) => {\n Promise.reject(error);\n }\n );\n\n // refreshing interceptor\n const resp = client.interceptors.response.use(\n (response) => {\n return response;\n },\n async function (error) {\n const originalRequest = error.config;\n\n if (error.response.status === 401 && !originalRequest._retry) {\n originalRequest._retry = true;\n\n const newToken = refreshTokens;\n\n return axios({\n ...originalRequest,\n headers: {\n ...originalRequest.headers,\n Authorization: \"Bearer \" + newToken,\n },\n });\n }\n\n logout();\n return Promise.reject(error);\n }\n );\n\n return () => {\n axios.interceptors.request.eject(req);\n axios.interceptors.request.eject(resp);\n };\n }, [client, tokens.access, tokens.refresh, refreshTokens, logout]);\n\n return (\n \n {children}\n \n );\n};\n\nexport const useAPI = () => useContext(APIContext).client;\n\nexport { APIProvider };\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b5f116"},"children":[{"type":"text","value":"\"axios\""}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"React"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"createContext"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"FC"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"PropsWithChildren"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"useContext"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"} "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b5f116"},"children":[{"type":"text","value":"\"react\""}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-30e61a"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b2c705"},"children":[{"type":"text","value":"APIProviderProps"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-30e61a"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-855152"},"children":[{"type":"text","value":"PropsWithChildren"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9edd0f"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-7ae1e4"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9edd0f"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-7ae1e4"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c11ef6"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9edd0f"},"children":[{"type":"text","value":"refresh"}]},{"type":"element","tag":"span","props":{"class":"ct-7ae1e4"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c11ef6"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a583ad"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-58393f"},"children":[{"type":"text","value":"APIContext"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"createContext"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" client: "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"create"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" baseURL: "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"process"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"env"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-58393f"},"children":[{"type":"text","value":"NEXT_PUBLIC_API_ENDPOINT"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"});"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"APIProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b2d63"},"children":[{"type":"text","value":"FC"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-6b2d63"},"children":[{"type":"text","value":"APIProviderProps"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" ({ "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"children"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"}) "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-58393f"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"create"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" baseURL: "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"process"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"env"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-58393f"},"children":[{"type":"text","value":"NEXT_PUBLIC_API_ENDPOINT"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" )."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-58393f"},"children":[{"type":"text","value":"refreshTokens"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"<() "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a583ad"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":">(() "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-135b0e"},"children":[{"type":"text","value":"// TODO: implement me"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a583ad"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b5f116"},"children":[{"type":"text","value":"\"not implemented\""}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" }, []);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-135b0e"},"children":[{"type":"text","value":"// append `access` token to all requests"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-58393f"},"children":[{"type":"text","value":"req"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"use"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-30e61a"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-9edd0f"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-30e61a"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" Authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-b5f116"},"children":[{"type":"text","value":"`Bearer ${"}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-728c60"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-b5f116"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-9edd0f"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-30e61a"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a583ad"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-135b0e"},"children":[{"type":"text","value":"// refreshing interceptor"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-58393f"},"children":[{"type":"text","value":"resp"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"use"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-9edd0f"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-30e61a"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-30e61a"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-30e61a"},"children":[{"type":"text","value":"function"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-9edd0f"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-58393f"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"status"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5a5940"},"children":[{"type":"text","value":"401"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"_retry"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"_retry"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-353674"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-58393f"},"children":[{"type":"text","value":"newToken"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"refreshTokens"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" Authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-b5f116"},"children":[{"type":"text","value":"\"Bearer \""}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"newToken"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a583ad"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"eject"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"req"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"eject"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"resp"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" }, ["}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"refresh"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"refreshTokens"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"]);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"APIContext"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"Provider"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"{{ "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" }}"}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":">"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" {"}]},{"type":"element","tag":"span","props":{"class":"ct-9edd0f"},"children":[{"type":"text","value":"children"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"useAPI"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"useContext"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"APIContext"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"APIProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" };"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-353674{color:#79C0FF}.ct-5a5940{color:#79C0FF}.ct-728c60{color:#A5D6FF}.ct-135b0e{color:#8B949E}.ct-6b2d63{color:#FFA657}.ct-58393f{color:#79C0FF}.ct-a583ad{color:#79C0FF}.ct-07feb9{color:#FF7B72}.ct-21d2db{color:#D2A8FF}.ct-c11ef6{color:#79C0FF}.ct-7ae1e4{color:#FF7B72}.ct-9edd0f{color:#FFA657}.ct-855152{color:#79C0FF}.ct-b2c705{color:#FFA657}.ct-50c2af{color:#C9D1D9}.ct-30e61a{color:#FF7B72}.ct-b5f116{color:#A5D6FF}.ct-90fb8b{color:#C9D1D9}.ct-1c1ddb{color:#C9D1D9}.ct-65a859{color:#FF7B72}.light .ct-65a859{color:#859900}.light .ct-1c1ddb{color:#657B83}.light .ct-90fb8b{color:#268BD2}.light .ct-b5f116{color:#2AA198}.light .ct-30e61a{color:#073642}.light .ct-50c2af{color:#657B83}.light .ct-b2c705{color:#268BD2}.light .ct-855152{color:#657B83}.light .ct-9edd0f{color:#657B83}.light .ct-7ae1e4{color:#859900}.light .ct-c11ef6{color:#859900}.light .ct-21d2db{color:#268BD2}.light .ct-07feb9{color:#073642}.light .ct-a583ad{color:#859900}.light .ct-58393f{color:#268BD2}.light .ct-6b2d63{color:#268BD2}.light .ct-135b0e{color:#93A1A1}.light .ct-728c60{color:#657B83}.light .ct-5a5940{color:#D33682}.light .ct-353674{color:#B58900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:React:Axios refresh token on React.md","_source":"content","_file":"Frontend/React/Axios refresh token on React.md","_extension":"md"},{"_path":"/frontend/react/axios-with-abortcontroller","_dir":"react","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Axios With AbortController","description":"If you need to cancel some request, use axios with AbortController. Previously axios used cancellation token, but now it's deprecated.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If you need to cancel some request, use "},{"type":"element","tag":"a","props":{"href":"https://axios-http.com/docs/cancellation","rel":["nofollow"]},"children":[{"type":"text","value":"axios with AbortController"}]},{"type":"text","value":". Previously axios used cancellation token, but now it's deprecated."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"AbortController"}]},{"type":"text","value":" can be used with a multiple requests to cancel them at once."}]},{"type":"element","tag":"code","props":{"code":"import { useCallback, useRef } from \"react\";\nimport axios from 'axios';\n\nconst client = axios.create();\n\nexport const useGetUsers = () => {\n const controller = useRef(new AbortController());\n \n const get = useCallback(async () => {\n const result = await client.get(\"/\", {\n // params and props here\n signal: controller.current.signal,\n });\n\n return result.data;\n }, []);\n\n const cancel = useCallback(() => {\n controller.current.abort();\n \n // controller should be rewritten or all requests will fail\n controller.current = new AbortController();\n }, [controller]);\n\n return { get, cancel };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { useCallback, useRef } from \"react\";\nimport axios from 'axios';\n\nconst client = axios.create();\n\nexport const useGetUsers = () => {\n const controller = useRef(new AbortController());\n \n const get = useCallback(async () => {\n const result = await client.get(\"/\", {\n // params and props here\n signal: controller.current.signal,\n });\n\n return result.data;\n }, []);\n\n const cancel = useCallback(() => {\n controller.current.abort();\n \n // controller should be rewritten or all requests will fail\n controller.current = new AbortController();\n }, [controller]);\n\n return { get, cancel };\n};\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If you need to cancel some request, use "},{"type":"element","tag":"a","props":{"href":"https://axios-http.com/docs/cancellation","rel":["nofollow"]},"children":[{"type":"text","value":"axios with AbortController"}]},{"type":"text","value":". Previously axios used cancellation token, but now it's deprecated."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"AbortController"}]},{"type":"text","value":" can be used with a multiple requests to cancel them at once."}]},{"type":"element","tag":"code","props":{"code":"import { useCallback, useRef } from \"react\";\nimport axios from 'axios';\n\nconst client = axios.create();\n\nexport const useGetUsers = () => {\n const controller = useRef(new AbortController());\n \n const get = useCallback(async () => {\n const result = await client.get(\"/\", {\n // params and props here\n signal: controller.current.signal,\n });\n\n return result.data;\n }, []);\n\n const cancel = useCallback(() => {\n controller.current.abort();\n \n // controller should be rewritten or all requests will fail\n controller.current = new AbortController();\n }, [controller]);\n\n return { get, cancel };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d31196"},"children":[{"type":"text","value":"\"react\""}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d31196"},"children":[{"type":"text","value":"'axios'"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-080c78"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fdde86"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b05c66"},"children":[{"type":"text","value":"create"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-080c78"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b05c66"},"children":[{"type":"text","value":"useGetUsers"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-080c78"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-080c78"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fdde86"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b05c66"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b05c66"},"children":[{"type":"text","value":"AbortController"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"());"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-080c78"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fdde86"},"children":[{"type":"text","value":"get"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b05c66"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-080c78"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-080c78"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-080c78"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fdde86"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b05c66"},"children":[{"type":"text","value":"get"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d31196"},"children":[{"type":"text","value":"\"/\""}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-964aa7"},"children":[{"type":"text","value":"// params and props here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" signal: "}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"signal"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" }, []);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-080c78"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fdde86"},"children":[{"type":"text","value":"cancel"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b05c66"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-080c78"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b05c66"},"children":[{"type":"text","value":"abort"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-964aa7"},"children":[{"type":"text","value":"// controller should be rewritten or all requests will fail"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b05c66"},"children":[{"type":"text","value":"AbortController"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" }, ["}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"]);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"get"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"cancel"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-964aa7{color:#8B949E}.ct-b05c66{color:#D2A8FF}.ct-fdde86{color:#79C0FF}.ct-080c78{color:#FF7B72}.ct-d31196{color:#A5D6FF}.ct-b5803b{color:#C9D1D9}.ct-5512bc{color:#C9D1D9}.ct-6d2f6e{color:#FF7B72}.light .ct-6d2f6e{color:#859900}.light .ct-5512bc{color:#657B83}.light .ct-b5803b{color:#268BD2}.light .ct-d31196{color:#2AA198}.light .ct-080c78{color:#073642}.light .ct-fdde86{color:#268BD2}.light .ct-b05c66{color:#268BD2}.light .ct-964aa7{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:React:Axios with AbortController.md","_source":"content","_file":"Frontend/React/Axios with AbortController.md","_extension":"md"},{"_path":"/frontend/react/detect-hook-deps-changes-with-usewhatschanged","_dir":"react","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Detect Hook Deps Changes With UseWhatsChanged","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"code","props":{"code":"import { useEffect, useRef } from 'react';\n\n/** Pass dictionary of `props` as argument and it will\n * tell you, which one changed after rerender.\n * Use `prefix` to distinguish props of different components.\n */\nexport const useWhatsChanged = (\n props: Record,\n prefix = '',\n) => {\n const prevProps = useRef(props);\n\n useEffect(() => {\n Object.entries(props).forEach(([key, value]) => {\n if (\n !Object.prototype.hasOwnProperty.call(prevProps.current, key) ||\n prevProps.current[key] !== value\n ) {\n console.log(`${prefix} ${key} has changed`);\n }\n });\n\n prevProps.current = props;\n }, [props, prefix]);\n};\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { useEffect, useRef } from 'react';\n\n/** Pass dictionary of `props` as argument and it will\n * tell you, which one changed after rerender.\n * Use `prefix` to distinguish props of different components.\n */\nexport const useWhatsChanged = (\n props: Record,\n prefix = '',\n) => {\n const prevProps = useRef(props);\n\n useEffect(() => {\n Object.entries(props).forEach(([key, value]) => {\n if (\n !Object.prototype.hasOwnProperty.call(prevProps.current, key) ||\n prevProps.current[key] !== value\n ) {\n console.log(`${prefix} ${key} has changed`);\n }\n });\n\n prevProps.current = props;\n }, [props, prefix]);\n};\n\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"code","props":{"code":"import { useEffect, useRef } from 'react';\n\n/** Pass dictionary of `props` as argument and it will\n * tell you, which one changed after rerender.\n * Use `prefix` to distinguish props of different components.\n */\nexport const useWhatsChanged = (\n props: Record,\n prefix = '',\n) => {\n const prevProps = useRef(props);\n\n useEffect(() => {\n Object.entries(props).forEach(([key, value]) => {\n if (\n !Object.prototype.hasOwnProperty.call(prevProps.current, key) ||\n prevProps.current[key] !== value\n ) {\n console.log(`${prefix} ${key} has changed`);\n }\n });\n\n prevProps.current = props;\n }, [props, prefix]);\n};\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b27501"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-b27501"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-851537"},"children":[{"type":"text","value":"'react'"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e9884"},"children":[{"type":"text","value":"/** Pass dictionary of `props` as argument and it will"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e9884"},"children":[{"type":"text","value":" * tell you, which one changed after rerender."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e9884"},"children":[{"type":"text","value":" * Use `prefix` to distinguish props of different components."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e9884"},"children":[{"type":"text","value":" */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b27501"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b5989a"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3b4b35"},"children":[{"type":"text","value":"useWhatsChanged"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b27501"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d4c992"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ab123e"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-0a753e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-d4c992"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b30c00"},"children":[{"type":"text","value":"Record"}]},{"type":"element","tag":"span","props":{"class":"ct-d4c992"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-989f48"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-d4c992"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-989f48"},"children":[{"type":"text","value":"unknown"}]},{"type":"element","tag":"span","props":{"class":"ct-d4c992"},"children":[{"type":"text","value":">,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"prefix"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b27501"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-851537"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-b5989a"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b5989a"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0c4f6c"},"children":[{"type":"text","value":"prevProps"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b27501"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3b4b35"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3b4b35"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-b5989a"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d4c992"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-989f48"},"children":[{"type":"text","value":"Object"}]},{"type":"element","tag":"span","props":{"class":"ct-d4c992"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-641741"},"children":[{"type":"text","value":"entries"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b27501"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"prevProps"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":"] "}]},{"type":"element","tag":"span","props":{"class":"ct-b27501"},"children":[{"type":"text","value":"!=="}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"value"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-3b4b35"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-851537"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"prefix"}]},{"type":"element","tag":"span","props":{"class":"ct-851537"},"children":[{"type":"text","value":"} ${"}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-851537"},"children":[{"type":"text","value":"} has changed`"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"prevProps"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b27501"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" }, ["}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"prefix"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":"]);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-641741{color:#D2A8FF}.ct-0c4f6c{color:#79C0FF}.ct-989f48{color:#79C0FF}.ct-b30c00{color:#FFA657}.ct-0a753e{color:#FF7B72}.ct-ab123e{color:#FFA657}.ct-d4c992{color:#C9D1D9}.ct-3b4b35{color:#D2A8FF}.ct-b5989a{color:#FF7B72}.ct-1e9884{color:#8B949E}.ct-851537{color:#A5D6FF}.ct-e40149{color:#C9D1D9}.ct-b1d28d{color:#C9D1D9}.ct-b27501{color:#FF7B72}.light .ct-b27501{color:#859900}.light .ct-b1d28d{color:#657B83}.light .ct-e40149{color:#268BD2}.light .ct-851537{color:#2AA198}.light .ct-1e9884{color:#93A1A1}.light .ct-b5989a{color:#073642}.light .ct-3b4b35{color:#268BD2}.light .ct-d4c992{color:#657B83}.light .ct-ab123e{color:#657B83}.light .ct-0a753e{color:#859900}.light .ct-b30c00{color:#268BD2}.light .ct-989f48{color:#859900}.light .ct-0c4f6c{color:#268BD2}.light .ct-641741{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:React:Detect hook deps changes with useWhatsChanged.md","_source":"content","_file":"Frontend/React/Detect hook deps changes with useWhatsChanged.md","_extension":"md"},{"_path":"/frontend/vue/adding-global-properties-to-component","_dir":"vue","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Adding Global Properties To Component","description":"The topic's fully covered in the official documentation and in Add global variable to window.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The topic's fully covered in the "},{"type":"element","tag":"a","props":{"href":"https://vuejs.org/guide/typescript/options-api.html#augmenting-global-properties","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]},{"type":"text","value":" and in "},{"type":"element","tag":"a","props":{"href":"Add%20global%20variable%20to%20window"},"children":[{"type":"text","value":"Add global variable to window"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For example, you want to add global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$http"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$translate"}]},{"type":"text","value":" services to all of project's components:"}]},{"type":"element","tag":"code","props":{"code":"// ~/index.d.ts or ~/custom.d.ts\n\nimport axios from 'axios'\n\ndeclare module 'vue' {\n interface ComponentCustomProperties {\n $http: typeof axios\n $translate: (key: string) => string\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// ~/index.d.ts or ~/custom.d.ts\n\nimport axios from 'axios'\n\ndeclare module 'vue' {\n interface ComponentCustomProperties {\n $http: typeof axios\n $translate: (key: string) => string\n }\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The topic's fully covered in the "},{"type":"element","tag":"a","props":{"href":"https://vuejs.org/guide/typescript/options-api.html#augmenting-global-properties","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]},{"type":"text","value":" and in "},{"type":"element","tag":"a","props":{"href":"Add%20global%20variable%20to%20window"},"children":[{"type":"text","value":"Add global variable to window"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For example, you want to add global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$http"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$translate"}]},{"type":"text","value":" services to all of project's components:"}]},{"type":"element","tag":"code","props":{"code":"// ~/index.d.ts or ~/custom.d.ts\n\nimport axios from 'axios'\n\ndeclare module 'vue' {\n interface ComponentCustomProperties {\n $http: typeof axios\n $translate: (key: string) => string\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b7b0cd"},"children":[{"type":"text","value":"// ~/index.d.ts or ~/custom.d.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e981e0"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f07ca9"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e981e0"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61f814"},"children":[{"type":"text","value":"'axios'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-537f3d"},"children":[{"type":"text","value":"declare"}]},{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-537f3d"},"children":[{"type":"text","value":"module"}]},{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61f814"},"children":[{"type":"text","value":"'vue'"}]},{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-537f3d"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c625"},"children":[{"type":"text","value":"ComponentCustomProperties"}]},{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-86544a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-33e5c2"},"children":[{"type":"text","value":"$translate"}]},{"type":"element","tag":"span","props":{"class":"ct-d5befa"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-86544a"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-d8377e"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-d5befa"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-86544a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d4f523"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-86544a"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-f0c8cd"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-86544a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d4f523"},"children":[{"type":"text","value":"string"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-f0c8cd{color:#FF7B72}.ct-d4f523{color:#79C0FF}.ct-d8377e{color:#FFA657}.ct-d5befa{color:#FF7B72}.ct-33e5c2{color:#D2A8FF}.ct-86544a{color:#C9D1D9}.ct-d5c625{color:#FFA657}.ct-537f3d{color:#FF7B72}.ct-61f814{color:#A5D6FF}.ct-f07ca9{color:#C9D1D9}.ct-a07843{color:#C9D1D9}.ct-e981e0{color:#FF7B72}.ct-b7b0cd{color:#8B949E}.light .ct-b7b0cd{color:#93A1A1}.light .ct-e981e0{color:#859900}.light .ct-a07843{color:#657B83}.light .ct-f07ca9{color:#268BD2}.light .ct-61f814{color:#2AA198}.light .ct-537f3d{color:#073642}.light .ct-d5c625{color:#268BD2}.light .ct-86544a{color:#657B83}.light .ct-33e5c2{color:#268BD2}.light .ct-d5befa{color:#859900}.light .ct-d8377e{color:#657B83}.light .ct-d4f523{color:#859900}.light .ct-f0c8cd{color:#073642}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:Vue:Adding global properties to component.md","_source":"content","_file":"Frontend/Vue/Adding global properties to component.md","_extension":"md"},{"_path":"/frontend/vue/make-nuxt-handle-obsidian-highlights","_dir":"vue","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Make Nuxt Handle Obsidian Highlights","description":"By default Nuxt Content Plugin not handling highlight links. To fix that we will create Nitro plugin:","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"By default "},{"type":"element","tag":"a","props":{"href":"https://content.nuxtjs.org","rel":["nofollow"]},"children":[{"type":"text","value":"Nuxt Content Plugin"}]},{"type":"text","value":" not handling "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"highlight"}]},{"type":"text","value":" links. To fix that we will create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Nitro"}]},{"type":"text","value":" plugin:"}]},{"type":"element","tag":"code","props":{"code":"// ~/server/plugins/highlight.ts\nexport default defineNitroPlugin((nitroApp) => {\n nitroApp.hooks.hook(\"content:file:beforeParse\", (file) => {\n if (file._id.endsWith(\".md\")) {\n file.body = file.body.replace(\n /==([^=]+)==/gs,\n `$1`\n );\n }\n });\n});\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// ~/server/plugins/highlight.ts\nexport default defineNitroPlugin((nitroApp) => {\n nitroApp.hooks.hook(\"content:file:beforeParse\", (file) => {\n if (file._id.endsWith(\".md\")) {\n file.body = file.body.replace(\n /==([^=]+)==/gs,\n `$1`\n );\n }\n });\n});\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"By default "},{"type":"element","tag":"a","props":{"href":"https://content.nuxtjs.org","rel":["nofollow"]},"children":[{"type":"text","value":"Nuxt Content Plugin"}]},{"type":"text","value":" not handling "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"highlight"}]},{"type":"text","value":" links. To fix that we will create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Nitro"}]},{"type":"text","value":" plugin:"}]},{"type":"element","tag":"code","props":{"code":"// ~/server/plugins/highlight.ts\nexport default defineNitroPlugin((nitroApp) => {\n nitroApp.hooks.hook(\"content:file:beforeParse\", (file) => {\n if (file._id.endsWith(\".md\")) {\n file.body = file.body.replace(\n /==([^=]+)==/gs,\n `$1`\n );\n }\n });\n});\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-04ca08"},"children":[{"type":"text","value":"// ~/server/plugins/highlight.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bbd172"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-0a5bed"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bbd172"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-0a5bed"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3ce9f3"},"children":[{"type":"text","value":"defineNitroPlugin"}]},{"type":"element","tag":"span","props":{"class":"ct-0a5bed"},"children":[{"type":"text","value":"((nitroApp) "}]},{"type":"element","tag":"span","props":{"class":"ct-441e0e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-0a5bed"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06a11a"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0942f1"},"children":[{"type":"text","value":"nitroApp"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-0942f1"},"children":[{"type":"text","value":"hooks"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2a60cf"},"children":[{"type":"text","value":"hook"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-206e54"},"children":[{"type":"text","value":"\"content:file:beforeParse\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c10891"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-0942f1"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-0942f1"},"children":[{"type":"text","value":"_id"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2a60cf"},"children":[{"type":"text","value":"endsWith"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-206e54"},"children":[{"type":"text","value":"\".md\""}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0942f1"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-0942f1"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c10891"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0942f1"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-0942f1"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2a60cf"},"children":[{"type":"text","value":"replace"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6dc7d7"},"children":[{"type":"text","value":"/==("}]},{"type":"element","tag":"span","props":{"class":"ct-58c87b"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-c10891"},"children":[{"type":"text","value":"^"}]},{"type":"element","tag":"span","props":{"class":"ct-58c87b"},"children":[{"type":"text","value":"=]"}]},{"type":"element","tag":"span","props":{"class":"ct-c10891"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-6dc7d7"},"children":[{"type":"text","value":")==/"}]},{"type":"element","tag":"span","props":{"class":"ct-c10891"},"children":[{"type":"text","value":"gs"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-206e54"},"children":[{"type":"text","value":"`$1`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-06a11a"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-0a5bed"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-06a11a"},"children":[{"type":"text","value":";"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-58c87b{color:#79C0FF}.ct-6dc7d7{color:#A5D6FF}.ct-c10891{color:#FF7B72}.ct-206e54{color:#A5D6FF}.ct-2a60cf{color:#D2A8FF}.ct-0942f1{color:#C9D1D9}.ct-e30717{color:#C9D1D9}.ct-06a11a{color:#C9D1D9}.ct-441e0e{color:#FF7B72}.ct-3ce9f3{color:#D2A8FF}.ct-0a5bed{color:#FFA657}.ct-bbd172{color:#FF7B72}.ct-04ca08{color:#8B949E}.light .ct-04ca08{color:#93A1A1}.light .ct-bbd172{color:#859900}.light .ct-0a5bed{color:#657B83}.light .ct-3ce9f3{color:#268BD2}.light .ct-441e0e{color:#073642}.light .ct-06a11a{color:#657B83}.light .ct-e30717{color:#657B83}.light .ct-0942f1{color:#268BD2}.light .ct-2a60cf{color:#268BD2}.light .ct-206e54{color:#2AA198}.light .ct-c10891{color:#859900}.light .ct-6dc7d7{color:#D30102}.light .ct-58c87b{color:#CB4B16}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:Vue:Make Nuxt handle Obsidian highlights.md","_source":"content","_file":"Frontend/Vue/Make Nuxt handle Obsidian highlights.md","_extension":"md"},{"_path":"/frontend/webgl/basics-of-webgl-(drawing-a-cube)","_dir":"webgl","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Basics Of WebGL (Drawing A Cube)","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"helpful-documentation"},"children":[{"type":"text","value":"Helpful documentation"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://open.gl/","rel":["nofollow"]},"children":[{"type":"text","value":"https://open.gl/"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"This youtube series: "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=kB0ZVUrI4Aw","rel":["nofollow"]},"children":[{"type":"text","value":"Basics"}]},{"type":"text","value":", "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=3yLL9ADo-ko","rel":["nofollow"]},"children":[{"type":"text","value":"Making a cube, applying transformations"}]},{"type":"text","value":", "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=hpnd11doMgc&t=52s","rel":["nofollow"]},"children":[{"type":"text","value":"Texturing"}]}]}]},{"type":"element","tag":"h2","props":{"id":"vertices-and-indices"},"children":[{"type":"text","value":"Vertices and Indices"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertices"}]},{"type":"text","value":" are points with specific coordinates "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"{x,y,z}"}]},{"type":"text","value":" in a 3D-space. We can build any figure by connecting "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"vertices"}]},{"type":"text","value":" in triangles with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"indices"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"shaders"},"children":[{"type":"text","value":"Shaders"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shaders are functions, written in C, which describe how to draw and color polygons to Graphic Card."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" describe "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"vertice"}]},{"type":"text","value":" positions, so Graphic Card can position them by connecting with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"indices"}]},{"type":"text","value":" and project to 2D canvas."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" describe the way polygons should be colored by assigning colors to Vertices or by applying textures to polygons."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shaders can have parameters passed from Javascript code ("},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniforms"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"attributes"}]},{"type":"text","value":"). "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" can also access data from "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" (that ones called "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":")."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"img","props":{"alt":"","src":"https://open.gl/media/img/c2_pipeline.png"},"children":[]}]},{"type":"element","tag":"h2","props":{"id":"program"},"children":[{"type":"text","value":"Program"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Program, as far as I understand, is a scene, that's described with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertices"}]},{"type":"text","value":", "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Indices"}]},{"type":"text","value":", specific "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" and "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"applying-transformations"},"children":[{"type":"text","value":"Applying transformations"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The best way to change positions inside "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" or color in "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" is to pass parameters (also called "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniforms"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":")."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read about that at "},{"type":"element","tag":"a","props":{"href":"https://open.gl/transformations","rel":["nofollow"]},"children":[{"type":"text","value":"open.gl"}]},{"type":"text","value":" and at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"source-code-with-explanations"},"children":[{"type":"text","value":"Source code with explanations"}]},{"type":"element","tag":"code","props":{"code":"// render-a-cube.ts\nimport { createShader } from \"./create-shader\";\nimport vxShader from \"./vertex.glsl?raw\";\nimport fgShader from \"./fragment.glsl?raw\";\n\nconst canvas = document.getElementyId('view');\nconst ctx = canvas.getRenderingContext('webgl');\n\n// should be put inside requestAnimationFrame\ndrawCube(ctx)(); \n\nfunction drawCube (\n gl: WebGL2RenderingContext, \n width: number,\n height: number\n) {\n // Initializing viewport\n gl.viewport(0, 0, width, height);\n gl.clearColor(0, 0, 0, 0);\n gl.clear(gl.COLOR_BUFFER_BIT);\n\n const prg = gl.createProgram();\n if (!prg) {\n throw new Error(\"Can't init programm\");\n }\n\n // Setting up VERTEX and FRAGMENT shaders\n const vx = createShader(gl, vxShader, gl.VERTEX_SHADER);\n gl.attachShader(prg, vx);\n const fx = createShader(gl, fgShader, gl.FRAGMENT_SHADER);\n gl.attachShader(prg, fx);\n gl.linkProgram(prg);\n if (!gl.getProgramParameter(prg, gl.LINK_STATUS)) {\n throw new Error(\"Could not initialise shaders\");\n }\n\n // Cube's vertices Array<[x,y,z]>, 8 items\n const vertices = [\n -1, -1, -1, // 0\n 1, -1, -1, // 1\n 1, 1, -1, // 2\n -1, 1, -1, // 3\n -1, -1, 1, // 4\n 1, -1, 1, // 5\n 1, 1, 1, // 6\n -1, 1, 1, // 7\n ];\n\n // indices, that form triangles, that form cube sides\n const indices = [\n 2, 1, 0, // side 0 (first triangle)\n 0, 3, 2, // side 0 (second triangle)\n 0, 4, 7, // side 1 (first triangle)\n 7, 3, 0, // side 1 (second triangle)\n 0, 1, 5, // ...\n 5, 4, 0, \n 1, 2, 6, \n 6, 5, 1, \n 2, 3, 7, \n 7, 6, 2, \n 4, 5, 6, \n 6, 7, 4,\n ];\n\n // createe a vertex buffer and bind vertices to it\n const squareVertexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);\n gl.bindBuffer(gl.ARRAY_BUFFER, null);\n\n // create a vertex buffer and bind indices to it\n const squareIndexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, squareIndexBuffer);\n gl.bufferData(\n gl.ELEMENT_ARRAY_BUFFER,\n new Uint16Array(indices),\n gl.STATIC_DRAW\n );\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, null);\n\n // initial drawing\n gl.clearColor(0.0, 0.0, 0.0, 0.0);\n gl.enable(gl.DEPTH_TEST);\n gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);\n gl.viewport(0, 0, width, height);\n\n // bind squareVertexBuffer as vertex positions buffer\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n \n // send every 3 bytes from squareVertexBuffer as {x,y,z} for each verticle\n gl.vertexAttribPointer(\n gl.getAttribLocation(prg, \"aVertexPosition\"), \n 3, // 3 bytes-long\n gl.FLOAT,\n false, // don't normalize (int to float)\n 0, \n 0\n );\n // send vertice buffer as `aVertexPosition` attribute inside vertex shader\n gl.enableVertexAttribArray(\n gl.getAttribLocation(prg, \"aVertexPosition\")\n );\n\n let i = 0;\n let speed = 0.01;\n\n // that's the main rendering callback\n return () => {\n gl.useProgram(prg);\n\n const scale = i * 0.25 + 0.25;\n\n // used for scaling inside Vertex Shader\n gl.uniform1f(gl.getUniformLocation(prg, \"slide\"), scale);\n // GL Screen is square, so we need to fix it's aspect ration\n gl.uniform1f(gl.getUniformLocation(prg, \"aspect\"), height / width);\n\n gl.bindBuffer(\n gl.ELEMENT_ARRAY_BUFFER, \n squareIndexBuffer\n );\n \n gl.drawElements(\n gl.TRIANGLES, \n indices.length, \n gl.UNSIGNED_SHORT, \n 0,\n );\n\n if (i > 1 || i < 0) {\n speed = -speed;\n }\n\n i += speed;\n };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// render-a-cube.ts\nimport { createShader } from \"./create-shader\";\nimport vxShader from \"./vertex.glsl?raw\";\nimport fgShader from \"./fragment.glsl?raw\";\n\nconst canvas = document.getElementyId('view');\nconst ctx = canvas.getRenderingContext('webgl');\n\n// should be put inside requestAnimationFrame\ndrawCube(ctx)(); \n\nfunction drawCube (\n gl: WebGL2RenderingContext, \n width: number,\n height: number\n) {\n // Initializing viewport\n gl.viewport(0, 0, width, height);\n gl.clearColor(0, 0, 0, 0);\n gl.clear(gl.COLOR_BUFFER_BIT);\n\n const prg = gl.createProgram();\n if (!prg) {\n throw new Error(\"Can't init programm\");\n }\n\n // Setting up VERTEX and FRAGMENT shaders\n const vx = createShader(gl, vxShader, gl.VERTEX_SHADER);\n gl.attachShader(prg, vx);\n const fx = createShader(gl, fgShader, gl.FRAGMENT_SHADER);\n gl.attachShader(prg, fx);\n gl.linkProgram(prg);\n if (!gl.getProgramParameter(prg, gl.LINK_STATUS)) {\n throw new Error(\"Could not initialise shaders\");\n }\n\n // Cube's vertices Array<[x,y,z]>, 8 items\n const vertices = [\n -1, -1, -1, // 0\n 1, -1, -1, // 1\n 1, 1, -1, // 2\n -1, 1, -1, // 3\n -1, -1, 1, // 4\n 1, -1, 1, // 5\n 1, 1, 1, // 6\n -1, 1, 1, // 7\n ];\n\n // indices, that form triangles, that form cube sides\n const indices = [\n 2, 1, 0, // side 0 (first triangle)\n 0, 3, 2, // side 0 (second triangle)\n 0, 4, 7, // side 1 (first triangle)\n 7, 3, 0, // side 1 (second triangle)\n 0, 1, 5, // ...\n 5, 4, 0, \n 1, 2, 6, \n 6, 5, 1, \n 2, 3, 7, \n 7, 6, 2, \n 4, 5, 6, \n 6, 7, 4,\n ];\n\n // createe a vertex buffer and bind vertices to it\n const squareVertexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);\n gl.bindBuffer(gl.ARRAY_BUFFER, null);\n\n // create a vertex buffer and bind indices to it\n const squareIndexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, squareIndexBuffer);\n gl.bufferData(\n gl.ELEMENT_ARRAY_BUFFER,\n new Uint16Array(indices),\n gl.STATIC_DRAW\n );\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, null);\n\n // initial drawing\n gl.clearColor(0.0, 0.0, 0.0, 0.0);\n gl.enable(gl.DEPTH_TEST);\n gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);\n gl.viewport(0, 0, width, height);\n\n // bind squareVertexBuffer as vertex positions buffer\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n \n // send every 3 bytes from squareVertexBuffer as {x,y,z} for each verticle\n gl.vertexAttribPointer(\n gl.getAttribLocation(prg, \"aVertexPosition\"), \n 3, // 3 bytes-long\n gl.FLOAT,\n false, // don't normalize (int to float)\n 0, \n 0\n );\n // send vertice buffer as `aVertexPosition` attribute inside vertex shader\n gl.enableVertexAttribArray(\n gl.getAttribLocation(prg, \"aVertexPosition\")\n );\n\n let i = 0;\n let speed = 0.01;\n\n // that's the main rendering callback\n return () => {\n gl.useProgram(prg);\n\n const scale = i * 0.25 + 0.25;\n\n // used for scaling inside Vertex Shader\n gl.uniform1f(gl.getUniformLocation(prg, \"slide\"), scale);\n // GL Screen is square, so we need to fix it's aspect ration\n gl.uniform1f(gl.getUniformLocation(prg, \"aspect\"), height / width);\n\n gl.bindBuffer(\n gl.ELEMENT_ARRAY_BUFFER, \n squareIndexBuffer\n );\n \n gl.drawElements(\n gl.TRIANGLES, \n indices.length, \n gl.UNSIGNED_SHORT, \n 0,\n );\n\n if (i > 1 || i < 0) {\n speed = -speed;\n }\n\n i += speed;\n };\n};\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"shader-compiler"},"children":[{"type":"text","value":"Shader compiler"}]},{"type":"element","tag":"code","props":{"code":"// create-shader.ts\nexport const createShader = (\n gl: WebGL2RenderingContext,\n sourceCode: string,\n type: number, // gl.VERTEX_SHADER or gl.FRAGMENT_SHADER\n) => {\n const shader = gl.createShader(type);\n if (!shader) {\n throw new Error(`Can't init shader`);\n }\n\n gl.shaderSource(shader, sourceCode);\n gl.compileShader(shader);\n\n if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {\n const info = gl.getShaderInfoLog(shader);\n throw `Could not compile WebGL program. \\n\\n${info}`;\n }\n\n return shader;\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// create-shader.ts\nexport const createShader = (\n gl: WebGL2RenderingContext,\n sourceCode: string,\n type: number, // gl.VERTEX_SHADER or gl.FRAGMENT_SHADER\n) => {\n const shader = gl.createShader(type);\n if (!shader) {\n throw new Error(`Can't init shader`);\n }\n\n gl.shaderSource(shader, sourceCode);\n gl.compileShader(shader);\n\n if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {\n const info = gl.getShaderInfoLog(shader);\n throw `Could not compile WebGL program. \\n\\n${info}`;\n }\n\n return shader;\n};\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"vertex-shader-example"},"children":[{"type":"text","value":"Vertex Shader Example"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read more at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]}]},{"type":"element","tag":"code","props":{"code":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"fragment-shader-example"},"children":[{"type":"text","value":"Fragment Shader Example"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read more at "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"helpful-documentation"},"children":[{"type":"text","value":"Helpful documentation"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://open.gl/","rel":["nofollow"]},"children":[{"type":"text","value":"https://open.gl/"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"This youtube series: "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=kB0ZVUrI4Aw","rel":["nofollow"]},"children":[{"type":"text","value":"Basics"}]},{"type":"text","value":", "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=3yLL9ADo-ko","rel":["nofollow"]},"children":[{"type":"text","value":"Making a cube, applying transformations"}]},{"type":"text","value":", "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=hpnd11doMgc&t=52s","rel":["nofollow"]},"children":[{"type":"text","value":"Texturing"}]}]}]},{"type":"element","tag":"h2","props":{"id":"vertices-and-indices"},"children":[{"type":"text","value":"Vertices and Indices"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertices"}]},{"type":"text","value":" are points with specific coordinates "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"{x,y,z}"}]},{"type":"text","value":" in a 3D-space. We can build any figure by connecting "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"vertices"}]},{"type":"text","value":" in triangles with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"indices"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"shaders"},"children":[{"type":"text","value":"Shaders"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shaders are functions, written in C, which describe how to draw and color polygons to Graphic Card."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" describe "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"vertice"}]},{"type":"text","value":" positions, so Graphic Card can position them by connecting with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"indices"}]},{"type":"text","value":" and project to 2D canvas."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" describe the way polygons should be colored by assigning colors to Vertices or by applying textures to polygons."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shaders can have parameters passed from Javascript code ("},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniforms"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"attributes"}]},{"type":"text","value":"). "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" can also access data from "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" (that ones called "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":")."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"img","props":{"alt":"","src":"https://open.gl/media/img/c2_pipeline.png"},"children":[]}]},{"type":"element","tag":"h2","props":{"id":"program"},"children":[{"type":"text","value":"Program"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Program, as far as I understand, is a scene, that's described with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertices"}]},{"type":"text","value":", "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Indices"}]},{"type":"text","value":", specific "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" and "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"applying-transformations"},"children":[{"type":"text","value":"Applying transformations"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The best way to change positions inside "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" or color in "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" is to pass parameters (also called "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniforms"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":")."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read about that at "},{"type":"element","tag":"a","props":{"href":"https://open.gl/transformations","rel":["nofollow"]},"children":[{"type":"text","value":"open.gl"}]},{"type":"text","value":" and at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"source-code-with-explanations"},"children":[{"type":"text","value":"Source code with explanations"}]},{"type":"element","tag":"code","props":{"code":"// render-a-cube.ts\nimport { createShader } from \"./create-shader\";\nimport vxShader from \"./vertex.glsl?raw\";\nimport fgShader from \"./fragment.glsl?raw\";\n\nconst canvas = document.getElementyId('view');\nconst ctx = canvas.getRenderingContext('webgl');\n\n// should be put inside requestAnimationFrame\ndrawCube(ctx)(); \n\nfunction drawCube (\n gl: WebGL2RenderingContext, \n width: number,\n height: number\n) {\n // Initializing viewport\n gl.viewport(0, 0, width, height);\n gl.clearColor(0, 0, 0, 0);\n gl.clear(gl.COLOR_BUFFER_BIT);\n\n const prg = gl.createProgram();\n if (!prg) {\n throw new Error(\"Can't init programm\");\n }\n\n // Setting up VERTEX and FRAGMENT shaders\n const vx = createShader(gl, vxShader, gl.VERTEX_SHADER);\n gl.attachShader(prg, vx);\n const fx = createShader(gl, fgShader, gl.FRAGMENT_SHADER);\n gl.attachShader(prg, fx);\n gl.linkProgram(prg);\n if (!gl.getProgramParameter(prg, gl.LINK_STATUS)) {\n throw new Error(\"Could not initialise shaders\");\n }\n\n // Cube's vertices Array<[x,y,z]>, 8 items\n const vertices = [\n -1, -1, -1, // 0\n 1, -1, -1, // 1\n 1, 1, -1, // 2\n -1, 1, -1, // 3\n -1, -1, 1, // 4\n 1, -1, 1, // 5\n 1, 1, 1, // 6\n -1, 1, 1, // 7\n ];\n\n // indices, that form triangles, that form cube sides\n const indices = [\n 2, 1, 0, // side 0 (first triangle)\n 0, 3, 2, // side 0 (second triangle)\n 0, 4, 7, // side 1 (first triangle)\n 7, 3, 0, // side 1 (second triangle)\n 0, 1, 5, // ...\n 5, 4, 0, \n 1, 2, 6, \n 6, 5, 1, \n 2, 3, 7, \n 7, 6, 2, \n 4, 5, 6, \n 6, 7, 4,\n ];\n\n // createe a vertex buffer and bind vertices to it\n const squareVertexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);\n gl.bindBuffer(gl.ARRAY_BUFFER, null);\n\n // create a vertex buffer and bind indices to it\n const squareIndexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, squareIndexBuffer);\n gl.bufferData(\n gl.ELEMENT_ARRAY_BUFFER,\n new Uint16Array(indices),\n gl.STATIC_DRAW\n );\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, null);\n\n // initial drawing\n gl.clearColor(0.0, 0.0, 0.0, 0.0);\n gl.enable(gl.DEPTH_TEST);\n gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);\n gl.viewport(0, 0, width, height);\n\n // bind squareVertexBuffer as vertex positions buffer\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n \n // send every 3 bytes from squareVertexBuffer as {x,y,z} for each verticle\n gl.vertexAttribPointer(\n gl.getAttribLocation(prg, \"aVertexPosition\"), \n 3, // 3 bytes-long\n gl.FLOAT,\n false, // don't normalize (int to float)\n 0, \n 0\n );\n // send vertice buffer as `aVertexPosition` attribute inside vertex shader\n gl.enableVertexAttribArray(\n gl.getAttribLocation(prg, \"aVertexPosition\")\n );\n\n let i = 0;\n let speed = 0.01;\n\n // that's the main rendering callback\n return () => {\n gl.useProgram(prg);\n\n const scale = i * 0.25 + 0.25;\n\n // used for scaling inside Vertex Shader\n gl.uniform1f(gl.getUniformLocation(prg, \"slide\"), scale);\n // GL Screen is square, so we need to fix it's aspect ration\n gl.uniform1f(gl.getUniformLocation(prg, \"aspect\"), height / width);\n\n gl.bindBuffer(\n gl.ELEMENT_ARRAY_BUFFER, \n squareIndexBuffer\n );\n \n gl.drawElements(\n gl.TRIANGLES, \n indices.length, \n gl.UNSIGNED_SHORT, \n 0,\n );\n\n if (i > 1 || i < 0) {\n speed = -speed;\n }\n\n i += speed;\n };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// render-a-cube.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"\"./create-shader\""}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"vxShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"\"./vertex.glsl?raw\""}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"fgShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"\"./fragment.glsl?raw\""}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"document"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"getElementyId"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"'view'"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"getRenderingContext"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"'webgl'"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// should be put inside requestAnimationFrame"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"drawCube"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":")(); "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"function"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"drawCube"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7cd29f"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-8977a7"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a32dc8"},"children":[{"type":"text","value":"WebGL2RenderingContext"}]},{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7cd29f"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-8977a7"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d183b6"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7cd29f"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-8977a7"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d183b6"},"children":[{"type":"text","value":"number"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// Initializing viewport"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"viewport"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"clearColor"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"clear"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"COLOR_BUFFER_BIT"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"createProgram"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f060f"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"\"Can't init programm\""}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// Setting up VERTEX and FRAGMENT shaders"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"vx"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"vxShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"VERTEX_SHADER"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"attachShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"vx"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"fx"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"fgShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"FRAGMENT_SHADER"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"attachShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"fx"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"linkProgram"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"getProgramParameter"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"LINK_STATUS"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f060f"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"\"Could not initialise shaders\""}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// Cube's vertices Array<[x,y,z]>, 8 items"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"vertices"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// 0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// 1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// 2"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// 3"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// 4"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// 5"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// 6"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// 7"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" ];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// indices, that form triangles, that form cube sides"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"indices"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// side 0 (first triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// side 0 (second triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// side 1 (first triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// side 1 (second triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" ];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// createe a vertex buffer and bind vertices to it"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"squareVertexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"createBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"squareVertexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"bufferData"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f060f"},"children":[{"type":"text","value":"Float32Array"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"vertices"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"), "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"STATIC_DRAW"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f236f7"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// create a vertex buffer and bind indices to it"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"squareIndexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"createBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"squareIndexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"bufferData"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f060f"},"children":[{"type":"text","value":"Uint16Array"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"indices"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"STATIC_DRAW"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f236f7"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// initial drawing"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"clearColor"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0.0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0.0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0.0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"enable"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"DEPTH_TEST"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"clear"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"COLOR_BUFFER_BIT"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"DEPTH_BUFFER_BIT"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"viewport"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// bind squareVertexBuffer as vertex positions buffer"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"squareVertexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// send every 3 bytes from squareVertexBuffer as {x,y,z} for each verticle"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"vertexAttribPointer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"getAttribLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"\"aVertexPosition\""}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"), "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// 3 bytes-long"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"FLOAT"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f236f7"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// don't normalize (int to float)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// send vertice buffer as `aVertexPosition` attribute inside vertex shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"enableVertexAttribArray"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"getAttribLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"\"aVertexPosition\""}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0.01"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// that's the main rendering callback"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"useProgram"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0.25"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// used for scaling inside Vertex Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"uniform1f"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"getUniformLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"\"slide\""}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"), "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// GL Screen is square, so we need to fix it's aspect ration"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"uniform1f"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"getUniformLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"\"aspect\""}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"), "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"squareIndexBuffer"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"drawElements"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"TRIANGLES"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"indices"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"UNSIGNED_SHORT"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"+="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"shader-compiler"},"children":[{"type":"text","value":"Shader compiler"}]},{"type":"element","tag":"code","props":{"code":"// create-shader.ts\nexport const createShader = (\n gl: WebGL2RenderingContext,\n sourceCode: string,\n type: number, // gl.VERTEX_SHADER or gl.FRAGMENT_SHADER\n) => {\n const shader = gl.createShader(type);\n if (!shader) {\n throw new Error(`Can't init shader`);\n }\n\n gl.shaderSource(shader, sourceCode);\n gl.compileShader(shader);\n\n if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {\n const info = gl.getShaderInfoLog(shader);\n throw `Could not compile WebGL program. \\n\\n${info}`;\n }\n\n return shader;\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// create-shader.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7cd29f"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-8977a7"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a32dc8"},"children":[{"type":"text","value":"WebGL2RenderingContext"}]},{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7cd29f"},"children":[{"type":"text","value":"sourceCode"}]},{"type":"element","tag":"span","props":{"class":"ct-8977a7"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d183b6"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7cd29f"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-8977a7"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d183b6"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-93980e"},"children":[{"type":"text","value":"// gl.VERTEX_SHADER or gl.FRAGMENT_SHADER"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f060f"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"`Can't init shader`"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"shaderSource"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"sourceCode"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"compileShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"getShaderParameter"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"COMPILE_STATUS"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"info"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"getShaderInfoLog"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"`Could not compile WebGL program. "}]},{"type":"element","tag":"span","props":{"class":"ct-5dbe56"},"children":[{"type":"text","value":"\\n\\n"}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"info"}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"vertex-shader-example"},"children":[{"type":"text","value":"Vertex Shader Example"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read more at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]}]},{"type":"element","tag":"code","props":{"code":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// current vertice position {x,y,z,w}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"attribute vec4 aVertexPosition;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// final vertice position with all transformations applied,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// that will be passed to Fragment Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"varying vec4 v_positionWithOffset;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// Parameters passed from Javascript loop"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" slide;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" aspect;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"(){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// float array of 4 elements, same as [slide,slide,slide,1]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" vec4 scale"}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"(slide),"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// float array of 4 elements, same as [aspect,1,1,1]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" vec4 aspectRatioFix"}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"(aspect,"}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// vertice position, multiplied with matrices of scale and aspect ratio"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"aVertexPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"aspectRatioFix,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// vertice offset, that will be passed to fragment shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"fragment-shader-example"},"children":[{"type":"text","value":"Fragment Shader Example"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read more at "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"precision highp "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// parameter from Vertex Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"varying vec4 v_positionWithOffset;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// color, attached to current verticle {r,g,b,alpha}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// same a["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// v_positionWithOffset.x,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// v_positionWithOffset.y, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// v_positionWithOffset.z, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// 1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" gl_FragColor"}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"xyz"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-5dbe56{color:#79C0FF}.ct-93980e{color:#8B949E}.ct-f236f7{color:#79C0FF}.ct-7f060f{color:#79C0FF}.ct-3f41dc{color:#79C0FF}.ct-d183b6{color:#79C0FF}.ct-a32dc8{color:#FFA657}.ct-8977a7{color:#FF7B72}.ct-7cd29f{color:#FFA657}.ct-7f4c7e{color:#C9D1D9}.ct-a1f1df{color:#D2A8FF}.ct-c51f3e{color:#79C0FF}.ct-ef809f{color:#FF7B72}.ct-534aac{color:#A5D6FF}.ct-535538{color:#C9D1D9}.ct-60d196{color:#C9D1D9}.ct-64cc74{color:#FF7B72}.ct-27c1e8{color:#8B949E}.light .ct-27c1e8{color:#93A1A1}.light .ct-64cc74{color:#859900}.light .ct-60d196{color:#657B83}.light .ct-535538{color:#268BD2}.light .ct-534aac{color:#2AA198}.light .ct-ef809f{color:#073642}.light .ct-c51f3e{color:#268BD2}.light .ct-a1f1df{color:#268BD2}.light .ct-7f4c7e{color:#657B83}.light .ct-7cd29f{color:#657B83}.light .ct-8977a7{color:#859900}.light .ct-a32dc8{color:#268BD2}.light .ct-d183b6{color:#859900}.light .ct-3f41dc{color:#D33682}.light .ct-7f060f{color:#859900}.light .ct-f236f7{color:#B58900}.light .ct-93980e{color:#93A1A1}.light .ct-5dbe56{color:#CB4B16}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"helpful-documentation","depth":2,"text":"Helpful documentation"},{"id":"vertices-and-indices","depth":2,"text":"Vertices and Indices"},{"id":"shaders","depth":2,"text":"Shaders"},{"id":"program","depth":2,"text":"Program"},{"id":"applying-transformations","depth":2,"text":"Applying transformations"},{"id":"source-code-with-explanations","depth":2,"text":"Source code with explanations"},{"id":"shader-compiler","depth":2,"text":"Shader compiler"},{"id":"vertex-shader-example","depth":2,"text":"Vertex Shader Example"},{"id":"fragment-shader-example","depth":2,"text":"Fragment Shader Example"}]}},"_type":"markdown","_id":"content:Frontend:WebGL:Basics of WebGL (Drawing a Cube).md","_source":"content","_file":"Frontend/WebGL/Basics of WebGL (Drawing a Cube).md","_extension":"md"},{"_path":"/frontend/webgl/fragment-shaders","_dir":"webgl","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Fragment Shaders","description":"Fragment shaders describe how polygons are painted (or textured). Read Basics of WebGL (Drawing a Cube) first.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Fragment shaders describe "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"how polygons are painted"}]},{"type":"text","value":" (or textured). Read "},{"type":"element","tag":"a","props":{"href":"Basics%20of%20WebGL%20(Drawing%20a%20Cube)"},"children":[{"type":"text","value":"Basics of WebGL (Drawing a Cube)"}]},{"type":"text","value":" first."}]},{"type":"element","tag":"h2","props":{"id":"sample-fragment-vertex"},"children":[{"type":"text","value":"Sample fragment vertex"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Parameters could be passed here as written at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n// parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}```\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n// parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}```\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Fragment shaders describe "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"how polygons are painted"}]},{"type":"text","value":" (or textured). Read "},{"type":"element","tag":"a","props":{"href":"Basics%20of%20WebGL%20(Drawing%20a%20Cube)"},"children":[{"type":"text","value":"Basics of WebGL (Drawing a Cube)"}]},{"type":"text","value":" first."}]},{"type":"element","tag":"h2","props":{"id":"sample-fragment-vertex"},"children":[{"type":"text","value":"Sample fragment vertex"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Parameters could be passed here as written at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n// parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}```\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":"precision highp "}]},{"type":"element","tag":"span","props":{"class":"ct-18640f"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f234e2"},"children":[{"type":"text","value":"// parameter from Vertex Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":"varying vec4 v_positionWithOffset;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f234e2"},"children":[{"type":"text","value":"// parameters passed from Javascript loop"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-18640f"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":" slide;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-18640f"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":" aspect;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-18640f"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-84f100"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-18640f"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":"){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f234e2"},"children":[{"type":"text","value":"// color, attached to current verticle {r,g,b,alpha}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f234e2"},"children":[{"type":"text","value":"// same a["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f234e2"},"children":[{"type":"text","value":"// v_positionWithOffset.x,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f234e2"},"children":[{"type":"text","value":"// v_positionWithOffset.y, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f234e2"},"children":[{"type":"text","value":"// v_positionWithOffset.z, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f234e2"},"children":[{"type":"text","value":"// 1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f234e2"},"children":[{"type":"text","value":"// ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":" gl_FragColor"}]},{"type":"element","tag":"span","props":{"class":"ct-28a4d8"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-84f100"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b5ac9c"},"children":[{"type":"text","value":"v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b5ac9c"},"children":[{"type":"text","value":"xyz"}]},{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-6bb943"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":"}```"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-6bb943{color:#79C0FF}.ct-b5ac9c{color:#C9D1D9}.ct-28a4d8{color:#FF7B72}.ct-84f100{color:#D2A8FF}.ct-f234e2{color:#8B949E}.ct-18640f{color:#FF7B72}.ct-af55ca{color:#C9D1D9}.light .ct-af55ca{color:#657B83}.light .ct-18640f{color:#073642}.light .ct-f234e2{color:#93A1A1}.light .ct-84f100{color:#268BD2}.light .ct-28a4d8{color:#859900}.light .ct-b5ac9c{color:#268BD2}.light .ct-6bb943{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"sample-fragment-vertex","depth":2,"text":"Sample fragment vertex"}]}},"_type":"markdown","_id":"content:Frontend:WebGL:Fragment Shaders.md","_source":"content","_file":"Frontend/WebGL/Fragment Shaders.md","_extension":"md"},{"_path":"/frontend/webgl/rendering-without-blocking-in-a-worker","_dir":"webgl","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Rendering Without Blocking In A Worker","description":"Rendering items on #canvas in main loop might cause interface freezes, preventing render process from executing properly by flooding execution stack with operations.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Rendering items on #canvas in main loop "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"might cause interface freezes"}]},{"type":"text","value":", preventing render process from executing properly by flooding execution stack with operations."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To handle it properly, we can start separate #worker thread, that will handle rendering in its own event loop, so that won't affect the source tab's event loop."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Workers can have access to "},{"type":"element","tag":"a","props":{"href":"https://developer.mozilla.org/en-US/docs/Glossary/Transferable_objects","rel":["nofollow"]},"children":[{"type":"text","value":"Transferrable Objects"}]},{"type":"text","value":" from main thread by receiving memory address. "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"That's a lot faster than cloning"}]},{"type":"text","value":". In this case "},{"type":"element","tag":"a","props":{"href":"https://developer.mozilla.org/en-US/docs/Web/API/ImageBitmap","rel":["nofollow"]},"children":[{"type":"text","value":"ImageBitmap"}]},{"type":"text","value":" is transferrable."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Code for the main thread component:"}]},{"type":"element","tag":"code","props":{"code":"// main.ts\nconst instance = new Worker('./render-worker.ts');\nconst canvas = document.getElementById('view');\n\n// attaching event listener to worker\ninstance.onmessage = (event: MessageEvent) => {\n const ctx = canvas?.getContext(\"2d\");\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n \n ctx.drawImage(event.data as ImageBitmap, 0, 0);\n}\n\n// sending canvas contents to worker\nconst renderInCanvas = () => {\n if (!canvas.current) {\n return;\n }\n \n createImageBitmap(canvas.current).then(image => {\n instance.postMessage(image, { transfer: [image] })\n });\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// main.ts\nconst instance = new Worker('./render-worker.ts');\nconst canvas = document.getElementById('view');\n\n// attaching event listener to worker\ninstance.onmessage = (event: MessageEvent) => {\n const ctx = canvas?.getContext(\"2d\");\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n \n ctx.drawImage(event.data as ImageBitmap, 0, 0);\n}\n\n// sending canvas contents to worker\nconst renderInCanvas = () => {\n if (!canvas.current) {\n return;\n }\n \n createImageBitmap(canvas.current).then(image => {\n instance.postMessage(image, { transfer: [image] })\n });\n};\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Worker code:"}]},{"type":"element","tag":"code","props":{"code":"// render-worker.ts\nexport default () => {\n self.onmessage = (message: MessageEvent) => {\n const data = message.data;\n\n if (!(data instanceof ImageBitmap)) {\n throw new Error('Received unknown data')\n }\n\n // OffscreenCanvas can be set up inside workers\n const canvas = new OffscreenCanvas(data.width, data.height);\n const ctx = canvas.getContext(\"2d\");\n\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n\n ctx.drawImage(data, 0, 0);\n\n // That will block execution inside worker for \n // a couple of seconds\n doHardRenderingStuffHere(ctx, data.width, data.height);\n\n // Sending resulting image back to main thread\n createImageBitmap(canvas).then((image) => {\n self.postMessage(image, { transfer: [image] });\n });\n };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// render-worker.ts\nexport default () => {\n self.onmessage = (message: MessageEvent) => {\n const data = message.data;\n\n if (!(data instanceof ImageBitmap)) {\n throw new Error('Received unknown data')\n }\n\n // OffscreenCanvas can be set up inside workers\n const canvas = new OffscreenCanvas(data.width, data.height);\n const ctx = canvas.getContext(\"2d\");\n\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n\n ctx.drawImage(data, 0, 0);\n\n // That will block execution inside worker for \n // a couple of seconds\n doHardRenderingStuffHere(ctx, data.width, data.height);\n\n // Sending resulting image back to main thread\n createImageBitmap(canvas).then((image) => {\n self.postMessage(image, { transfer: [image] });\n });\n };\n};\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Rendering items on #canvas in main loop "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"might cause interface freezes"}]},{"type":"text","value":", preventing render process from executing properly by flooding execution stack with operations."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To handle it properly, we can start separate #worker thread, that will handle rendering in its own event loop, so that won't affect the source tab's event loop."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Workers can have access to "},{"type":"element","tag":"a","props":{"href":"https://developer.mozilla.org/en-US/docs/Glossary/Transferable_objects","rel":["nofollow"]},"children":[{"type":"text","value":"Transferrable Objects"}]},{"type":"text","value":" from main thread by receiving memory address. "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"That's a lot faster than cloning"}]},{"type":"text","value":". In this case "},{"type":"element","tag":"a","props":{"href":"https://developer.mozilla.org/en-US/docs/Web/API/ImageBitmap","rel":["nofollow"]},"children":[{"type":"text","value":"ImageBitmap"}]},{"type":"text","value":" is transferrable."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Code for the main thread component:"}]},{"type":"element","tag":"code","props":{"code":"// main.ts\nconst instance = new Worker('./render-worker.ts');\nconst canvas = document.getElementById('view');\n\n// attaching event listener to worker\ninstance.onmessage = (event: MessageEvent) => {\n const ctx = canvas?.getContext(\"2d\");\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n \n ctx.drawImage(event.data as ImageBitmap, 0, 0);\n}\n\n// sending canvas contents to worker\nconst renderInCanvas = () => {\n if (!canvas.current) {\n return;\n }\n \n createImageBitmap(canvas.current).then(image => {\n instance.postMessage(image, { transfer: [image] })\n });\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8f9030"},"children":[{"type":"text","value":"// main.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a073d0"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1afa53"},"children":[{"type":"text","value":"instance"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"Worker"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b7c5f5"},"children":[{"type":"text","value":"'./render-worker.ts'"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a073d0"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1afa53"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"document"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"getElementById"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b7c5f5"},"children":[{"type":"text","value":"'view'"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8f9030"},"children":[{"type":"text","value":"// attaching event listener to worker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"instance"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"onmessage"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-268080"},"children":[{"type":"text","value":"MessageEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-a073d0"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a073d0"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1afa53"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"getContext"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b7c5f5"},"children":[{"type":"text","value":"\"2d\""}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b42040"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b7c5f5"},"children":[{"type":"text","value":"`Can't get 2D context`"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"drawImage"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"as"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-268080"},"children":[{"type":"text","value":"ImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f93fe2"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f93fe2"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8f9030"},"children":[{"type":"text","value":"// sending canvas contents to worker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a073d0"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"renderInCanvas"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-a073d0"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"createImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"then"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"instance"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"postMessage"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":", { transfer: ["}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"] })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Worker code:"}]},{"type":"element","tag":"code","props":{"code":"// render-worker.ts\nexport default () => {\n self.onmessage = (message: MessageEvent) => {\n const data = message.data;\n\n if (!(data instanceof ImageBitmap)) {\n throw new Error('Received unknown data')\n }\n\n // OffscreenCanvas can be set up inside workers\n const canvas = new OffscreenCanvas(data.width, data.height);\n const ctx = canvas.getContext(\"2d\");\n\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n\n ctx.drawImage(data, 0, 0);\n\n // That will block execution inside worker for \n // a couple of seconds\n doHardRenderingStuffHere(ctx, data.width, data.height);\n\n // Sending resulting image back to main thread\n createImageBitmap(canvas).then((image) => {\n self.postMessage(image, { transfer: [image] });\n });\n };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8f9030"},"children":[{"type":"text","value":"// render-worker.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f45deb"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-3adc7c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f45deb"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-3adc7c"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-03e437"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-3adc7c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9f497f"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"self"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"onmessage"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a073d0"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1afa53"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"message"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"instanceof"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-268080"},"children":[{"type":"text","value":"ImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b42040"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b7c5f5"},"children":[{"type":"text","value":"'Received unknown data'"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8f9030"},"children":[{"type":"text","value":"// OffscreenCanvas can be set up inside workers"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a073d0"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1afa53"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"OffscreenCanvas"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a073d0"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1afa53"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"getContext"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b7c5f5"},"children":[{"type":"text","value":"\"2d\""}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b42040"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b7c5f5"},"children":[{"type":"text","value":"`Can't get 2D context`"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"drawImage"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f93fe2"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f93fe2"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8f9030"},"children":[{"type":"text","value":"// That will block execution inside worker for "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8f9030"},"children":[{"type":"text","value":"// a couple of seconds"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"doHardRenderingStuffHere"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8f9030"},"children":[{"type":"text","value":"// Sending resulting image back to main thread"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"createImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-a073d0"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"self"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"postMessage"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":", { transfer: ["}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"] });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-9f497f{color:#C9D1D9}.ct-03e437{color:#FF7B72}.ct-3adc7c{color:#FFA657}.ct-f45deb{color:#FF7B72}.ct-f93fe2{color:#79C0FF}.ct-b42040{color:#79C0FF}.ct-268080{color:#FFA657}.ct-ef783b{color:#C9D1D9}.ct-b7c5f5{color:#A5D6FF}.ct-8d9856{color:#D2A8FF}.ct-86786b{color:#FF7B72}.ct-1afa53{color:#79C0FF}.ct-5b7b20{color:#C9D1D9}.ct-a073d0{color:#FF7B72}.ct-8f9030{color:#8B949E}.light .ct-8f9030{color:#93A1A1}.light .ct-a073d0{color:#073642}.light .ct-5b7b20{color:#657B83}.light .ct-1afa53{color:#268BD2}.light .ct-86786b{color:#859900}.light .ct-8d9856{color:#268BD2}.light .ct-b7c5f5{color:#2AA198}.light .ct-ef783b{color:#268BD2}.light .ct-268080{color:#268BD2}.light .ct-b42040{color:#859900}.light .ct-f93fe2{color:#D33682}.light .ct-f45deb{color:#859900}.light .ct-3adc7c{color:#657B83}.light .ct-03e437{color:#073642}.light .ct-9f497f{color:#657B83}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:WebGL:Rendering without blocking in a Worker.md","_source":"content","_file":"Frontend/WebGL/Rendering without blocking in a Worker.md","_extension":"md"},{"_path":"/frontend/webgl/vertex-shaders","_dir":"webgl","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Vertex Shaders","description":"Read Basics of WebGL (Drawing a Cube) first.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read "},{"type":"element","tag":"a","props":{"href":"Basics%20of%20WebGL%20(Drawing%20a%20Cube)"},"children":[{"type":"text","value":"Basics of WebGL (Drawing a Cube)"}]},{"type":"text","value":" first."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" define vertice positions in 3D-space. That's just a function, that defines "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gl_Position"}]},{"type":"text","value":" value by applying different transformations to it."}]},{"type":"element","tag":"h2","props":{"id":"sample-code"},"children":[{"type":"text","value":"Sample code"}]},{"type":"element","tag":"code","props":{"code":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"passing-parameters-to-vertexshader"},"children":[{"type":"text","value":"Passing parameters to VertexShader"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Search for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Uniforms"}]},{"type":"text","value":" "},{"type":"element","tag":"a","props":{"href":"https://open.gl/drawing","rel":["nofollow"]},"children":[{"type":"text","value":"at open.gl"}]},{"type":"text","value":" for further reading."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There're 3 ways to pass parameters."}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"attribute"}]},{"type":"text","value":" are parameters, that won't change. Good for vertex buffers."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniform"}]},{"type":"text","value":" are meant to change over the time. Good for passing transformations."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varying"}]},{"type":"text","value":" are parameters, that's shared between Vertex and "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]}]},{"type":"element","tag":"h2","props":{"id":"applying-transformations"},"children":[{"type":"text","value":"Applying transformations"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Every vertice position is defined as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"{x,y,z,w}"}]},{"type":"text","value":", where "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"w"}]},{"type":"text","value":" is a common denominator, that's used to achieve fast coord transformations by multiplying number of square matrices with original vertice coordinates."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"We don't change vertice position buffer"}]},{"type":"text","value":", because it's slow when being run inside Javascript loop, we "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"pass transformation matrices"}]},{"type":"text","value":" instead and "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"multiply vertice positions with transformation matrices"}]},{"type":"text","value":" inside a Graphic Card's GPU, because that's what GPU made for."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Good explanation can be found here: "},{"type":"element","tag":"a","props":{"href":"https://open.gl/transformations","rel":["nofollow"]},"children":[{"type":"text","value":"open.gl"}]},{"type":"text","value":"."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read "},{"type":"element","tag":"a","props":{"href":"Basics%20of%20WebGL%20(Drawing%20a%20Cube)"},"children":[{"type":"text","value":"Basics of WebGL (Drawing a Cube)"}]},{"type":"text","value":" first."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" define vertice positions in 3D-space. That's just a function, that defines "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gl_Position"}]},{"type":"text","value":" value by applying different transformations to it."}]},{"type":"element","tag":"h2","props":{"id":"sample-code"},"children":[{"type":"text","value":"Sample code"}]},{"type":"element","tag":"code","props":{"code":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-22b8af"},"children":[{"type":"text","value":"// current vertice position {x,y,z,w}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"attribute vec4 aVertexPosition;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-22b8af"},"children":[{"type":"text","value":"// final vertice position with all transformations applied,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-22b8af"},"children":[{"type":"text","value":"// that will be passed to Fragment Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"varying vec4 v_positionWithOffset;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-22b8af"},"children":[{"type":"text","value":"// Parameters passed from Javascript loop"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-b79326"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":" slide;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-b79326"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":" aspect;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b79326"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-43f728"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"(){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-22b8af"},"children":[{"type":"text","value":"// float array of 4 elements, same as [slide,slide,slide,1]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":" vec4 scale"}]},{"type":"element","tag":"span","props":{"class":"ct-c6b3e4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-43f728"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-43f728"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"(slide),"}]},{"type":"element","tag":"span","props":{"class":"ct-f1b75a"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-22b8af"},"children":[{"type":"text","value":"// float array of 4 elements, same as [aspect,1,1,1]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":" vec4 aspectRatioFix"}]},{"type":"element","tag":"span","props":{"class":"ct-c6b3e4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-43f728"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"(aspect,"}]},{"type":"element","tag":"span","props":{"class":"ct-43f728"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f1b75a"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-22b8af"},"children":[{"type":"text","value":"// vertice position, multiplied with matrices of scale and aspect ratio"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":" gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-c6b3e4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"aVertexPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-c6b3e4"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-c6b3e4"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"aspectRatioFix,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-22b8af"},"children":[{"type":"text","value":"// vertice offset, that will be passed to fragment shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":" v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-c6b3e4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-c6b3e4"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-43f728"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f1b75a"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-f1b75a"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-f1b75a"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-f1b75a"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"passing-parameters-to-vertexshader"},"children":[{"type":"text","value":"Passing parameters to VertexShader"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Search for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Uniforms"}]},{"type":"text","value":" "},{"type":"element","tag":"a","props":{"href":"https://open.gl/drawing","rel":["nofollow"]},"children":[{"type":"text","value":"at open.gl"}]},{"type":"text","value":" for further reading."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There're 3 ways to pass parameters."}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"attribute"}]},{"type":"text","value":" are parameters, that won't change. Good for vertex buffers."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniform"}]},{"type":"text","value":" are meant to change over the time. Good for passing transformations."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varying"}]},{"type":"text","value":" are parameters, that's shared between Vertex and "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]}]},{"type":"element","tag":"h2","props":{"id":"applying-transformations"},"children":[{"type":"text","value":"Applying transformations"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Every vertice position is defined as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"{x,y,z,w}"}]},{"type":"text","value":", where "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"w"}]},{"type":"text","value":" is a common denominator, that's used to achieve fast coord transformations by multiplying number of square matrices with original vertice coordinates."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"We don't change vertice position buffer"}]},{"type":"text","value":", because it's slow when being run inside Javascript loop, we "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"pass transformation matrices"}]},{"type":"text","value":" instead and "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"multiply vertice positions with transformation matrices"}]},{"type":"text","value":" inside a Graphic Card's GPU, because that's what GPU made for."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Good explanation can be found here: "},{"type":"element","tag":"a","props":{"href":"https://open.gl/transformations","rel":["nofollow"]},"children":[{"type":"text","value":"open.gl"}]},{"type":"text","value":"."}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-f1b75a{color:#79C0FF}.ct-c6b3e4{color:#FF7B72}.ct-43f728{color:#D2A8FF}.ct-b79326{color:#FF7B72}.ct-c1002a{color:#C9D1D9}.ct-22b8af{color:#8B949E}.light .ct-22b8af{color:#93A1A1}.light .ct-c1002a{color:#657B83}.light .ct-b79326{color:#073642}.light .ct-43f728{color:#268BD2}.light .ct-c6b3e4{color:#859900}.light .ct-f1b75a{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"sample-code","depth":2,"text":"Sample code"},{"id":"passing-parameters-to-vertexshader","depth":2,"text":"Passing parameters to VertexShader"},{"id":"applying-transformations","depth":2,"text":"Applying transformations"}]}},"_type":"markdown","_id":"content:Frontend:WebGL:Vertex Shaders.md","_source":"content","_file":"Frontend/WebGL/Vertex Shaders.md","_extension":"md"},{"_path":"/git/force-git-to-use-https","_dir":"git","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Force Git To Use HTTPS","description":"Forces #git to use https even if remote url is #SSH. Useful for the networks with blocked #ssh protocol.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Forces #git to use https even if remote url is #SSH. Useful for the networks with blocked #ssh protocol."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Put this inside your "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"~/.gitconfig"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"[url \"https://github.com\"]\n insteadOf = git://github.com\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"[url \"https://github.com\"]\n insteadOf = git://github.com\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Forces #git to use https even if remote url is #SSH. Useful for the networks with blocked #ssh protocol."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Put this inside your "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"~/.gitconfig"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"[url \"https://github.com\"]\n insteadOf = git://github.com\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fbd0e3"},"children":[{"type":"text","value":"[url "}]},{"type":"element","tag":"span","props":{"class":"ct-22e710"},"children":[{"type":"text","value":"\"https://github.com\""}]},{"type":"element","tag":"span","props":{"class":"ct-fbd0e3"},"children":[{"type":"text","value":"]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fbd0e3"},"children":[{"type":"text","value":" insteadOf "}]},{"type":"element","tag":"span","props":{"class":"ct-ea4b0a"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fbd0e3"},"children":[{"type":"text","value":" git:"}]},{"type":"element","tag":"span","props":{"class":"ct-a22a26"},"children":[{"type":"text","value":"//github.com"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-a22a26{color:#8B949E}.ct-ea4b0a{color:#FF7B72}.ct-22e710{color:#A5D6FF}.ct-fbd0e3{color:#C9D1D9}.light .ct-fbd0e3{color:#657B83}.light .ct-22e710{color:#2AA198}.light .ct-ea4b0a{color:#859900}.light .ct-a22a26{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Git:Force git to use HTTPS.md","_source":"content","_file":"Git/Force git to use HTTPS.md","_extension":"md"},{"_path":"/git/git-aliases-and-useful-commands","_dir":"git","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Git Aliases And Useful Commands","description":"Shorthands for #git commands can be specified. Should be placed at ~/.gitconfig.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shorthands for #git commands can be specified. Should be placed at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"~/.gitconfig"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"[alias]\n flush = git clean-branches branch | grep -v master | xargs git branch -D\n lol = log --oneline --graph\n l = lol\n c = commit -am\n cv = commit --no-verify -am\n p = push\n pf = p --force-with-lease\n ignore-now = update-index --skip-worktree\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"[alias]\n flush = git clean-branches branch | grep -v master | xargs git branch -D\n lol = log --oneline --graph\n l = lol\n c = commit -am\n cv = commit --no-verify -am\n p = push\n pf = p --force-with-lease\n ignore-now = update-index --skip-worktree\n"}]}]}]},{"type":"element","tag":"table","props":{},"children":[{"type":"element","tag":"thead","props":{},"children":[{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"th","props":{"align":null},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"command"}]}]},{"type":"element","tag":"th","props":{"align":null},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"description"}]}]}]}]},{"type":"element","tag":"tbody","props":{},"children":[{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git flush"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"drops all branches, except master"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git lol"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"shows log"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git c"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"commits with message"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git cv"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"commits without hooks"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git p"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"pushes"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git pf"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"push with --force and additional check"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git ignore-now"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"starts ignoring file from now on"}]}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shorthands for #git commands can be specified. Should be placed at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"~/.gitconfig"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"[alias]\n flush = git clean-branches branch | grep -v master | xargs git branch -D\n lol = log --oneline --graph\n l = lol\n c = commit -am\n cv = commit --no-verify -am\n p = push\n pf = p --force-with-lease\n ignore-now = update-index --skip-worktree\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"[alias]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" flush "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" git clean"}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"branches branch "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" grep "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"v master "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" xargs git branch "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"D"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" lol "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" log "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"oneline "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"graph"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" l "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" lol"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" c "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" commit "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"am"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" cv "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" commit "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"no"}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"verify "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"am"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" p "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" push"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" pf "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" p "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"force"}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"with"}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"lease"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" ignore"}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"now "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" update"}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"index "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"skip"}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"worktree"}]}]}]}]}]},{"type":"element","tag":"table","props":{},"children":[{"type":"element","tag":"thead","props":{},"children":[{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"th","props":{"align":null},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"command"}]}]},{"type":"element","tag":"th","props":{"align":null},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"description"}]}]}]}]},{"type":"element","tag":"tbody","props":{},"children":[{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git flush"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"drops all branches, except master"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git lol"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"shows log"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git c"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"commits with message"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git cv"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"commits without hooks"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git p"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"pushes"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git pf"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"push with --force and additional check"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git ignore-now"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"starts ignoring file from now on"}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-da3bc5{color:#FF7B72}.ct-9b16eb{color:#C9D1D9}.light .ct-9b16eb{color:#657B83}.light .ct-da3bc5{color:#859900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Git:Git aliases and useful commands.md","_source":"content","_file":"Git/Git aliases and useful commands.md","_extension":"md"},{"_path":"/golang/i18n-in-golang","_dir":"golang","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"I18n In Golang","description":"There are no good examples of golang.org/x/text uses and description of how pluralization made. So, this is it.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There are no good examples of "},{"type":"element","tag":"a","props":{"href":"https://golang.org/x/text","rel":["nofollow"]},"children":[{"type":"text","value":"golang.org/x/text"}]},{"type":"text","value":" uses and description of how pluralization made. So, this is it."}]},{"type":"element","tag":"h4","props":{"id":"generating-translations"},"children":[{"type":"text","value":"Generating translations"}]},{"type":"element","tag":"blockquote","props":{},"children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should specify valid "},{"type":"element","tag":"a","props":{"href":"https://www.iso.org/obp/ui/#iso:code:3166","rel":["nofollow"]},"children":[{"type":"text","value":"ISO-3166 locale code"}]},{"type":"text","value":" to get plurals working!"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Write your code:"}]},{"type":"element","tag":"code","props":{"code":"import (\n \"golang.org/x/text/language\"\n \"golang.org/x/text/message\"\n)\n\nlang := language.MustParse('ru-RU')\nprinter := message.NewPrinter(lang)\n\ncount := 1\nprinter.Sprintf(\"%d butterflies\", count)\n","language":"go"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import (\n \"golang.org/x/text/language\"\n \"golang.org/x/text/message\"\n)\n\nlang := language.MustParse('ru-RU')\nprinter := message.NewPrinter(lang)\n\ncount := 1\nprinter.Sprintf(\"%d butterflies\", count)\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run generator for your locale (mine is "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"ru-RU"}]},{"type":"text","value":"):"}]},{"type":"element","tag":"code","props":{"code":"gotext -srclang=en-GB update -lang=ru-RU \\\n -out=translations.go github.com/path/to-output-folder\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"gotext -srclang=en-GB update -lang=ru-RU \\\n -out=translations.go github.com/path/to-output-folder\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This will generate "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"out.gotext.json"}]},{"type":"text","value":" in "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/path/to-output-folder/ru-RU"}]},{"type":"text","value":" of your project. Copy it to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"messages.out.json"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h4","props":{"id":"translating-and-adding-plural-forms"},"children":[{"type":"text","value":"Translating and adding plural forms"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"\"translation\""}]},{"type":"text","value":" value in generated "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"messages.gotext.json"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"string"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"object"}]},{"type":"text","value":" of the form shown below if you want pluralize strings, "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"then run gotext command again"}]},{"type":"text","value":", it will generate "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".go files with translations"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"According to "},{"type":"element","tag":"a","props":{"href":"https://github.com/golang/text/blob/master/feature/plural/gen_common.go#L19","rel":["nofollow"]},"children":[{"type":"text","value":"source files of gen_common"}]},{"type":"text","value":", there's a couple of forms:"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"=N"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"!=N"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"%N"}]},{"type":"text","value":" for exact matches"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"zero"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"one"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"two"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"few"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"many"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"other"}]},{"type":"text","value":" - they're different for each language, so,"}]}]},{"type":"element","tag":"code","props":{"code":"{\n \"id\": \"{Count} butterflies\",\n \"message\": \"{Count} butterflies\",\n \"translation\": {\n \"select\": {\n \"feature\": \"plural\",\n \"arg\": \"Count\",\n \"cases\": {\n \"one\": {\n \"msg\": \"{Count} бабочка\"\n },\n \"few\": {\n \"msg\": \"{Count} бабочки\"\n },\n \"many\": {\n \"msg\": \"{Count} бабочек\"\n },\n \"other\": {\n \"msg\": \"{Count} бабочуль\"\n }\n }\n }\n },\n \"placeholders\": [\n {\n \"id\": \"Count\",\n \"string\": \"%[1]d\",\n \"type\": \"int\",\n \"underlyingType\": \"int\",\n \"argNum\": 1,\n \"expr\": \"count\"\n }\n ]\n},\n","language":"json"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"{\n \"id\": \"{Count} butterflies\",\n \"message\": \"{Count} butterflies\",\n \"translation\": {\n \"select\": {\n \"feature\": \"plural\",\n \"arg\": \"Count\",\n \"cases\": {\n \"one\": {\n \"msg\": \"{Count} бабочка\"\n },\n \"few\": {\n \"msg\": \"{Count} бабочки\"\n },\n \"many\": {\n \"msg\": \"{Count} бабочек\"\n },\n \"other\": {\n \"msg\": \"{Count} бабочуль\"\n }\n }\n }\n },\n \"placeholders\": [\n {\n \"id\": \"Count\",\n \"string\": \"%[1]d\",\n \"type\": \"int\",\n \"underlyingType\": \"int\",\n \"argNum\": 1,\n \"expr\": \"count\"\n }\n ]\n},\n"}]}]}]},{"type":"element","tag":"h4","props":{"id":"using-go-generate"},"children":[{"type":"text","value":"Using go-generate"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Write this at some "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".go"}]},{"type":"text","value":" file:"}]},{"type":"element","tag":"code","props":{"code":"//go:generate gotext -srclang=en-GB update -out=translations.go -lang=ru-RU github.com/muerwre/vault-golang/internal/api\n","language":"go"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"//go:generate gotext -srclang=en-GB update -out=translations.go -lang=ru-RU github.com/muerwre/vault-golang/internal/api\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run go generation:"}]},{"type":"element","tag":"code","props":{"code":"go generate ./...\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"go generate ./...\n"}]}]}]},{"type":"element","tag":"h4","props":{"id":"useful-links"},"children":[{"type":"text","value":"Useful links"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/golang/text/blob/master/feature/plural/gen_common.go#L19","rel":["nofollow"]},"children":[{"type":"text","value":"All available forms in this .go file"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://community.crowdin.com/t/plurals-in-gotext-json-files/600","rel":["nofollow"]},"children":[{"type":"text","value":"Answer, that solved it for me"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There are no good examples of "},{"type":"element","tag":"a","props":{"href":"https://golang.org/x/text","rel":["nofollow"]},"children":[{"type":"text","value":"golang.org/x/text"}]},{"type":"text","value":" uses and description of how pluralization made. So, this is it."}]},{"type":"element","tag":"h4","props":{"id":"generating-translations"},"children":[{"type":"text","value":"Generating translations"}]},{"type":"element","tag":"blockquote","props":{},"children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should specify valid "},{"type":"element","tag":"a","props":{"href":"https://www.iso.org/obp/ui/#iso:code:3166","rel":["nofollow"]},"children":[{"type":"text","value":"ISO-3166 locale code"}]},{"type":"text","value":" to get plurals working!"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Write your code:"}]},{"type":"element","tag":"code","props":{"code":"import (\n \"golang.org/x/text/language\"\n \"golang.org/x/text/message\"\n)\n\nlang := language.MustParse('ru-RU')\nprinter := message.NewPrinter(lang)\n\ncount := 1\nprinter.Sprintf(\"%d butterflies\", count)\n","language":"go"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e01c71"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3d6772"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d19b58"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-906b3a"},"children":[{"type":"text","value":"golang.org/x/text/language"}]},{"type":"element","tag":"span","props":{"class":"ct-d19b58"},"children":[{"type":"text","value":"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3d6772"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d19b58"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-906b3a"},"children":[{"type":"text","value":"golang.org/x/text/message"}]},{"type":"element","tag":"span","props":{"class":"ct-d19b58"},"children":[{"type":"text","value":"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b05caf"},"children":[{"type":"text","value":"lang"}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e01c71"},"children":[{"type":"text","value":":="}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" language."}]},{"type":"element","tag":"span","props":{"class":"ct-52b090"},"children":[{"type":"text","value":"MustParse"}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"'"}]},{"type":"element","tag":"span","props":{"class":"ct-601b0e"},"children":[{"type":"text","value":"ru-RU"}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"'"}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b05caf"},"children":[{"type":"text","value":"printer"}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e01c71"},"children":[{"type":"text","value":":="}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" message."}]},{"type":"element","tag":"span","props":{"class":"ct-52b090"},"children":[{"type":"text","value":"NewPrinter"}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":"(lang)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b05caf"},"children":[{"type":"text","value":"count"}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e01c71"},"children":[{"type":"text","value":":="}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-888095"},"children":[{"type":"text","value":"1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":"printer."}]},{"type":"element","tag":"span","props":{"class":"ct-52b090"},"children":[{"type":"text","value":"Sprintf"}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-37236e"},"children":[{"type":"text","value":"%d"}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":" butterflies\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":", count)"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run generator for your locale (mine is "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"ru-RU"}]},{"type":"text","value":"):"}]},{"type":"element","tag":"code","props":{"code":"gotext -srclang=en-GB update -lang=ru-RU \\\n -out=translations.go github.com/path/to-output-folder\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":"gotext -srclang=en-GB update -lang=ru-RU \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" -out=translations.go github.com/path/to-output-folder"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This will generate "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"out.gotext.json"}]},{"type":"text","value":" in "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/path/to-output-folder/ru-RU"}]},{"type":"text","value":" of your project. Copy it to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"messages.out.json"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h4","props":{"id":"translating-and-adding-plural-forms"},"children":[{"type":"text","value":"Translating and adding plural forms"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"\"translation\""}]},{"type":"text","value":" value in generated "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"messages.gotext.json"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"string"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"object"}]},{"type":"text","value":" of the form shown below if you want pluralize strings, "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"then run gotext command again"}]},{"type":"text","value":", it will generate "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".go files with translations"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"According to "},{"type":"element","tag":"a","props":{"href":"https://github.com/golang/text/blob/master/feature/plural/gen_common.go#L19","rel":["nofollow"]},"children":[{"type":"text","value":"source files of gen_common"}]},{"type":"text","value":", there's a couple of forms:"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"=N"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"!=N"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"%N"}]},{"type":"text","value":" for exact matches"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"zero"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"one"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"two"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"few"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"many"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"other"}]},{"type":"text","value":" - they're different for each language, so,"}]}]},{"type":"element","tag":"code","props":{"code":"{\n \"id\": \"{Count} butterflies\",\n \"message\": \"{Count} butterflies\",\n \"translation\": {\n \"select\": {\n \"feature\": \"plural\",\n \"arg\": \"Count\",\n \"cases\": {\n \"one\": {\n \"msg\": \"{Count} бабочка\"\n },\n \"few\": {\n \"msg\": \"{Count} бабочки\"\n },\n \"many\": {\n \"msg\": \"{Count} бабочек\"\n },\n \"other\": {\n \"msg\": \"{Count} бабочуль\"\n }\n }\n }\n },\n \"placeholders\": [\n {\n \"id\": \"Count\",\n \"string\": \"%[1]d\",\n \"type\": \"int\",\n \"underlyingType\": \"int\",\n \"argNum\": 1,\n \"expr\": \"count\"\n }\n ]\n},\n","language":"json"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"id\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"{Count} butterflies\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"message\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"{Count} butterflies\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"translation\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"select\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"feature\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"plural\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"arg\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"Count\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"cases\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"one\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"{Count} бабочка\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"few\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"{Count} бабочки\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"many\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"{Count} бабочек\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"other\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"{Count} бабочуль\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"placeholders\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"id\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"Count\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"string\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"%[1]d\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"type\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"int\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"underlyingType\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"int\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"argNum\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-888095"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"expr\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"count\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":"},"}]}]}]}]}]},{"type":"element","tag":"h4","props":{"id":"using-go-generate"},"children":[{"type":"text","value":"Using go-generate"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Write this at some "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".go"}]},{"type":"text","value":" file:"}]},{"type":"element","tag":"code","props":{"code":"//go:generate gotext -srclang=en-GB update -out=translations.go -lang=ru-RU github.com/muerwre/vault-golang/internal/api\n","language":"go"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a3abcc"},"children":[{"type":"text","value":"//go:generate gotext -srclang=en-GB update -out=translations.go -lang=ru-RU github.com/muerwre/vault-golang/internal/api"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run go generation:"}]},{"type":"element","tag":"code","props":{"code":"go generate ./...\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":"go generate ./..."}]}]}]}]}]},{"type":"element","tag":"h4","props":{"id":"useful-links"},"children":[{"type":"text","value":"Useful links"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/golang/text/blob/master/feature/plural/gen_common.go#L19","rel":["nofollow"]},"children":[{"type":"text","value":"All available forms in this .go file"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://community.crowdin.com/t/plurals-in-gotext-json-files/600","rel":["nofollow"]},"children":[{"type":"text","value":"Answer, that solved it for me"}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-a3abcc{color:#8B949E}.ct-f85543{color:#79C0FF}.ct-37236e{color:#79C0FF}.ct-888095{color:#79C0FF}.ct-601b0e{color:#FFA198}.ct-671abd{color:#A5D6FF}.ct-52b090{color:#79C0FF}.ct-b05caf{color:#C9D1D9}.ct-906b3a{color:#FFA657}.ct-d19b58{color:#A5D6FF}.ct-3d6772{color:#C9D1D9}.ct-c9d8e7{color:#C9D1D9}.ct-e01c71{color:#FF7B72}.light .ct-e01c71{color:#859900}.light .ct-c9d8e7{color:#657B83}.light .ct-3d6772{color:#657B83}.light .ct-d19b58{color:#2AA198}.light .ct-906b3a{color:#2AA198}.light .ct-b05caf{color:#268BD2}.light .ct-52b090{color:#268BD2}.light .ct-671abd{color:#2AA198}.light .ct-601b0e{color:#CD3131}.light .ct-888095{color:#D33682}.light .ct-37236e{color:#CB4B16}.light .ct-f85543{color:#859900}.light .ct-a3abcc{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Golang:i18n in golang.md","_source":"content","_file":"Golang/i18n in golang.md","_extension":"md"},{"_path":"/graphql/apollo-client-pagination","_dir":"graphql","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Apollo Client Pagination","description":"Say, we have gql response like this and we wan't to have pagination with it. Let's merge it as it specified in official documentation","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say, we have "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gql"}]},{"type":"text","value":" response like this and we wan't to have pagination with it. Let's merge it as it specified in "},{"type":"element","tag":"a","props":{"href":"https://www.apollographql.com/docs/react/caching/cache-field-behavior/#the-merge-function","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]}]},{"type":"element","tag":"code","props":{"code":"query listItems(\n filter: Filter, \n sort: String,\n limit: Number,\n offset: Number,\n): ItemList!\n\ninput Filter {\n name: String!\n type: String!\n}\n\ntype ItemList {\n items: [Item!]!\n totalCount: Int!\n}\n","language":"graphql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"query listItems(\n filter: Filter, \n sort: String,\n limit: Number,\n offset: Number,\n): ItemList!\n\ninput Filter {\n name: String!\n type: String!\n}\n\ntype ItemList {\n items: [Item!]!\n totalCount: Int!\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We will setup "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"ApolloClient"}]},{"type":"text","value":" with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"typePolicies"}]},{"type":"text","value":" to merge incoming data in cache:"}]},{"type":"element","tag":"code","props":{"code":"import { ApolloClient, InMemoryCache } from '@apollo/client';\n\nconst client = new ApolloClient({\n // ...\n cache: new InMemoryCache({ typePolicies }),\n // ...\n});\n\nexport const typePolicies: TypePolicies = {\n Query: {\n fields: {\n // query name\n listItems: {\n // apollo will serialize and use keyArgs as unique\n // identifier in cache for every query\n // consider choosing the right fields, \n // i.e. limit and offset won't work here\n keyArgs: [\n 'sort', // primitive type\n 'filter', ['name', 'type'] // nested fields of `filter`\n ],\n merge: mergeItemsWithTotalCount,\n },\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { ApolloClient, InMemoryCache } from '@apollo/client';\n\nconst client = new ApolloClient({\n // ...\n cache: new InMemoryCache({ typePolicies }),\n // ...\n});\n\nexport const typePolicies: TypePolicies = {\n Query: {\n fields: {\n // query name\n listItems: {\n // apollo will serialize and use keyArgs as unique\n // identifier in cache for every query\n // consider choosing the right fields, \n // i.e. limit and offset won't work here\n keyArgs: [\n 'sort', // primitive type\n 'filter', ['name', 'type'] // nested fields of `filter`\n ],\n merge: mergeItemsWithTotalCount,\n },\n }\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We will need merge function "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mergeItemsWithTotalCount"}]},{"type":"text","value":", which will join results of query and cached data for specific key:"}]},{"type":"element","tag":"code","props":{"code":"/** merges all sources with { items: unknown[], totalCount: number } */\nconst mergeItemsWithTotalCount = (existing, incoming, { args }) => {\n // no existing data\n if (!existing || !args?.offset || args.offset < existing.length) {\n return incoming || [];\n }\n\n // If hook was called multiple times\n if (existing?.items?.length && args?.offset < existing.items.length) {\n return existing || [];\n }\n\n // merge cache and incoming data\n const items = [...(existing?.items || []), ...(incoming?.items || [])];\n\n // apply latest result for totalCount\n const totalCount = incoming?.totalCount || existing?.totalCount;\n\n return {\n ...(incoming || existing || {}),\n items,\n totalCount,\n };\n };\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"/** merges all sources with { items: unknown[], totalCount: number } */\nconst mergeItemsWithTotalCount = (existing, incoming, { args }) => {\n // no existing data\n if (!existing || !args?.offset || args.offset < existing.length) {\n return incoming || [];\n }\n\n // If hook was called multiple times\n if (existing?.items?.length && args?.offset < existing.items.length) {\n return existing || [];\n }\n\n // merge cache and incoming data\n const items = [...(existing?.items || []), ...(incoming?.items || [])];\n\n // apply latest result for totalCount\n const totalCount = incoming?.totalCount || existing?.totalCount;\n\n return {\n ...(incoming || existing || {}),\n items,\n totalCount,\n };\n };\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say, we have "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gql"}]},{"type":"text","value":" response like this and we wan't to have pagination with it. Let's merge it as it specified in "},{"type":"element","tag":"a","props":{"href":"https://www.apollographql.com/docs/react/caching/cache-field-behavior/#the-merge-function","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]}]},{"type":"element","tag":"code","props":{"code":"query listItems(\n filter: Filter, \n sort: String,\n limit: Number,\n offset: Number,\n): ItemList!\n\ninput Filter {\n name: String!\n type: String!\n}\n\ntype ItemList {\n items: [Item!]!\n totalCount: Int!\n}\n","language":"graphql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"query"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1e640f"},"children":[{"type":"text","value":"listItems"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-af2982"},"children":[{"type":"text","value":"filter"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3b4ce6"},"children":[{"type":"text","value":"Filter"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-af2982"},"children":[{"type":"text","value":"sort"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3b4ce6"},"children":[{"type":"text","value":"String"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-af2982"},"children":[{"type":"text","value":"limit"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3b4ce6"},"children":[{"type":"text","value":"Number"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-af2982"},"children":[{"type":"text","value":"offset"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3b4ce6"},"children":[{"type":"text","value":"Number"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"): "}]},{"type":"element","tag":"span","props":{"class":"ct-1e640f"},"children":[{"type":"text","value":"ItemList"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"input"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eac85e"},"children":[{"type":"text","value":"Filter"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-af2982"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3b4ce6"},"children":[{"type":"text","value":"String"}]},{"type":"element","tag":"span","props":{"class":"ct-7b1289"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-af2982"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3b4ce6"},"children":[{"type":"text","value":"String"}]},{"type":"element","tag":"span","props":{"class":"ct-7b1289"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eac85e"},"children":[{"type":"text","value":"ItemList"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-af2982"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":": ["}]},{"type":"element","tag":"span","props":{"class":"ct-3b4ce6"},"children":[{"type":"text","value":"Item"}]},{"type":"element","tag":"span","props":{"class":"ct-7b1289"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":"]"}]},{"type":"element","tag":"span","props":{"class":"ct-7b1289"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-af2982"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3b4ce6"},"children":[{"type":"text","value":"Int"}]},{"type":"element","tag":"span","props":{"class":"ct-7b1289"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We will setup "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"ApolloClient"}]},{"type":"text","value":" with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"typePolicies"}]},{"type":"text","value":" to merge incoming data in cache:"}]},{"type":"element","tag":"code","props":{"code":"import { ApolloClient, InMemoryCache } from '@apollo/client';\n\nconst client = new ApolloClient({\n // ...\n cache: new InMemoryCache({ typePolicies }),\n // ...\n});\n\nexport const typePolicies: TypePolicies = {\n Query: {\n fields: {\n // query name\n listItems: {\n // apollo will serialize and use keyArgs as unique\n // identifier in cache for every query\n // consider choosing the right fields, \n // i.e. limit and offset won't work here\n keyArgs: [\n 'sort', // primitive type\n 'filter', ['name', 'type'] // nested fields of `filter`\n ],\n merge: mergeItemsWithTotalCount,\n },\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"ApolloClient"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"InMemoryCache"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3764bc"},"children":[{"type":"text","value":"'@apollo/client'"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a5e4ff"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ccbc70"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1e640f"},"children":[{"type":"text","value":"ApolloClient"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" cache: "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1e640f"},"children":[{"type":"text","value":"InMemoryCache"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"({ "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"typePolicies"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"});"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a5e4ff"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ccbc70"},"children":[{"type":"text","value":"typePolicies"}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8c4995"},"children":[{"type":"text","value":"TypePolicies"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" Query: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" fields: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// query name"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" listItems: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// apollo will serialize and use keyArgs as unique"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// identifier in cache for every query"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// consider choosing the right fields, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// i.e. limit and offset won't work here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" keyArgs: ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3764bc"},"children":[{"type":"text","value":"'sort'"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// primitive type"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3764bc"},"children":[{"type":"text","value":"'filter'"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":", ["}]},{"type":"element","tag":"span","props":{"class":"ct-3764bc"},"children":[{"type":"text","value":"'name'"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3764bc"},"children":[{"type":"text","value":"'type'"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"] "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// nested fields of `filter`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" ],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" merge: "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"mergeItemsWithTotalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We will need merge function "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mergeItemsWithTotalCount"}]},{"type":"text","value":", which will join results of query and cached data for specific key:"}]},{"type":"element","tag":"code","props":{"code":"/** merges all sources with { items: unknown[], totalCount: number } */\nconst mergeItemsWithTotalCount = (existing, incoming, { args }) => {\n // no existing data\n if (!existing || !args?.offset || args.offset < existing.length) {\n return incoming || [];\n }\n\n // If hook was called multiple times\n if (existing?.items?.length && args?.offset < existing.items.length) {\n return existing || [];\n }\n\n // merge cache and incoming data\n const items = [...(existing?.items || []), ...(incoming?.items || [])];\n\n // apply latest result for totalCount\n const totalCount = incoming?.totalCount || existing?.totalCount;\n\n return {\n ...(incoming || existing || {}),\n items,\n totalCount,\n };\n };\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"/** merges all sources with { items: unknown[], totalCount: number } */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9dffe1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-031566"},"children":[{"type":"text","value":"mergeItemsWithTotalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7b1289"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-af2982"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-af2982"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":", { "}]},{"type":"element","tag":"span","props":{"class":"ct-af2982"},"children":[{"type":"text","value":"args"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-9dffe1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// no existing data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"args"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"offset"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"args"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"offset"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"existing"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" [];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// If hook was called multiple times"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"?."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" [];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// merge cache and incoming data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a5e4ff"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ccbc70"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// apply latest result for totalCount"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a5e4ff"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ccbc70"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" };"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-031566{color:#D2A8FF}.ct-9dffe1{color:#FF7B72}.ct-8c4995{color:#FFA657}.ct-845267{color:#8B949E}.ct-ccbc70{color:#79C0FF}.ct-a5e4ff{color:#FF7B72}.ct-3764bc{color:#A5D6FF}.ct-7744f1{color:#C9D1D9}.ct-7b1289{color:#FF7B72}.ct-eac85e{color:#79C0FF}.ct-3b4ce6{color:#79C0FF}.ct-af2982{color:#FFA657}.ct-d80d1a{color:#C9D1D9}.ct-1e640f{color:#D2A8FF}.ct-dbc662{color:#C9D1D9}.ct-3add6e{color:#FF7B72}.light .ct-3add6e{color:#859900}.light .ct-dbc662{color:#657B83}.light .ct-1e640f{color:#268BD2}.light .ct-d80d1a{color:#657B83}.light .ct-af2982{color:#657B83}.light .ct-3b4ce6{color:#859900}.light .ct-eac85e{color:#859900}.light .ct-7b1289{color:#859900}.light .ct-7744f1{color:#268BD2}.light .ct-3764bc{color:#2AA198}.light .ct-a5e4ff{color:#073642}.light .ct-ccbc70{color:#268BD2}.light .ct-845267{color:#93A1A1}.light .ct-8c4995{color:#268BD2}.light .ct-9dffe1{color:#073642}.light .ct-031566{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:GraphQL:Apollo Client pagination.md","_source":"content","_file":"GraphQL/Apollo Client pagination.md","_extension":"md"},{"_path":"/graphql/refresh-token-in-apollo-client","_dir":"graphql","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Refresh Token In Apollo Client","description":"If your GraphQL api needs token refresh option, you can pass custom fetch function for Apollo Client.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If your GraphQL api needs token refresh option, you can pass custom fetch function for Apollo Client."}]},{"type":"element","tag":"code","props":{"code":"export const createApolloClient = (\n url: string,\n logout: () => void,\n getAuthorizationData: () => { authorization: string },\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n) =>\n new ApolloClientBase({\n // ...other options\n link: ApolloLink.from([\n // ...other options\n setContext(async (_, { headers }) => {\n return {\n headers: {\n ...headers,\n ...getAuthorizationData(),\n },\n };\n }),\n new HttpLink({\n uri: url,\n fetch: fetchWithTokenRefresh(logout, refreshToken),\n }),\n ]),\n });\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"export const createApolloClient = (\n url: string,\n logout: () => void,\n getAuthorizationData: () => { authorization: string },\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n) =>\n new ApolloClientBase({\n // ...other options\n link: ApolloLink.from([\n // ...other options\n setContext(async (_, { headers }) => {\n return {\n headers: {\n ...headers,\n ...getAuthorizationData(),\n },\n };\n }),\n new HttpLink({\n uri: url,\n fetch: fetchWithTokenRefresh(logout, refreshToken),\n }),\n ]),\n });\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Custom fetch function for this request. You should tune "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"hasUnauthorizedError"}]},{"type":"text","value":" and\n"},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"text","value":" to match your api."}]},{"type":"element","tag":"code","props":{"code":"/** Global singleton for refreshing promise */\nlet refreshingPromise: Promise | null = null;\n\n/** Checks if GraphQl errors has unauthenticated error */\nconst hasUnauthorizedError = (errors: Array<{ code?: ErrorCode }>): boolean =>\n Array.isArray(errors) &&\n errors.some(error => {\n return error.status === 401; // Distinguish unauthorized error here\n });\n\n/** Detects if customFetch is sending refresh request */\nconst isRefreshRequestOptions = (options: RequestInit) => {\n try {\n const body = JSON.parse(options?.body as string);\n return body.operationName === 'RefreshToken';\n } catch (e) {\n return false;\n }\n};\n\n/** fetchWithTokenRefresh is a custom fetch function with token refresh for apollo */\nexport const fetchWithTokenRefresh =\n (\n logout: () => void,\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n ) =>\n async (uri: string, options: RequestInit): Promise => {\n // already refreshing token, wait for it and then use refreshed token\n // or use empty authorization if refreshing failed\n if (\n !isRefreshRequestOptions(options) &&\n refreshingPromise &&\n (options.headers as Record)?.authorization\n ) {\n const newAccessToken = await refreshingPromise\n .catch(() => {\n // refreshing token from other request failed, retry without authorization\n return '';\n });\n \n options.headers = {\n ...(options.headers || {}),\n authorization: newAccessToken,\n };\n }\n\n return fetch(uri, options).then(async response => {\n const text = await response.text();\n const json = JSON.parse(text);\n\n // check for unauthorized errors, if not present, just return result\n if (\n isRefreshRequestOptions(options) ||\n !json?.errors ||\n !Array.isArray(json.errors) ||\n !hasUnauthorizedError(json.errors)\n ) {\n return {\n ...response,\n ok: true,\n json: async () =>\n new Promise(resolve => {\n resolve(json);\n }),\n text: async () =>\n new Promise(resolve => {\n resolve(text);\n }),\n };\n }\n\n // If unauthorized, refresh token and try again\n if (!refreshingPromise) {\n refreshingPromise = refreshToken()\n .then(async (tokens): Promise => {\n refreshingPromise = null;\n\n if (!tokens?.accessToken) {\n throw new Error('Session expired');\n }\n\n return tokens?.accessToken;\n })\n .catch(() => {\n refreshingPromise = null;\n\n // can't refresh token. logging out\n logout();\n throw new Error('Session expired');\n });\n }\n\n // success or any non-auth error\n return refreshingPromise\n .then(async (newAccessToken: string) => {\n // wait for other request's refreshing query to finish, when retry\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: newAccessToken,\n },\n });\n })\n .catch(async () => {\n // refreshing token from other request failed, retry without authorization\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: '',\n },\n });\n });\n });\n };\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"/** Global singleton for refreshing promise */\nlet refreshingPromise: Promise | null = null;\n\n/** Checks if GraphQl errors has unauthenticated error */\nconst hasUnauthorizedError = (errors: Array<{ code?: ErrorCode }>): boolean =>\n Array.isArray(errors) &&\n errors.some(error => {\n return error.status === 401; // Distinguish unauthorized error here\n });\n\n/** Detects if customFetch is sending refresh request */\nconst isRefreshRequestOptions = (options: RequestInit) => {\n try {\n const body = JSON.parse(options?.body as string);\n return body.operationName === 'RefreshToken';\n } catch (e) {\n return false;\n }\n};\n\n/** fetchWithTokenRefresh is a custom fetch function with token refresh for apollo */\nexport const fetchWithTokenRefresh =\n (\n logout: () => void,\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n ) =>\n async (uri: string, options: RequestInit): Promise => {\n // already refreshing token, wait for it and then use refreshed token\n // or use empty authorization if refreshing failed\n if (\n !isRefreshRequestOptions(options) &&\n refreshingPromise &&\n (options.headers as Record)?.authorization\n ) {\n const newAccessToken = await refreshingPromise\n .catch(() => {\n // refreshing token from other request failed, retry without authorization\n return '';\n });\n \n options.headers = {\n ...(options.headers || {}),\n authorization: newAccessToken,\n };\n }\n\n return fetch(uri, options).then(async response => {\n const text = await response.text();\n const json = JSON.parse(text);\n\n // check for unauthorized errors, if not present, just return result\n if (\n isRefreshRequestOptions(options) ||\n !json?.errors ||\n !Array.isArray(json.errors) ||\n !hasUnauthorizedError(json.errors)\n ) {\n return {\n ...response,\n ok: true,\n json: async () =>\n new Promise(resolve => {\n resolve(json);\n }),\n text: async () =>\n new Promise(resolve => {\n resolve(text);\n }),\n };\n }\n\n // If unauthorized, refresh token and try again\n if (!refreshingPromise) {\n refreshingPromise = refreshToken()\n .then(async (tokens): Promise => {\n refreshingPromise = null;\n\n if (!tokens?.accessToken) {\n throw new Error('Session expired');\n }\n\n return tokens?.accessToken;\n })\n .catch(() => {\n refreshingPromise = null;\n\n // can't refresh token. logging out\n logout();\n throw new Error('Session expired');\n });\n }\n\n // success or any non-auth error\n return refreshingPromise\n .then(async (newAccessToken: string) => {\n // wait for other request's refreshing query to finish, when retry\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: newAccessToken,\n },\n });\n })\n .catch(async () => {\n // refreshing token from other request failed, retry without authorization\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: '',\n },\n });\n });\n });\n };\n\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If your GraphQL api needs token refresh option, you can pass custom fetch function for Apollo Client."}]},{"type":"element","tag":"code","props":{"code":"export const createApolloClient = (\n url: string,\n logout: () => void,\n getAuthorizationData: () => { authorization: string },\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n) =>\n new ApolloClientBase({\n // ...other options\n link: ApolloLink.from([\n // ...other options\n setContext(async (_, { headers }) => {\n return {\n headers: {\n ...headers,\n ...getAuthorizationData(),\n },\n };\n }),\n new HttpLink({\n uri: url,\n fetch: fetchWithTokenRefresh(logout, refreshToken),\n }),\n ]),\n });\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"createApolloClient"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"url"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ad18b4"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2c2f82"},"children":[{"type":"text","value":"getAuthorizationData"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"authorization"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90393e"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"<"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"undefined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" >,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"ApolloClientBase"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// ...other options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" link: "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"ApolloLink"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"(["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// ...other options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2c2f82"},"children":[{"type":"text","value":"setContext"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"_"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":", { "}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"getAuthorizationData"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"(),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"HttpLink"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" uri: "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"url"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" fetch: "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"fetchWithTokenRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ]),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" });"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Custom fetch function for this request. You should tune "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"hasUnauthorizedError"}]},{"type":"text","value":" and\n"},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"text","value":" to match your api."}]},{"type":"element","tag":"code","props":{"code":"/** Global singleton for refreshing promise */\nlet refreshingPromise: Promise | null = null;\n\n/** Checks if GraphQl errors has unauthenticated error */\nconst hasUnauthorizedError = (errors: Array<{ code?: ErrorCode }>): boolean =>\n Array.isArray(errors) &&\n errors.some(error => {\n return error.status === 401; // Distinguish unauthorized error here\n });\n\n/** Detects if customFetch is sending refresh request */\nconst isRefreshRequestOptions = (options: RequestInit) => {\n try {\n const body = JSON.parse(options?.body as string);\n return body.operationName === 'RefreshToken';\n } catch (e) {\n return false;\n }\n};\n\n/** fetchWithTokenRefresh is a custom fetch function with token refresh for apollo */\nexport const fetchWithTokenRefresh =\n (\n logout: () => void,\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n ) =>\n async (uri: string, options: RequestInit): Promise => {\n // already refreshing token, wait for it and then use refreshed token\n // or use empty authorization if refreshing failed\n if (\n !isRefreshRequestOptions(options) &&\n refreshingPromise &&\n (options.headers as Record)?.authorization\n ) {\n const newAccessToken = await refreshingPromise\n .catch(() => {\n // refreshing token from other request failed, retry without authorization\n return '';\n });\n \n options.headers = {\n ...(options.headers || {}),\n authorization: newAccessToken,\n };\n }\n\n return fetch(uri, options).then(async response => {\n const text = await response.text();\n const json = JSON.parse(text);\n\n // check for unauthorized errors, if not present, just return result\n if (\n isRefreshRequestOptions(options) ||\n !json?.errors ||\n !Array.isArray(json.errors) ||\n !hasUnauthorizedError(json.errors)\n ) {\n return {\n ...response,\n ok: true,\n json: async () =>\n new Promise(resolve => {\n resolve(json);\n }),\n text: async () =>\n new Promise(resolve => {\n resolve(text);\n }),\n };\n }\n\n // If unauthorized, refresh token and try again\n if (!refreshingPromise) {\n refreshingPromise = refreshToken()\n .then(async (tokens): Promise => {\n refreshingPromise = null;\n\n if (!tokens?.accessToken) {\n throw new Error('Session expired');\n }\n\n return tokens?.accessToken;\n })\n .catch(() => {\n refreshingPromise = null;\n\n // can't refresh token. logging out\n logout();\n throw new Error('Session expired');\n });\n }\n\n // success or any non-auth error\n return refreshingPromise\n .then(async (newAccessToken: string) => {\n // wait for other request's refreshing query to finish, when retry\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: newAccessToken,\n },\n });\n })\n .catch(async () => {\n // refreshing token from other request failed, retry without authorization\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: '',\n },\n });\n });\n });\n };\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"/** Global singleton for refreshing promise */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90393e"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-ad18b4"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ad18b4"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa24e7"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"/** Checks if GraphQl errors has unauthenticated error */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2c2f82"},"children":[{"type":"text","value":"hasUnauthorizedError"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b67ae4"},"children":[{"type":"text","value":"Array"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":"<{ "}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"code"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":"?:"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b67ae4"},"children":[{"type":"text","value":"ErrorCode"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" }>)"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ad18b4"},"children":[{"type":"text","value":"Array"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"isArray"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"&&"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"some"}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"status"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afc81b"},"children":[{"type":"text","value":"401"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// Distinguish unauthorized error here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"/** Detects if customFetch is sending refresh request */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2c2f82"},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b67ae4"},"children":[{"type":"text","value":"RequestInit"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-73c394"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ad18b4"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"operationName"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8edec8"},"children":[{"type":"text","value":"'RefreshToken'"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa24e7"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"/** fetchWithTokenRefresh is a custom fetch function with token refresh for apollo */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-73c394"},"children":[{"type":"text","value":"fetchWithTokenRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"="}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":": () "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":": () "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" { accessToken: "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa24e7"},"children":[{"type":"text","value":"undefined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ) "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b67ae4"},"children":[{"type":"text","value":"RequestInit"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b67ae4"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-b67ae4"},"children":[{"type":"text","value":"Response"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// already refreshing token, wait for it and then use refreshed token"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// or use empty authorization if refreshing failed"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"&&"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"&&"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"as"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90393e"},"children":[{"type":"text","value":"Record"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-ad18b4"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-ad18b4"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":">)?."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"authorization"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-73c394"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"refreshingPromise"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// refreshing token from other request failed, retry without authorization"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8edec8"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" {}),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"fetch"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"async"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-73c394"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-73c394"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"="}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// check for unauthorized errors, if not present, just return result"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"||"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"||"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"hasUnauthorizedError"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ok: "}]},{"type":"element","tag":"span","props":{"class":"ct-fa24e7"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"unknown"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":">("}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":">("}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// If unauthorized, refresh token and try again"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"()"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-2c2f82"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b67ae4"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa24e7"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ad18b4"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-8edec8"},"children":[{"type":"text","value":"'Session expired'"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa24e7"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// can't refresh token. logging out"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ad18b4"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-8edec8"},"children":[{"type":"text","value":"'Session expired'"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// success or any non-auth error"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"refreshingPromise"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-2c2f82"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// wait for other request's refreshing query to finish, when retry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"fetch"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" {}),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// refreshing token from other request failed, retry without authorization"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"fetch"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" {}),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-8edec8"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" };"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-8edec8{color:#A5D6FF}.ct-73c394{color:#79C0FF}.ct-afc81b{color:#79C0FF}.ct-b67ae4{color:#FFA657}.ct-fa24e7{color:#79C0FF}.ct-6c128f{color:#C9D1D9}.ct-4762e0{color:#8B949E}.ct-90393e{color:#FFA657}.ct-f419fe{color:#FF7B72}.ct-2c2f82{color:#D2A8FF}.ct-ad18b4{color:#79C0FF}.ct-f22a4a{color:#79C0FF}.ct-67bf9e{color:#FF7B72}.ct-8f51b2{color:#FFA657}.ct-9341de{color:#C9D1D9}.ct-701850{color:#D2A8FF}.ct-c8d8bc{color:#FF7B72}.ct-f6697b{color:#C9D1D9}.ct-323b77{color:#FF7B72}.light .ct-323b77{color:#859900}.light .ct-f6697b{color:#657B83}.light .ct-c8d8bc{color:#073642}.light .ct-701850{color:#268BD2}.light .ct-9341de{color:#657B83}.light .ct-8f51b2{color:#657B83}.light .ct-67bf9e{color:#859900}.light .ct-f22a4a{color:#859900}.light .ct-ad18b4{color:#859900}.light .ct-2c2f82{color:#268BD2}.light .ct-f419fe{color:#073642}.light .ct-90393e{color:#268BD2}.light .ct-4762e0{color:#93A1A1}.light .ct-6c128f{color:#268BD2}.light .ct-fa24e7{color:#B58900}.light .ct-b67ae4{color:#268BD2}.light .ct-afc81b{color:#D33682}.light .ct-73c394{color:#268BD2}.light .ct-8edec8{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:GraphQL:Refresh token in Apollo client.md","_source":"content","_file":"GraphQL/Refresh token in Apollo client.md","_extension":"md"},{"_path":"/linux/certbot-well-known-auto-renew","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Certbot Well Known Auto Renew","description":"This is translation of article from clsv.ru, which explains how to automate certbot's well-known, also known as HTTP challenge for wildcard certs renewal.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is translation of article from "},{"type":"element","tag":"a","props":{"href":"https://clsv.ru/linux/lets_encrypt_eto_legko_i_prosto_60","rel":["nofollow"]},"children":[{"type":"text","value":"clsv.ru"}]},{"type":"text","value":", which explains how to automate certbot's well-known, also known as HTTP challenge for wildcard certs renewal."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You'll need 4 scripts:"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Authentication script, which will write authentication file:"}]}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\necho $CERTBOT_VALIDATION > /var/www/html/.well-known/$CERTBOT_TOKEN\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"#!/bin/bash\necho $CERTBOT_VALIDATION > /var/www/html/.well-known/$CERTBOT_TOKEN\n"}]}]}]},{"type":"element","tag":"ol","props":{"start":2},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Cleanup script, that will delete that"}]}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\nrm -f /var/www/html/.well-known/$CERTBOT_TOKEN\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"#!/bin/bash\nrm -f /var/www/html/.well-known/$CERTBOT_TOKEN\n"}]}]}]},{"type":"element","tag":"ol","props":{"start":3},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Initial cert acquiring script:"}]}]},{"type":"element","tag":"code","props":{"code":"certbot certonly \\\n --preferred-challenges=http --manual \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /oath/to/clean.sh\n -d \"yourhost.org,*.yourhost.org\" \\\n --manual-public-ip-logging-ok\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"certbot certonly \\\n --preferred-challenges=http --manual \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /oath/to/clean.sh\n -d \"yourhost.org,*.yourhost.org\" \\\n --manual-public-ip-logging-ok\n"}]}]}]},{"type":"element","tag":"ol","props":{"start":4},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Renewal script itself, to put it in crontab (or /etc/cron.weekly)"}]}]},{"type":"element","tag":"code","props":{"code":"certbot renew --manual-public-ip-logging-ok \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /path/to/clean.sh\n\nsystemctl reload nginx\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"certbot renew --manual-public-ip-logging-ok \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /path/to/clean.sh\n\nsystemctl reload nginx\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to configure your http server to serve "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".well-known"}]},{"type":"text","value":"."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is translation of article from "},{"type":"element","tag":"a","props":{"href":"https://clsv.ru/linux/lets_encrypt_eto_legko_i_prosto_60","rel":["nofollow"]},"children":[{"type":"text","value":"clsv.ru"}]},{"type":"text","value":", which explains how to automate certbot's well-known, also known as HTTP challenge for wildcard certs renewal."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You'll need 4 scripts:"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Authentication script, which will write authentication file:"}]}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\necho $CERTBOT_VALIDATION > /var/www/html/.well-known/$CERTBOT_TOKEN\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-93e482"},"children":[{"type":"text","value":"#!/bin/bash"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b712ed"},"children":[{"type":"text","value":"echo"}]},{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4a3db1"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-80830f"},"children":[{"type":"text","value":"CERTBOT_VALIDATION"}]},{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ab39e2"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":" /var/www/html/.well-known/"}]},{"type":"element","tag":"span","props":{"class":"ct-4a3db1"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-80830f"},"children":[{"type":"text","value":"CERTBOT_TOKEN"}]}]}]}]}]},{"type":"element","tag":"ol","props":{"start":2},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Cleanup script, that will delete that"}]}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\nrm -f /var/www/html/.well-known/$CERTBOT_TOKEN\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-93e482"},"children":[{"type":"text","value":"#!/bin/bash"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":"rm -f /var/www/html/.well-known/"}]},{"type":"element","tag":"span","props":{"class":"ct-4a3db1"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-80830f"},"children":[{"type":"text","value":"CERTBOT_TOKEN"}]}]}]}]}]},{"type":"element","tag":"ol","props":{"start":3},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Initial cert acquiring script:"}]}]},{"type":"element","tag":"code","props":{"code":"certbot certonly \\\n --preferred-challenges=http --manual \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /oath/to/clean.sh\n -d \"yourhost.org,*.yourhost.org\" \\\n --manual-public-ip-logging-ok\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":"certbot certonly \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":" --preferred-challenges=http --manual \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":" --manual-auth-hook /path/to/auth.sh \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":" --manual-cleanup-hook /oath/to/clean.sh"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":" -d "}]},{"type":"element","tag":"span","props":{"class":"ct-13b590"},"children":[{"type":"text","value":"\"yourhost.org,*.yourhost.org\""}]},{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":" --manual-public-ip-logging-ok"}]}]}]}]}]},{"type":"element","tag":"ol","props":{"start":4},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Renewal script itself, to put it in crontab (or /etc/cron.weekly)"}]}]},{"type":"element","tag":"code","props":{"code":"certbot renew --manual-public-ip-logging-ok \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /path/to/clean.sh\n\nsystemctl reload nginx\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":"certbot renew --manual-public-ip-logging-ok \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":" --manual-auth-hook /path/to/auth.sh \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":" --manual-cleanup-hook /path/to/clean.sh"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":"systemctl reload nginx"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to configure your http server to serve "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".well-known"}]},{"type":"text","value":"."}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-13b590{color:#A5D6FF}.ct-ab39e2{color:#FF7B72}.ct-80830f{color:#C9D1D9}.ct-4a3db1{color:#C9D1D9}.ct-3f309e{color:#C9D1D9}.ct-b712ed{color:#79C0FF}.ct-93e482{color:#8B949E}.light .ct-93e482{color:#93A1A1}.light .ct-b712ed{color:#268BD2}.light .ct-3f309e{color:#657B83}.light .ct-4a3db1{color:#859900}.light .ct-80830f{color:#268BD2}.light .ct-ab39e2{color:#859900}.light .ct-13b590{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Linux:Certbot well-known auto renew.md","_source":"content","_file":"Linux/Certbot well-known auto renew.md","_extension":"md"},{"_path":"/linux/find-out-who-uses-swap","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Find Out Who Uses Swap","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"code","props":{"code":"for file in /proc/*/status ; do awk '/VmSwap|Name/{printf $2 \" \" $3}END{ print \"\"}' $file; done | sort -k 2 -n -r | less\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"for file in /proc/*/status ; do awk '/VmSwap|Name/{printf $2 \" \" $3}END{ print \"\"}' $file; done | sort -k 2 -n -r | less\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"code","props":{"code":"for file in /proc/*/status ; do awk '/VmSwap|Name/{printf $2 \" \" $3}END{ print \"\"}' $file; done | sort -k 2 -n -r | less\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-444031"},"children":[{"type":"text","value":"for"}]},{"type":"element","tag":"span","props":{"class":"ct-e0d9a3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-83057a"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-e0d9a3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-444031"},"children":[{"type":"text","value":"in"}]},{"type":"element","tag":"span","props":{"class":"ct-e0d9a3"},"children":[{"type":"text","value":" /proc/"}]},{"type":"element","tag":"span","props":{"class":"ct-444031"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-e0d9a3"},"children":[{"type":"text","value":"/status "}]},{"type":"element","tag":"span","props":{"class":"ct-444031"},"children":[{"type":"text","value":";"}]},{"type":"element","tag":"span","props":{"class":"ct-e0d9a3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-444031"},"children":[{"type":"text","value":"do"}]},{"type":"element","tag":"span","props":{"class":"ct-e0d9a3"},"children":[{"type":"text","value":" awk "}]},{"type":"element","tag":"span","props":{"class":"ct-9a56ef"},"children":[{"type":"text","value":"'/VmSwap|Name/{printf $2 \" \" $3}END{ print \"\"}'"}]},{"type":"element","tag":"span","props":{"class":"ct-e0d9a3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-444031"},"children":[{"type":"text","value":"done"}]},{"type":"element","tag":"span","props":{"class":"ct-e0d9a3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-444031"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-e0d9a3"},"children":[{"type":"text","value":" sort -k 2 -n -r "}]},{"type":"element","tag":"span","props":{"class":"ct-444031"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-e0d9a3"},"children":[{"type":"text","value":" less"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-9a56ef{color:#A5D6FF}.ct-83057a{color:#C9D1D9}.ct-e0d9a3{color:#C9D1D9}.ct-444031{color:#FF7B72}.light .ct-444031{color:#859900}.light .ct-e0d9a3{color:#657B83}.light .ct-83057a{color:#268BD2}.light .ct-9a56ef{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Linux:Find out who uses swap.md","_source":"content","_file":"Linux/Find out who uses swap.md","_extension":"md"},{"_path":"/linux/fixing-lagging-usb-headphones","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Fixing Lagging USB Headphones","description":"When receiving messages like this:","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"When receiving messages like this:"}]},{"type":"element","tag":"code","props":{"code":"Bluetooth: hci0: ACL packet for unknown connection handle 256\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"Bluetooth: hci0: ACL packet for unknown connection handle 256\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/modprobe.d/disable_btusb_autosuspend.conf"}]},{"type":"text","value":" with following content:"}]},{"type":"element","tag":"code","props":{"code":"# Disable autosuspend for btusb to make the bluetooth keyboard work again\noptions btusb enable_autosuspend=n\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"# Disable autosuspend for btusb to make the bluetooth keyboard work again\noptions btusb enable_autosuspend=n\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run"}]},{"type":"element","tag":"code","props":{"code":"mkinitcpio -P\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"mkinitcpio -P\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Reboot and debug with"}]},{"type":"element","tag":"code","props":{"code":"$ systool -v -m btusb | grep autosuspend\n enable_autosuspend = \"N\" # should be \"N\"\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"$ systool -v -m btusb | grep autosuspend\n enable_autosuspend = \"N\" # should be \"N\"\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"also"},"children":[{"type":"text","value":"Also"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"That could be either "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"btusb.enable_autosuspend=n"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"usbcore.autosuspend=-1"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"TLP has settings for BTUSB, check it to exclude your device from autosuspend"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"There's a guy on ubuntuforums, who wrote "},{"type":"element","tag":"a","props":{"href":"https://ubuntuforums.org/showthread.php?t=2159645&page=6&p=12926730#post12926730","rel":["nofollow"]},"children":[{"type":"text","value":"solution"}]},{"type":"text","value":", which disables autosuspend manually"}]}]},{"type":"element","tag":"h2","props":{"id":"refs"},"children":[{"type":"text","value":"Refs"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://bbs.archlinux.org/viewtopic.php?id=236479","rel":["nofollow"]},"children":[{"type":"text","value":"Bluetooth keyboard disconnects randomly"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://bbs.archlinux.org/viewtopic.php?id=275962","rel":["nofollow"]},"children":[{"type":"text","value":"Bluetooth keeps turning off"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://wiki.archlinux.org/title/Bluetooth#Device_connects,_then_disconnects_after_a_few_moments","rel":["nofollow"]},"children":[{"type":"text","value":"ArchWiki: Device connects, then disconnects after a few moments"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://ubuntuforums.org/showthread.php?t=2159645&page=6&p=12926730#post12926730","rel":["nofollow"]},"children":[{"type":"text","value":"Said solution with a script in rc.local"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"When receiving messages like this:"}]},{"type":"element","tag":"code","props":{"code":"Bluetooth: hci0: ACL packet for unknown connection handle 256\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c92475"},"children":[{"type":"text","value":"Bluetooth: hci0: ACL packet "}]},{"type":"element","tag":"span","props":{"class":"ct-3fc0e0"},"children":[{"type":"text","value":"for"}]},{"type":"element","tag":"span","props":{"class":"ct-c92475"},"children":[{"type":"text","value":" unknown connection handle 256"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/modprobe.d/disable_btusb_autosuspend.conf"}]},{"type":"text","value":" with following content:"}]},{"type":"element","tag":"code","props":{"code":"# Disable autosuspend for btusb to make the bluetooth keyboard work again\noptions btusb enable_autosuspend=n\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1f60c"},"children":[{"type":"text","value":"# Disable autosuspend for btusb to make the bluetooth keyboard work again"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c92475"},"children":[{"type":"text","value":"options btusb enable_autosuspend=n"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run"}]},{"type":"element","tag":"code","props":{"code":"mkinitcpio -P\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c92475"},"children":[{"type":"text","value":"mkinitcpio -P"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Reboot and debug with"}]},{"type":"element","tag":"code","props":{"code":"$ systool -v -m btusb | grep autosuspend\n enable_autosuspend = \"N\" # should be \"N\"\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c92475"},"children":[{"type":"text","value":"$ systool -v -m btusb "}]},{"type":"element","tag":"span","props":{"class":"ct-3fc0e0"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-c92475"},"children":[{"type":"text","value":" grep autosuspend"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c92475"},"children":[{"type":"text","value":" enable_autosuspend = "}]},{"type":"element","tag":"span","props":{"class":"ct-3e1943"},"children":[{"type":"text","value":"\"N\""}]},{"type":"element","tag":"span","props":{"class":"ct-c92475"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b1f60c"},"children":[{"type":"text","value":"# should be \"N\""}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"also"},"children":[{"type":"text","value":"Also"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"That could be either "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"btusb.enable_autosuspend=n"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"usbcore.autosuspend=-1"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"TLP has settings for BTUSB, check it to exclude your device from autosuspend"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"There's a guy on ubuntuforums, who wrote "},{"type":"element","tag":"a","props":{"href":"https://ubuntuforums.org/showthread.php?t=2159645&page=6&p=12926730#post12926730","rel":["nofollow"]},"children":[{"type":"text","value":"solution"}]},{"type":"text","value":", which disables autosuspend manually"}]}]},{"type":"element","tag":"h2","props":{"id":"refs"},"children":[{"type":"text","value":"Refs"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://bbs.archlinux.org/viewtopic.php?id=236479","rel":["nofollow"]},"children":[{"type":"text","value":"Bluetooth keyboard disconnects randomly"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://bbs.archlinux.org/viewtopic.php?id=275962","rel":["nofollow"]},"children":[{"type":"text","value":"Bluetooth keeps turning off"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://wiki.archlinux.org/title/Bluetooth#Device_connects,_then_disconnects_after_a_few_moments","rel":["nofollow"]},"children":[{"type":"text","value":"ArchWiki: Device connects, then disconnects after a few moments"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://ubuntuforums.org/showthread.php?t=2159645&page=6&p=12926730#post12926730","rel":["nofollow"]},"children":[{"type":"text","value":"Said solution with a script in rc.local"}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-3e1943{color:#A5D6FF}.ct-b1f60c{color:#8B949E}.ct-3fc0e0{color:#FF7B72}.ct-c92475{color:#C9D1D9}.light .ct-c92475{color:#657B83}.light .ct-3fc0e0{color:#859900}.light .ct-b1f60c{color:#93A1A1}.light .ct-3e1943{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"also","depth":2,"text":"Also"},{"id":"refs","depth":2,"text":"Refs"}]}},"_type":"markdown","_id":"content:Linux:Fixing lagging USB Headphones.md","_source":"content","_file":"Linux/Fixing lagging USB Headphones.md","_extension":"md"},{"_path":"/linux/gitea-for-git-hosting","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Gitea For Git Hosting","description":"Self-hosted #git repositories with gitea and #docker.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Self-hosted #git repositories with "},{"type":"element","tag":"a","props":{"href":"https://gitea.io/ru-ru/","rel":["nofollow"]},"children":[{"type":"text","value":"gitea"}]},{"type":"text","value":" and #docker."}]},{"type":"element","tag":"h2","props":{"id":"setting-up-with-docker-compose"},"children":[{"type":"text","value":"Setting up with docker-compose"}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nnetworks:\n gitea:\n external: false\nservices:\n server:\n image: gitea/gitea:latest\n container_name: gitea\n environment:\n - USER_UID=1000\n - USER_GID=1000\n restart: always\n networks:\n - gitea\n volumes:\n - ./var/lib/gitea:/data\n - ./etc/gitea:/etc/gitea\n - /etc/timezone:/etc/timezone:ro\n - /etc/localtime:/etc/localtime:ro\n ports:\n - \"3000:3000\"\n - \"222:22\"\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: \"3\"\n\nnetworks:\n gitea:\n external: false\nservices:\n server:\n image: gitea/gitea:latest\n container_name: gitea\n environment:\n - USER_UID=1000\n - USER_GID=1000\n restart: always\n networks:\n - gitea\n volumes:\n - ./var/lib/gitea:/data\n - ./etc/gitea:/etc/gitea\n - /etc/timezone:/etc/timezone:ro\n - /etc/localtime:/etc/localtime:ro\n ports:\n - \"3000:3000\"\n - \"222:22\"\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Self-hosted #git repositories with "},{"type":"element","tag":"a","props":{"href":"https://gitea.io/ru-ru/","rel":["nofollow"]},"children":[{"type":"text","value":"gitea"}]},{"type":"text","value":" and #docker."}]},{"type":"element","tag":"h2","props":{"id":"setting-up-with-docker-compose"},"children":[{"type":"text","value":"Setting up with docker-compose"}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nnetworks:\n gitea:\n external: false\nservices:\n server:\n image: gitea/gitea:latest\n container_name: gitea\n environment:\n - USER_UID=1000\n - USER_GID=1000\n restart: always\n networks:\n - gitea\n volumes:\n - ./var/lib/gitea:/data\n - ./etc/gitea:/etc/gitea\n - /etc/timezone:/etc/timezone:ro\n - /etc/localtime:/etc/localtime:ro\n ports:\n - \"3000:3000\"\n - \"222:22\"\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"\"3\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"gitea"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"external"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6e94ca"},"children":[{"type":"text","value":"false"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"gitea/gitea:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"gitea"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"USER_UID=1000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"USER_GID=1000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"gitea"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"./var/lib/gitea:/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"./etc/gitea:/etc/gitea"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"/etc/timezone:/etc/timezone:ro"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"/etc/localtime:/etc/localtime:ro"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"\"3000:3000\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"\"222:22\""}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-6e94ca{color:#79C0FF}.ct-09000e{color:#A5D6FF}.ct-6227ac{color:#C9D1D9}.ct-38d0af{color:#7EE787}.light .ct-38d0af{color:#268BD2}.light .ct-6227ac{color:#657B83}.light .ct-09000e{color:#2AA198}.light .ct-6e94ca{color:#B58900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"setting-up-with-docker-compose","depth":2,"text":"Setting up with docker-compose"}]}},"_type":"markdown","_id":"content:Linux:Gitea for git hosting.md","_source":"content","_file":"Linux/Gitea for git hosting.md","_extension":"md"},{"_path":"/linux/google-photos-alternative-with-photoprism","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Google Photos Alternative With Photoprism","description":"Photo Prism is a free alternative to Google photos, can be set up with #docker.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://photoprism.app/","rel":["nofollow"]},"children":[{"type":"text","value":"Photo Prism"}]},{"type":"text","value":" is a free alternative to Google photos, can be set up with #docker."}]},{"type":"element","tag":"h2","props":{"id":"docker-compose-file-to-run-it"},"children":[{"type":"text","value":"Docker compose file to run it"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Check out current "},{"type":"element","tag":"a","props":{"href":"https://dl.photoprism.app/docker/docker-compose.yml","rel":["nofollow"]},"children":[{"type":"text","value":"example"}]},{"type":"text","value":" at photoprism's "},{"type":"element","tag":"a","props":{"href":"https://docs.photoprism.app/getting-started/docker-compose/","rel":["nofollow"]},"children":[{"type":"text","value":"documentation"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"version: '3.5'\n\nservices:\n photoprism:\n container_name: photoprism__app\n image: photoprism/photoprism:latest\n depends_on:\n - mariadb\n restart: unless-stopped\n security_opt:\n - seccomp:unconfined\n - apparmor:unconfined\n ports:\n - 2342:2342 # HTTP port (host:container)\n environment:\n PHOTOPRISM_ADMIN_PASSWORD: \"password\"\n PHOTOPRISM_SITE_URL: \"https://service.url/\"\n PHOTOPRISM_ORIGINALS_LIMIT: 5000\n PHOTOPRISM_HTTP_COMPRESSION: \"gzip\"\n PHOTOPRISM_DEBUG: \"false\" \n PHOTOPRISM_PUBLIC: \"false\" \n PHOTOPRISM_READONLY: \"false\" \n PHOTOPRISM_EXPERIMENTAL: \"false\"\n PHOTOPRISM_DISABLE_CHOWN: \"false\"\n PHOTOPRISM_DISABLE_WEBDAV: \"false\" \n PHOTOPRISM_DISABLE_SETTINGS: \"false\"\n PHOTOPRISM_DISABLE_TENSORFLOW: \"false\"\n PHOTOPRISM_DISABLE_FACES: \"false\" \n PHOTOPRISM_DISABLE_CLASSIFICATION: \"false\"\n PHOTOPRISM_DARKTABLE_PRESETS: \"false\" \n PHOTOPRISM_DETECT_NSFW: \"false\" \n PHOTOPRISM_UPLOAD_NSFW: \"true\" \n PHOTOPRISM_DATABASE_DRIVER: \"mysql\" \n PHOTOPRISM_DATABASE_SERVER: \"mariadb:3306\"\n PHOTOPRISM_DATABASE_NAME: \"photoprism\" \n PHOTOPRISM_DATABASE_USER: \"root\" \n PHOTOPRISM_DATABASE_PASSWORD: \"insecure\" \n PHOTOPRISM_SITE_TITLE: \"PhotoPrism\"\n PHOTOPRISM_SITE_CAPTION: \"Browse Your Life\"\n PHOTOPRISM_SITE_DESCRIPTION: \"\"\n      PHOTOPRISM_SITE_AUTHOR: \"\"\n      HOME: \"/photoprism\"\n    working_dir: \"/photoprism\"\n    volumes:\n      - \"./data/originals:/photoprism/originals\"    \n      - \"./data/imports:/photoprism/import\"\n      - \"./data/storage:/photoprism/storage\"\n  mariadb:\n    container_name: photoprism__db\n    restart: unless-stopped\n    image: mariadb:10.6\n    security_opt:\n      - seccomp:unconfined\n      - apparmor:unconfined\n    command: mysqld --innodb-buffer-pool-size=128M --transaction-isolation=READ-COMMITTED --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci --max-connections=512 --innodb-rollback-on-timeout=OFF --innodb-lock-wait-timeout=120\n    volumes:\n      - \"./database:/var/lib/mysql\" # Important, don't remove\n    environment:\n      MYSQL_ROOT_PASSWORD: insecure\n      MYSQL_DATABASE: photoprism\n      MYSQL_USER: photoprism\n      MYSQL_PASSWORD: insecure\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: '3.5'\n\nservices:\n photoprism:\n container_name: photoprism__app\n image: photoprism/photoprism:latest\n depends_on:\n - mariadb\n restart: unless-stopped\n security_opt:\n - seccomp:unconfined\n - apparmor:unconfined\n ports:\n - 2342:2342 # HTTP port (host:container)\n environment:\n PHOTOPRISM_ADMIN_PASSWORD: \"password\"\n PHOTOPRISM_SITE_URL: \"https://service.url/\"\n PHOTOPRISM_ORIGINALS_LIMIT: 5000\n PHOTOPRISM_HTTP_COMPRESSION: \"gzip\"\n PHOTOPRISM_DEBUG: \"false\" \n PHOTOPRISM_PUBLIC: \"false\" \n PHOTOPRISM_READONLY: \"false\" \n PHOTOPRISM_EXPERIMENTAL: \"false\"\n PHOTOPRISM_DISABLE_CHOWN: \"false\"\n PHOTOPRISM_DISABLE_WEBDAV: \"false\" \n PHOTOPRISM_DISABLE_SETTINGS: \"false\"\n PHOTOPRISM_DISABLE_TENSORFLOW: \"false\"\n PHOTOPRISM_DISABLE_FACES: \"false\" \n PHOTOPRISM_DISABLE_CLASSIFICATION: \"false\"\n PHOTOPRISM_DARKTABLE_PRESETS: \"false\" \n PHOTOPRISM_DETECT_NSFW: \"false\" \n PHOTOPRISM_UPLOAD_NSFW: \"true\" \n PHOTOPRISM_DATABASE_DRIVER: \"mysql\" \n PHOTOPRISM_DATABASE_SERVER: \"mariadb:3306\"\n PHOTOPRISM_DATABASE_NAME: \"photoprism\" \n PHOTOPRISM_DATABASE_USER: \"root\" \n PHOTOPRISM_DATABASE_PASSWORD: \"insecure\" \n PHOTOPRISM_SITE_TITLE: \"PhotoPrism\"\n PHOTOPRISM_SITE_CAPTION: \"Browse Your Life\"\n PHOTOPRISM_SITE_DESCRIPTION: \"\"\n      PHOTOPRISM_SITE_AUTHOR: \"\"\n      HOME: \"/photoprism\"\n    working_dir: \"/photoprism\"\n    volumes:\n      - \"./data/originals:/photoprism/originals\"    \n      - \"./data/imports:/photoprism/import\"\n      - \"./data/storage:/photoprism/storage\"\n  mariadb:\n    container_name: photoprism__db\n    restart: unless-stopped\n    image: mariadb:10.6\n    security_opt:\n      - seccomp:unconfined\n      - apparmor:unconfined\n    command: mysqld --innodb-buffer-pool-size=128M --transaction-isolation=READ-COMMITTED --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci --max-connections=512 --innodb-rollback-on-timeout=OFF --innodb-lock-wait-timeout=120\n    volumes:\n      - \"./database:/var/lib/mysql\" # Important, don't remove\n    environment:\n      MYSQL_ROOT_PASSWORD: insecure\n      MYSQL_DATABASE: photoprism\n      MYSQL_USER: photoprism\n      MYSQL_PASSWORD: insecure\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://photoprism.app/","rel":["nofollow"]},"children":[{"type":"text","value":"Photo Prism"}]},{"type":"text","value":" is a free alternative to Google photos, can be set up with #docker."}]},{"type":"element","tag":"h2","props":{"id":"docker-compose-file-to-run-it"},"children":[{"type":"text","value":"Docker compose file to run it"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Check out current "},{"type":"element","tag":"a","props":{"href":"https://dl.photoprism.app/docker/docker-compose.yml","rel":["nofollow"]},"children":[{"type":"text","value":"example"}]},{"type":"text","value":" at photoprism's "},{"type":"element","tag":"a","props":{"href":"https://docs.photoprism.app/getting-started/docker-compose/","rel":["nofollow"]},"children":[{"type":"text","value":"documentation"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"version: '3.5'\n\nservices:\n photoprism:\n container_name: photoprism__app\n image: photoprism/photoprism:latest\n depends_on:\n - mariadb\n restart: unless-stopped\n security_opt:\n - seccomp:unconfined\n - apparmor:unconfined\n ports:\n - 2342:2342 # HTTP port (host:container)\n environment:\n PHOTOPRISM_ADMIN_PASSWORD: \"password\"\n PHOTOPRISM_SITE_URL: \"https://service.url/\"\n PHOTOPRISM_ORIGINALS_LIMIT: 5000\n PHOTOPRISM_HTTP_COMPRESSION: \"gzip\"\n PHOTOPRISM_DEBUG: \"false\" \n PHOTOPRISM_PUBLIC: \"false\" \n PHOTOPRISM_READONLY: \"false\" \n PHOTOPRISM_EXPERIMENTAL: \"false\"\n PHOTOPRISM_DISABLE_CHOWN: \"false\"\n PHOTOPRISM_DISABLE_WEBDAV: \"false\" \n PHOTOPRISM_DISABLE_SETTINGS: \"false\"\n PHOTOPRISM_DISABLE_TENSORFLOW: \"false\"\n PHOTOPRISM_DISABLE_FACES: \"false\" \n PHOTOPRISM_DISABLE_CLASSIFICATION: \"false\"\n PHOTOPRISM_DARKTABLE_PRESETS: \"false\" \n PHOTOPRISM_DETECT_NSFW: \"false\" \n PHOTOPRISM_UPLOAD_NSFW: \"true\" \n PHOTOPRISM_DATABASE_DRIVER: \"mysql\" \n PHOTOPRISM_DATABASE_SERVER: \"mariadb:3306\"\n PHOTOPRISM_DATABASE_NAME: \"photoprism\" \n PHOTOPRISM_DATABASE_USER: \"root\" \n PHOTOPRISM_DATABASE_PASSWORD: \"insecure\" \n PHOTOPRISM_SITE_TITLE: \"PhotoPrism\"\n PHOTOPRISM_SITE_CAPTION: \"Browse Your Life\"\n PHOTOPRISM_SITE_DESCRIPTION: \"\"\n      PHOTOPRISM_SITE_AUTHOR: \"\"\n      HOME: \"/photoprism\"\n    working_dir: \"/photoprism\"\n    volumes:\n      - \"./data/originals:/photoprism/originals\"    \n      - \"./data/imports:/photoprism/import\"\n      - \"./data/storage:/photoprism/storage\"\n  mariadb:\n    container_name: photoprism__db\n    restart: unless-stopped\n    image: mariadb:10.6\n    security_opt:\n      - seccomp:unconfined\n      - apparmor:unconfined\n    command: mysqld --innodb-buffer-pool-size=128M --transaction-isolation=READ-COMMITTED --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci --max-connections=512 --innodb-rollback-on-timeout=OFF --innodb-lock-wait-timeout=120\n    volumes:\n      - \"./database:/var/lib/mysql\" # Important, don't remove\n    environment:\n      MYSQL_ROOT_PASSWORD: insecure\n      MYSQL_DATABASE: photoprism\n      MYSQL_USER: photoprism\n      MYSQL_PASSWORD: insecure\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"'3.5'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"photoprism"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"photoprism__app"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"photoprism/photoprism:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"depends_on"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"mariadb"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"unless-stopped"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"security_opt"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"seccomp:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"apparmor:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"2342:2342"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9477a5"},"children":[{"type":"text","value":"# HTTP port (host:container)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_ADMIN_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"password\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"https://service.url/\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_ORIGINALS_LIMIT"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-db7588"},"children":[{"type":"text","value":"5000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_HTTP_COMPRESSION"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"gzip\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DEBUG"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_PUBLIC"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_READONLY"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_EXPERIMENTAL"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_CHOWN"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_WEBDAV"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_SETTINGS"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_TENSORFLOW"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_FACES"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_CLASSIFICATION"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DARKTABLE_PRESETS"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DETECT_NSFW"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_UPLOAD_NSFW"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"true\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_DRIVER"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"mysql\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_SERVER"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"mariadb:3306\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_NAME"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"photoprism\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_USER"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"root\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"insecure\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_TITLE"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"PhotoPrism\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_CAPTION"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"Browse Your Life\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_DESCRIPTION"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_AUTHOR"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"HOME"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"/photoprism\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"working_dir"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"/photoprism\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"./data/originals:/photoprism/originals\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"    "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"./data/imports:/photoprism/import\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"./data/storage:/photoprism/storage\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"mariadb"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"photoprism__db"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"unless-stopped"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"mariadb:10.6"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"security_opt"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"seccomp:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"apparmor:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"command"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"mysqld --innodb-buffer-pool-size=128M --transaction-isolation=READ-COMMITTED --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci --max-connections=512 --innodb-rollback-on-timeout=OFF --innodb-lock-wait-timeout=120"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"./database:/var/lib/mysql\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9477a5"},"children":[{"type":"text","value":"# Important, don't remove"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"MYSQL_ROOT_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"insecure"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"MYSQL_DATABASE"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"photoprism"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"MYSQL_USER"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"photoprism"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"MYSQL_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"insecure"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-db7588{color:#79C0FF}.ct-9477a5{color:#8B949E}.ct-525fbc{color:#A5D6FF}.ct-4c91c4{color:#C9D1D9}.ct-18810c{color:#7EE787}.light .ct-18810c{color:#268BD2}.light .ct-4c91c4{color:#657B83}.light .ct-525fbc{color:#2AA198}.light .ct-9477a5{color:#93A1A1}.light .ct-db7588{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"docker-compose-file-to-run-it","depth":2,"text":"Docker compose file to run it"}]}},"_type":"markdown","_id":"content:Linux:Google photos alternative with Photoprism.md","_source":"content","_file":"Linux/Google photos alternative with Photoprism.md","_extension":"md"},{"_path":"/linux/linux-on-asus-zenbook-um3402-ya","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Linux On Asus Zenbook UM3402 YA","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"installing-linux-with-dualboot-alongside-windows-11"},"children":[{"type":"text","value":"Installing Linux with DualBoot alongside Windows 11"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://www.asus.com/support/FAQ/1047461/","rel":["nofollow"]},"children":[{"type":"text","value":"Disable BitLocker in Windows"}]},{"type":"text","value":", don't forget to backup your key"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://www.asus.com/me-en/support/FAQ/1044688/#Win11","rel":["nofollow"]},"children":[{"type":"text","value":"Shrink system partition"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Disable Secure Boot in Bios:"},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Pressing F2 while booting"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Then F7 in bios"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Select \"Security\" -> \"Secure Boot\" -> Disable."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Press F10 to save and reboot"}]}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Boot in windows, check that everything's wotking"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Burn image with "},{"type":"element","tag":"a","props":{"href":"https://rufus.ie/","rel":["nofollow"]},"children":[{"type":"text","value":"rufus"}]},{"type":"text","value":", reboot, press F2, choose your USB drive as first boot option"}]}]},{"type":"element","tag":"h2","props":{"id":"getting-bluetooth-working-with-mediatek-7921e"},"children":[{"type":"text","value":"Getting bluetooth working with Mediatek 7921e"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Problem"}]},{"type":"text","value":": WiFi is working on Zenbook UM3402-YA, but bluetooth doesn't."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"According to this "},{"type":"element","tag":"a","props":{"href":"https://www.linux.org/threads/solved-wifi-adaptator-not-found-mediatek-wi-fi-6-mt7921-wireless-lan-card.37699/page-2#post-143291","rel":["nofollow"]},"children":[{"type":"text","value":"answer"}]},{"type":"text","value":" you should just turn your laptop off, disconnect power supply and "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"hold power key for 60 seconds"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"After that press Power key again and wait for about 10-20sec for asus logo to appear. Then "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"press F2 and disable secure boot again"}]},{"type":"text","value":", that's the necessary part."}]},{"type":"element","tag":"h2","props":{"id":"power-usage-optimizations"},"children":[{"type":"text","value":"Power usage optimizations"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Install "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"tlp"}]},{"type":"text","value":" and enable it with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"systemctl enable --now tlp"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"installing-linux-with-dualboot-alongside-windows-11"},"children":[{"type":"text","value":"Installing Linux with DualBoot alongside Windows 11"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://www.asus.com/support/FAQ/1047461/","rel":["nofollow"]},"children":[{"type":"text","value":"Disable BitLocker in Windows"}]},{"type":"text","value":", don't forget to backup your key"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://www.asus.com/me-en/support/FAQ/1044688/#Win11","rel":["nofollow"]},"children":[{"type":"text","value":"Shrink system partition"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Disable Secure Boot in Bios:"},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Pressing F2 while booting"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Then F7 in bios"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Select \"Security\" -> \"Secure Boot\" -> Disable."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Press F10 to save and reboot"}]}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Boot in windows, check that everything's wotking"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Burn image with "},{"type":"element","tag":"a","props":{"href":"https://rufus.ie/","rel":["nofollow"]},"children":[{"type":"text","value":"rufus"}]},{"type":"text","value":", reboot, press F2, choose your USB drive as first boot option"}]}]},{"type":"element","tag":"h2","props":{"id":"getting-bluetooth-working-with-mediatek-7921e"},"children":[{"type":"text","value":"Getting bluetooth working with Mediatek 7921e"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Problem"}]},{"type":"text","value":": WiFi is working on Zenbook UM3402-YA, but bluetooth doesn't."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"According to this "},{"type":"element","tag":"a","props":{"href":"https://www.linux.org/threads/solved-wifi-adaptator-not-found-mediatek-wi-fi-6-mt7921-wireless-lan-card.37699/page-2#post-143291","rel":["nofollow"]},"children":[{"type":"text","value":"answer"}]},{"type":"text","value":" you should just turn your laptop off, disconnect power supply and "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"hold power key for 60 seconds"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"After that press Power key again and wait for about 10-20sec for asus logo to appear. Then "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"press F2 and disable secure boot again"}]},{"type":"text","value":", that's the necessary part."}]},{"type":"element","tag":"h2","props":{"id":"power-usage-optimizations"},"children":[{"type":"text","value":"Power usage optimizations"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Install "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"tlp"}]},{"type":"text","value":" and enable it with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"systemctl enable --now tlp"}]}]}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"installing-linux-with-dualboot-alongside-windows-11","depth":2,"text":"Installing Linux with DualBoot alongside Windows 11"},{"id":"getting-bluetooth-working-with-mediatek-7921e","depth":2,"text":"Getting bluetooth working with Mediatek 7921e"},{"id":"power-usage-optimizations","depth":2,"text":"Power usage optimizations"}]}},"_type":"markdown","_id":"content:Linux:Linux on Asus Zenbook UM3402-YA.md","_source":"content","_file":"Linux/Linux on Asus Zenbook UM3402-YA.md","_extension":"md"},{"_path":"/linux/resume-or-start-screen-session","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Resume Or Start Screen Session","description":"Running this script will enter currently running screen session or will start new one.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Running this script will enter currently running "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"screen"}]},{"type":"text","value":" session or will start new one."}]},{"type":"element","tag":"code","props":{"code":"( screen -r bash || ( screen -d bash && screen -r bash || screen -SAm bash bash ) )\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"( screen -r bash || ( screen -d bash && screen -r bash || screen -SAm bash bash ) )\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Running this script will enter currently running "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"screen"}]},{"type":"text","value":" session or will start new one."}]},{"type":"element","tag":"code","props":{"code":"( screen -r bash || ( screen -d bash && screen -r bash || screen -SAm bash bash ) )\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8433fd"},"children":[{"type":"text","value":"( screen -r bash "}]},{"type":"element","tag":"span","props":{"class":"ct-c0622b"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-8433fd"},"children":[{"type":"text","value":" ( screen -d bash "}]},{"type":"element","tag":"span","props":{"class":"ct-c0622b"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-8433fd"},"children":[{"type":"text","value":" screen -r bash "}]},{"type":"element","tag":"span","props":{"class":"ct-c0622b"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-8433fd"},"children":[{"type":"text","value":" screen -SAm bash bash ) )"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-c0622b{color:#FF7B72}.ct-8433fd{color:#C9D1D9}.light .ct-8433fd{color:#657B83}.light .ct-c0622b{color:#859900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Linux:Resume or start screen session.md","_source":"content","_file":"Linux/Resume or start screen session.md","_extension":"md"},{"_path":"/linux/rsync-file-with-ssh","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Rsync File With SSH","description":"Downloads file from #SSH with rsync and puts it in current folder.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Downloads file from #SSH with rsync and puts it in current folder."}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\n\nPORT=22\nUSER=user\nHOST=example.com\nREMOTE_PATH=/tmp\nREMOTE_FILE=sample.text\nDEST_PATH=./\n\nrsync -a -e \"ssh -p $PORT\" -P -v \\\n \"$USER@$HOST:$REMOTE_PATH/$REMOTE_FILE\" \\\n \"$DEST_PATH\"\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"#!/bin/bash\n\nPORT=22\nUSER=user\nHOST=example.com\nREMOTE_PATH=/tmp\nREMOTE_FILE=sample.text\nDEST_PATH=./\n\nrsync -a -e \"ssh -p $PORT\" -P -v \\\n \"$USER@$HOST:$REMOTE_PATH/$REMOTE_FILE\" \\\n \"$DEST_PATH\"\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Downloads file from #SSH with rsync and puts it in current folder."}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\n\nPORT=22\nUSER=user\nHOST=example.com\nREMOTE_PATH=/tmp\nREMOTE_FILE=sample.text\nDEST_PATH=./\n\nrsync -a -e \"ssh -p $PORT\" -P -v \\\n \"$USER@$HOST:$REMOTE_PATH/$REMOTE_FILE\" \\\n \"$DEST_PATH\"\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6bdabe"},"children":[{"type":"text","value":"#!/bin/bash"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-26e021"},"children":[{"type":"text","value":"PORT=22"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-26e021"},"children":[{"type":"text","value":"USER=user"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-26e021"},"children":[{"type":"text","value":"HOST=example.com"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-26e021"},"children":[{"type":"text","value":"REMOTE_PATH=/tmp"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-26e021"},"children":[{"type":"text","value":"REMOTE_FILE=sample.text"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-26e021"},"children":[{"type":"text","value":"DEST_PATH=./"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-26e021"},"children":[{"type":"text","value":"rsync -a -e "}]},{"type":"element","tag":"span","props":{"class":"ct-e634ef"},"children":[{"type":"text","value":"\"ssh -p "}]},{"type":"element","tag":"span","props":{"class":"ct-1f63bb"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-43fe0d"},"children":[{"type":"text","value":"PORT"}]},{"type":"element","tag":"span","props":{"class":"ct-e634ef"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-26e021"},"children":[{"type":"text","value":" -P -v \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-26e021"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e634ef"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-1f63bb"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-43fe0d"},"children":[{"type":"text","value":"USER"}]},{"type":"element","tag":"span","props":{"class":"ct-e634ef"},"children":[{"type":"text","value":"@"}]},{"type":"element","tag":"span","props":{"class":"ct-1f63bb"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-43fe0d"},"children":[{"type":"text","value":"HOST"}]},{"type":"element","tag":"span","props":{"class":"ct-e634ef"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-1f63bb"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-43fe0d"},"children":[{"type":"text","value":"REMOTE_PATH"}]},{"type":"element","tag":"span","props":{"class":"ct-e634ef"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-1f63bb"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-43fe0d"},"children":[{"type":"text","value":"REMOTE_FILE"}]},{"type":"element","tag":"span","props":{"class":"ct-e634ef"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-26e021"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-26e021"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e634ef"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-1f63bb"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-43fe0d"},"children":[{"type":"text","value":"DEST_PATH"}]},{"type":"element","tag":"span","props":{"class":"ct-e634ef"},"children":[{"type":"text","value":"\""}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-43fe0d{color:#C9D1D9}.ct-1f63bb{color:#C9D1D9}.ct-e634ef{color:#A5D6FF}.ct-26e021{color:#C9D1D9}.ct-6bdabe{color:#8B949E}.light .ct-6bdabe{color:#93A1A1}.light .ct-26e021{color:#657B83}.light .ct-e634ef{color:#2AA198}.light .ct-1f63bb{color:#859900}.light .ct-43fe0d{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Linux:Rsync file with SSH.md","_source":"content","_file":"Linux/Rsync file with SSH.md","_extension":"md"},{"_path":"/linux/setting-up-nginx","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Setting Up NGINX","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"fallback-url-for-spa-s"},"children":[{"type":"text","value":"Fallback url for SPA-s"}]},{"type":"element","tag":"code","props":{"code":"server {\n # ...\n location / {\n # First attempt to serve request as file, then\n # as directory, then fall back to displaying a 404.\n try_files $uri $uri/ =404;\n }\n # ...\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"server {\n # ...\n location / {\n # First attempt to serve request as file, then\n # as directory, then fall back to displaying a 404.\n try_files $uri $uri/ =404;\n }\n # ...\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"set-up-for-uploads"},"children":[{"type":"text","value":"Set up for uploads"}]},{"type":"element","tag":"code","props":{"code":"server {\n # ...\n client_max_body_size 200M;\n # ...\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"server {\n # ...\n client_max_body_size 200M;\n # ...\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"reverse-proxy-for-https"},"children":[{"type":"text","value":"Reverse proxy for https"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Given config forwards "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https"}]},{"type":"text","value":" traffic to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"http"}]},{"type":"text","value":" on port "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"8080"}]},{"type":"text","value":" for "},{"type":"element","tag":"a","props":{"href":"https://next.vault48.org","rel":["nofollow"]},"children":[{"type":"text","value":"https://next.vault48.org"}]},{"type":"text","value":"\nwith http2 support if possible."}]},{"type":"element","tag":"code","props":{"code":"server {\n listen 80;\n server_name next.vault48.org;\n return 301 https://next.vault48.org$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n \n # managed by Certbot\n ssl_certificate /etc/letsencrypt/live/vault48.org/fullchain.pem; \n ssl_certificate_key /etc/letsencrypt/live/vault48.org/privkey.pem; \n ssl_trusted_certificate /etc/letsencrypt/live/vault48.org/chain.pem;\n \n server_name next.vault48.org;\n \n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n \n proxy_pass http://127.0.0.1:8080;\n }\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"server {\n listen 80;\n server_name next.vault48.org;\n return 301 https://next.vault48.org$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n \n # managed by Certbot\n ssl_certificate /etc/letsencrypt/live/vault48.org/fullchain.pem; \n ssl_certificate_key /etc/letsencrypt/live/vault48.org/privkey.pem; \n ssl_trusted_certificate /etc/letsencrypt/live/vault48.org/chain.pem;\n \n server_name next.vault48.org;\n \n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n \n proxy_pass http://127.0.0.1:8080;\n }\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"fallback-url-for-spa-s"},"children":[{"type":"text","value":"Fallback url for SPA-s"}]},{"type":"element","tag":"code","props":{"code":"server {\n # ...\n location / {\n # First attempt to serve request as file, then\n # as directory, then fall back to displaying a 404.\n try_files $uri $uri/ =404;\n }\n # ...\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43630c"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fc236"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bd6321"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-042ac1"},"children":[{"type":"text","value":"location"}]},{"type":"element","tag":"span","props":{"class":"ct-bd6321"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b1fd04"},"children":[{"type":"text","value":"/ "}]},{"type":"element","tag":"span","props":{"class":"ct-bd6321"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fc236"},"children":[{"type":"text","value":"# First attempt to serve request as file, then"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fc236"},"children":[{"type":"text","value":"# as directory, then fall back to displaying a 404."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e3cb66"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fc236"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"set-up-for-uploads"},"children":[{"type":"text","value":"Set up for uploads"}]},{"type":"element","tag":"code","props":{"code":"server {\n # ...\n client_max_body_size 200M;\n # ...\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43630c"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fc236"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" client_max_body_size "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"200M;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fc236"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"reverse-proxy-for-https"},"children":[{"type":"text","value":"Reverse proxy for https"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Given config forwards "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https"}]},{"type":"text","value":" traffic to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"http"}]},{"type":"text","value":" on port "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"8080"}]},{"type":"text","value":" for "},{"type":"element","tag":"a","props":{"href":"https://next.vault48.org","rel":["nofollow"]},"children":[{"type":"text","value":"https://next.vault48.org"}]},{"type":"text","value":"\nwith http2 support if possible."}]},{"type":"element","tag":"code","props":{"code":"server {\n listen 80;\n server_name next.vault48.org;\n return 301 https://next.vault48.org$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n \n # managed by Certbot\n ssl_certificate /etc/letsencrypt/live/vault48.org/fullchain.pem; \n ssl_certificate_key /etc/letsencrypt/live/vault48.org/privkey.pem; \n ssl_trusted_certificate /etc/letsencrypt/live/vault48.org/chain.pem;\n \n server_name next.vault48.org;\n \n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n \n proxy_pass http://127.0.0.1:8080;\n }\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43630c"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"80;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"next.vault48.org;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9a42cf"},"children":[{"type":"text","value":"301"}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" https://next.vault48.org"}]},{"type":"element","tag":"span","props":{"class":"ct-5daac2"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-4b2209"},"children":[{"type":"text","value":"request_uri"}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43630c"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"443 ssl http2;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"[::]:443 ssl http2;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fc236"},"children":[{"type":"text","value":"# managed by Certbot"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" ssl_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"/etc/letsencrypt/live/vault48.org/fullchain.pem; "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" ssl_certificate_key "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"/etc/letsencrypt/live/vault48.org/privkey.pem; "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" ssl_trusted_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"/etc/letsencrypt/live/vault48.org/chain.pem;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"next.vault48.org;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bd6321"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-042ac1"},"children":[{"type":"text","value":"location"}]},{"type":"element","tag":"span","props":{"class":"ct-bd6321"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b1fd04"},"children":[{"type":"text","value":"/ "}]},{"type":"element","tag":"span","props":{"class":"ct-bd6321"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" proxy_redirect "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"off;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"Host "}]},{"type":"element","tag":"span","props":{"class":"ct-5daac2"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-4b2209"},"children":[{"type":"text","value":"host"}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"X-Real-IP "}]},{"type":"element","tag":"span","props":{"class":"ct-5daac2"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-4b2209"},"children":[{"type":"text","value":"remote_addr"}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"X-Forwarded-For "}]},{"type":"element","tag":"span","props":{"class":"ct-5daac2"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-4b2209"},"children":[{"type":"text","value":"proxy_add_x_forwarded_for"}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" proxy_pass "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"http://127.0.0.1:8080;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-4b2209{color:#C9D1D9}.ct-5daac2{color:#C9D1D9}.ct-9a42cf{color:#79C0FF}.ct-e8f801{color:#FF7B72}.ct-e3cb66{color:#FF7B72}.ct-b1fd04{color:#FFA657}.ct-042ac1{color:#FF7B72}.ct-bd6321{color:#C9D1D9}.ct-0fc236{color:#8B949E}.ct-1a3354{color:#C9D1D9}.ct-43630c{color:#FF7B72}.light .ct-43630c{color:#073642}.light .ct-1a3354{color:#657B83}.light .ct-0fc236{color:#93A1A1}.light .ct-bd6321{color:#657B83}.light .ct-042ac1{color:#073642}.light .ct-b1fd04{color:#657B83}.light .ct-e3cb66{color:#657B83}.light .ct-e8f801{color:#859900}.light .ct-9a42cf{color:#D33682}.light .ct-5daac2{color:#859900}.light .ct-4b2209{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"fallback-url-for-spa-s","depth":2,"text":"Fallback url for SPA-s"},{"id":"set-up-for-uploads","depth":2,"text":"Set up for uploads"},{"id":"reverse-proxy-for-https","depth":2,"text":"Reverse proxy for https"}]}},"_type":"markdown","_id":"content:Linux:Setting up NGINX.md","_source":"content","_file":"Linux/Setting up NGINX.md","_extension":"md"},{"_path":"/linux/ssh","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"SSH","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"config-aliases-for-ssh-hosts"},"children":[{"type":"text","value":"Config aliases for #SSH hosts"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"#SSH config can be used to made aliases for different hosts. Should be put at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"~/.ssh/config"}]},{"type":"text","value":". To simply call "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"ssh router"}]},{"type":"text","value":" without parameters, use this:"}]},{"type":"element","tag":"code","props":{"code":"Host router\n HostName 192.168.0.1\n IdentityFile ~/.ssh/id_rsa\n User root\n Port 22522\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"Host router\n HostName 192.168.0.1\n IdentityFile ~/.ssh/id_rsa\n User root\n Port 22522\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"config-aliases-for-ssh-hosts"},"children":[{"type":"text","value":"Config aliases for #SSH hosts"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"#SSH config can be used to made aliases for different hosts. Should be put at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"~/.ssh/config"}]},{"type":"text","value":". To simply call "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"ssh router"}]},{"type":"text","value":" without parameters, use this:"}]},{"type":"element","tag":"code","props":{"code":"Host router\n HostName 192.168.0.1\n IdentityFile ~/.ssh/id_rsa\n User root\n Port 22522\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"Host router\n HostName 192.168.0.1\n IdentityFile ~/.ssh/id_rsa\n User root\n Port 22522"}]}]}]}]}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"config-aliases-for-ssh-hosts","depth":2,"text":"Config aliases for #SSH hosts"}]}},"_type":"markdown","_id":"content:Linux:SSH.md","_source":"content","_file":"Linux/SSH.md","_extension":"md"},{"_path":"/obsidian/self-hosted-obsidian-sync-with-couchdb","_dir":"obsidian","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Self Hosted Obsidian Sync With CouchDB","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vrtmrz/obsidian-livesync","rel":["nofollow"]},"children":[{"type":"text","value":"Main documentation"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vrtmrz/obsidian-livesync/blob/main/docs/setup_own_server.md","rel":["nofollow"]},"children":[{"type":"text","value":"Setting up couchdb"}]}]}]},{"type":"element","tag":"h2","props":{"id":"setting-up-environment"},"children":[{"type":"text","value":"Setting up environment"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"First, you should create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-compose.yml"}]},{"type":"text","value":" with the following contents:"}]},{"type":"element","tag":"code","props":{"code":"version: '3'\nservices:\n couchserver:\n container_name: obsidian__database\n image: couchdb\n restart: always\n ports:\n - \"5984:5984\"\n environment:\n - COUCHDB_USER=user\n - COUCHDB_PASSWORD=somepassword\n volumes:\n - ./couchdb/dbdata:/opt/couchdb/data\n - ./couchdb/local.ini:/opt/couchdb/etc/local.ini\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: '3'\nservices:\n couchserver:\n container_name: obsidian__database\n image: couchdb\n restart: always\n ports:\n - \"5984:5984\"\n environment:\n - COUCHDB_USER=user\n - COUCHDB_PASSWORD=somepassword\n volumes:\n - ./couchdb/dbdata:/opt/couchdb/data\n - ./couchdb/local.ini:/opt/couchdb/etc/local.ini\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then create initial config at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./couchdb/local.ini"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"[couchdb]\nsingle_node=true\nmax_document_size=50000000\nmax_http_request_size=4294967296\n\n[chttpd]\nrequire_valid_user = true\n\n[chttpd_auth]\nrequire_valid_user = true\nauthentication_redirect = /_utils/session.html\n\n[httpd]\nWWW-Authenticate = Basic realm=\"couchdb\"\nenable_cors = true\n\n[cors]\norigins = app://obsidian.md,capacitor://localhost,http://localhost\ncredentials = true\nheaders = accept, authorization, content-type, origin, referer\nmethods = GET, PUT, POST, HEAD, DELETE\nmax_age = 3600\n","language":"ini"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"[couchdb]\nsingle_node=true\nmax_document_size=50000000\nmax_http_request_size=4294967296\n\n[chttpd]\nrequire_valid_user = true\n\n[chttpd_auth]\nrequire_valid_user = true\nauthentication_redirect = /_utils/session.html\n\n[httpd]\nWWW-Authenticate = Basic realm=\"couchdb\"\nenable_cors = true\n\n[cors]\norigins = app://obsidian.md,capacitor://localhost,http://localhost\ncredentials = true\nheaders = accept, authorization, content-type, origin, referer\nmethods = GET, PUT, POST, HEAD, DELETE\nmax_age = 3600\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then, in order to have sync on mobile devices, we will need a reverse proxy with nginx at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/nginx/sites-enabled/obsidian-couchdb"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"server {\n listen 80;\n listen [::]:80;\n server_name couchdb.yourhost.com;\n return 301 https://$host$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n\n ssl_certificate /etc/letsencrypt/live/yourhost.com/fullchain.pem; # managed by Certbot\n ssl_certificate_key /etc/letsencrypt/live/yourhost.com/privkey.pem; # managed by Certbot\n ssl_trusted_certificate /etc/letsencrypt/live/yourhost.com/chain.pem;\n\n server_name couchdb.yourhost.com;\n client_max_body_size 200M;\n\n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n\n proxy_pass http://127.0.0.1:5984;\n }\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"server {\n listen 80;\n listen [::]:80;\n server_name couchdb.yourhost.com;\n return 301 https://$host$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n\n ssl_certificate /etc/letsencrypt/live/yourhost.com/fullchain.pem; # managed by Certbot\n ssl_certificate_key /etc/letsencrypt/live/yourhost.com/privkey.pem; # managed by Certbot\n ssl_trusted_certificate /etc/letsencrypt/live/yourhost.com/chain.pem;\n\n server_name couchdb.yourhost.com;\n client_max_body_size 200M;\n\n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n\n proxy_pass http://127.0.0.1:5984;\n }\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"setting-up-obsidian"},"children":[{"type":"text","value":"Setting up Obsidian"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Install "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Self-hosted LiveSync"}]},{"type":"text","value":" plugin"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Change host to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https://yourhost.com"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Specify username and password"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Press "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"test"}]},{"type":"text","value":", then "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fetch database"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vrtmrz/obsidian-livesync","rel":["nofollow"]},"children":[{"type":"text","value":"Main documentation"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vrtmrz/obsidian-livesync/blob/main/docs/setup_own_server.md","rel":["nofollow"]},"children":[{"type":"text","value":"Setting up couchdb"}]}]}]},{"type":"element","tag":"h2","props":{"id":"setting-up-environment"},"children":[{"type":"text","value":"Setting up environment"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"First, you should create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-compose.yml"}]},{"type":"text","value":" with the following contents:"}]},{"type":"element","tag":"code","props":{"code":"version: '3'\nservices:\n couchserver:\n container_name: obsidian__database\n image: couchdb\n restart: always\n ports:\n - \"5984:5984\"\n environment:\n - COUCHDB_USER=user\n - COUCHDB_PASSWORD=somepassword\n volumes:\n - ./couchdb/dbdata:/opt/couchdb/data\n - ./couchdb/local.ini:/opt/couchdb/etc/local.ini\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d64517"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-53f02b"},"children":[{"type":"text","value":"'3'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d64517"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d64517"},"children":[{"type":"text","value":"couchserver"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d64517"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-53f02b"},"children":[{"type":"text","value":"obsidian__database"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d64517"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-53f02b"},"children":[{"type":"text","value":"couchdb"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d64517"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-53f02b"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d64517"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-53f02b"},"children":[{"type":"text","value":"\"5984:5984\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d64517"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-53f02b"},"children":[{"type":"text","value":"COUCHDB_USER=user"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-53f02b"},"children":[{"type":"text","value":"COUCHDB_PASSWORD=somepassword"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d64517"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-53f02b"},"children":[{"type":"text","value":"./couchdb/dbdata:/opt/couchdb/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-53f02b"},"children":[{"type":"text","value":"./couchdb/local.ini:/opt/couchdb/etc/local.ini"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then create initial config at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./couchdb/local.ini"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"[couchdb]\nsingle_node=true\nmax_document_size=50000000\nmax_http_request_size=4294967296\n\n[chttpd]\nrequire_valid_user = true\n\n[chttpd_auth]\nrequire_valid_user = true\nauthentication_redirect = /_utils/session.html\n\n[httpd]\nWWW-Authenticate = Basic realm=\"couchdb\"\nenable_cors = true\n\n[cors]\norigins = app://obsidian.md,capacitor://localhost,http://localhost\ncredentials = true\nheaders = accept, authorization, content-type, origin, referer\nmethods = GET, PUT, POST, HEAD, DELETE\nmax_age = 3600\n","language":"ini"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"[couchdb]\nsingle_node=true\nmax_document_size=50000000\nmax_http_request_size=4294967296\n\n[chttpd]\nrequire_valid_user = true\n\n[chttpd_auth]\nrequire_valid_user = true\nauthentication_redirect = /_utils/session.html\n\n[httpd]\nWWW-Authenticate = Basic realm=\"couchdb\"\nenable_cors = true\n\n[cors]\norigins = app://obsidian.md,capacitor://localhost,http://localhost\ncredentials = true\nheaders = accept, authorization, content-type, origin, referer\nmethods = GET, PUT, POST, HEAD, DELETE\nmax_age = 3600"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then, in order to have sync on mobile devices, we will need a reverse proxy with nginx at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/nginx/sites-enabled/obsidian-couchdb"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"server {\n listen 80;\n listen [::]:80;\n server_name couchdb.yourhost.com;\n return 301 https://$host$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n\n ssl_certificate /etc/letsencrypt/live/yourhost.com/fullchain.pem; # managed by Certbot\n ssl_certificate_key /etc/letsencrypt/live/yourhost.com/privkey.pem; # managed by Certbot\n ssl_trusted_certificate /etc/letsencrypt/live/yourhost.com/chain.pem;\n\n server_name couchdb.yourhost.com;\n client_max_body_size 200M;\n\n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n\n proxy_pass http://127.0.0.1:5984;\n }\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-18900e"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"80;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"[::]:80;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"couchdb.yourhost.com;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fd005d"},"children":[{"type":"text","value":"301"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" https://"}]},{"type":"element","tag":"span","props":{"class":"ct-6b7a71"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-efa454"},"children":[{"type":"text","value":"host"}]},{"type":"element","tag":"span","props":{"class":"ct-6b7a71"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-efa454"},"children":[{"type":"text","value":"request_uri"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-18900e"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"443 ssl http2;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"[::]:443 ssl http2;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" ssl_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"/etc/letsencrypt/live/yourhost.com/fullchain.pem; "}]},{"type":"element","tag":"span","props":{"class":"ct-828f3e"},"children":[{"type":"text","value":"# managed by Certbot"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" ssl_certificate_key "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"/etc/letsencrypt/live/yourhost.com/privkey.pem; "}]},{"type":"element","tag":"span","props":{"class":"ct-828f3e"},"children":[{"type":"text","value":"# managed by Certbot"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" ssl_trusted_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"/etc/letsencrypt/live/yourhost.com/chain.pem;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"couchdb.yourhost.com;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" client_max_body_size "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"200M;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bda083"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-955371"},"children":[{"type":"text","value":"location"}]},{"type":"element","tag":"span","props":{"class":"ct-bda083"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-15522e"},"children":[{"type":"text","value":"/ "}]},{"type":"element","tag":"span","props":{"class":"ct-bda083"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" proxy_redirect "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"off;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"Host "}]},{"type":"element","tag":"span","props":{"class":"ct-6b7a71"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-efa454"},"children":[{"type":"text","value":"host"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"X-Real-IP "}]},{"type":"element","tag":"span","props":{"class":"ct-6b7a71"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-efa454"},"children":[{"type":"text","value":"remote_addr"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"X-Forwarded-For "}]},{"type":"element","tag":"span","props":{"class":"ct-6b7a71"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-efa454"},"children":[{"type":"text","value":"proxy_add_x_forwarded_for"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" proxy_pass "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"http://127.0.0.1:5984;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"setting-up-obsidian"},"children":[{"type":"text","value":"Setting up Obsidian"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Install "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Self-hosted LiveSync"}]},{"type":"text","value":" plugin"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Change host to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https://yourhost.com"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Specify username and password"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Press "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"test"}]},{"type":"text","value":", then "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fetch database"}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-15522e{color:#FFA657}.ct-955371{color:#FF7B72}.ct-bda083{color:#C9D1D9}.ct-828f3e{color:#8B949E}.ct-efa454{color:#C9D1D9}.ct-6b7a71{color:#C9D1D9}.ct-fd005d{color:#79C0FF}.ct-0d7550{color:#FF7B72}.ct-18900e{color:#FF7B72}.ct-53f02b{color:#A5D6FF}.ct-27e645{color:#C9D1D9}.ct-d64517{color:#7EE787}.light .ct-d64517{color:#268BD2}.light .ct-27e645{color:#657B83}.light .ct-53f02b{color:#2AA198}.light .ct-18900e{color:#073642}.light .ct-0d7550{color:#859900}.light .ct-fd005d{color:#D33682}.light .ct-6b7a71{color:#859900}.light .ct-efa454{color:#268BD2}.light .ct-828f3e{color:#93A1A1}.light .ct-bda083{color:#657B83}.light .ct-955371{color:#073642}.light .ct-15522e{color:#657B83}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"setting-up-environment","depth":2,"text":"Setting up environment"},{"id":"setting-up-obsidian","depth":2,"text":"Setting up Obsidian"}]}},"_type":"markdown","_id":"content:Obsidian:Self-hosted Obsidian sync with CouchDB.md","_source":"content","_file":"Obsidian/Self-hosted Obsidian sync with CouchDB.md","_extension":"md"},{"_path":"/sql/mysql-and-mariadb-setup","_dir":"sql","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"MySQL And MariaDB Setup","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"install-mariadb-on-ubuntu-2004-lts"},"children":[{"type":"text","value":"Install MariaDB on Ubuntu 20.04 LTS"}]},{"type":"element","tag":"code","props":{"code":"sudo apt update\nsudo apt install mariadb-server\nsudo mysql_secure_installation\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"sudo apt update\nsudo apt install mariadb-server\nsudo mysql_secure_installation\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"access-database-from-outside"},"children":[{"type":"text","value":"Access Database from outside"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Open "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/mysql/mariadb.conf.d/50-server.cnf"}]},{"type":"text","value":" and change the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"bind-address"}]},{"type":"text","value":" to:"}]},{"type":"element","tag":"code","props":{"code":"...\nbind-address = 0.0.0.0\n...\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"...\nbind-address = 0.0.0.0\n...\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"create-administrative-user"},"children":[{"type":"text","value":"Create Administrative User"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Create a new user "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"newuser"}]},{"type":"text","value":" for the host "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"localhost"}]},{"type":"text","value":" with a new "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"password"}]},{"type":"text","value":":"}]}]},{"type":"element","tag":"code","props":{"code":"CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password';\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password';\n"}]}]}]},{"type":"element","tag":"ol","props":{"start":2},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Grant all permissions to the new user"}]}]},{"type":"element","tag":"code","props":{"code":"GRANT ALL PRIVILEGES ON * . * TO 'newuser'@'localhost';\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"GRANT ALL PRIVILEGES ON * . * TO 'newuser'@'localhost';\n"}]}]}]},{"type":"element","tag":"ol","props":{"start":3},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Update permissions"}]}]},{"type":"element","tag":"code","props":{"code":"FLUSH PRIVILEGES;\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"FLUSH PRIVILEGES;\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"install-mariadb-on-ubuntu-2004-lts"},"children":[{"type":"text","value":"Install MariaDB on Ubuntu 20.04 LTS"}]},{"type":"element","tag":"code","props":{"code":"sudo apt update\nsudo apt install mariadb-server\nsudo mysql_secure_installation\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-775f4b"},"children":[{"type":"text","value":"sudo apt update"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-775f4b"},"children":[{"type":"text","value":"sudo apt install mariadb-server"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-775f4b"},"children":[{"type":"text","value":"sudo mysql_secure_installation"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"access-database-from-outside"},"children":[{"type":"text","value":"Access Database from outside"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Open "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/mysql/mariadb.conf.d/50-server.cnf"}]},{"type":"text","value":" and change the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"bind-address"}]},{"type":"text","value":" to:"}]},{"type":"element","tag":"code","props":{"code":"...\nbind-address = 0.0.0.0\n...\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-775f4b"},"children":[{"type":"text","value":"..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-775f4b"},"children":[{"type":"text","value":"bind-"}]},{"type":"element","tag":"span","props":{"class":"ct-409982"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-775f4b"},"children":[{"type":"text","value":" = 0.0.0.0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-775f4b"},"children":[{"type":"text","value":"..."}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"create-administrative-user"},"children":[{"type":"text","value":"Create Administrative User"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Create a new user "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"newuser"}]},{"type":"text","value":" for the host "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"localhost"}]},{"type":"text","value":" with a new "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"password"}]},{"type":"text","value":":"}]}]},{"type":"element","tag":"code","props":{"code":"CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password';\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password';"}]}]}]}]}]},{"type":"element","tag":"ol","props":{"start":2},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Grant all permissions to the new user"}]}]},{"type":"element","tag":"code","props":{"code":"GRANT ALL PRIVILEGES ON * . * TO 'newuser'@'localhost';\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"GRANT ALL PRIVILEGES ON * . * TO 'newuser'@'localhost';"}]}]}]}]}]},{"type":"element","tag":"ol","props":{"start":3},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Update permissions"}]}]},{"type":"element","tag":"code","props":{"code":"FLUSH PRIVILEGES;\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"FLUSH PRIVILEGES;"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-409982{color:#FF7B72}.ct-775f4b{color:#C9D1D9}.light .ct-775f4b{color:#657B83}.light .ct-409982{color:#859900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"install-mariadb-on-ubuntu-2004-lts","depth":2,"text":"Install MariaDB on Ubuntu 20.04 LTS"},{"id":"access-database-from-outside","depth":2,"text":"Access Database from outside"},{"id":"create-administrative-user","depth":2,"text":"Create Administrative User"}]}},"_type":"markdown","_id":"content:SQL:MySQL and MariaDB setup.md","_source":"content","_file":"SQL/MySQL and MariaDB setup.md","_extension":"md"},{"_path":"/sql/postgress-setup","_dir":"sql","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Postgress Setup","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"install-postgresql-12-on-ubuntu-2004-lts"},"children":[{"type":"text","value":"Install PostgreSQL 12 on Ubuntu 20.04 LTS"}]},{"type":"element","tag":"code","props":{"code":"sudo apt update\nsudo apt install -y postgresql postgresql-contrib postgresql-client\nsudo systemctl status postgresql.service\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"sudo apt update\nsudo apt install -y postgresql postgresql-contrib postgresql-client\nsudo systemctl status postgresql.service\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"initial-database-connection"},"children":[{"type":"text","value":"Initial database connection"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A local connection (from the database server) can be done by the following command:"}]},{"type":"element","tag":"code","props":{"code":"sudo -u postgres psql\n\npsql (12.12 (Ubuntu 12.12-0ubuntu0.20.04.1))\nType \"help\" for help.\n\npostgres=#\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"sudo -u postgres psql\n\npsql (12.12 (Ubuntu 12.12-0ubuntu0.20.04.1))\nType \"help\" for help.\n\npostgres=#\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"set-password-for-postgres-database-user"},"children":[{"type":"text","value":"Set password for postgres database user"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The password for the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" database user can be set the the quick command "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"\\password"}]},{"type":"text","value":"\nor by "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"alter user postgres password 'Supersecret'"}]},{"type":"text","value":". A connection using the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" user\nis still not possible from the \"outside\" hence to the default settings in the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"pg_hba.conf"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h3","props":{"id":"update-pg_hbaconf-to-allow-postgres-user-connections-with-password"},"children":[{"type":"text","value":"Update pg_hba.conf to allow postgres user connections with password"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"In order to allow connections of the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" database user not using OS user\nauthentication, you have to update the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"pg_hba.conf"}]},{"type":"text","value":" which can be found under\n"},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/postgresql/12/main/pg_hba.conf"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"sudo vi /etc/postgresql/12/main/pg_hba.conf\n\n...\nlocal all postgres peer\n...\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"sudo vi /etc/postgresql/12/main/pg_hba.conf\n\n...\nlocal all postgres peer\n...\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change the last section of the above line to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"md5"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"local all postgres md5\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"local all postgres md5\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A restart is required in order to apply the new configuration:"}]},{"type":"element","tag":"code","props":{"code":"sudo systemctl restart postgresql\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"sudo systemctl restart postgresql\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Now a connection from outside the database host is possible e.g."}]},{"type":"element","tag":"code","props":{"code":"psql -U postgres -d postgres -h databasehostname\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"psql -U postgres -d postgres -h databasehostname\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"creation-of-additional-database-users"},"children":[{"type":"text","value":"Creation of additional database users"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A database user can be created by the following command:"}]},{"type":"element","tag":"code","props":{"code":"create user myuser with encrypted password 'Supersecret';\nCREATE ROLE\n\npostgres=# \\du\n List of roles\n Role name | Attributes | Member of\n-----------+------------------------------------------------------------+-----------\n myuser | | {}\n postgres | Superuser, Create role, Create DB, Replication, Bypass RLS | {}\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"create user myuser with encrypted password 'Supersecret';\nCREATE ROLE\n\npostgres=# \\du\n List of roles\n Role name | Attributes | Member of\n-----------+------------------------------------------------------------+-----------\n myuser | | {}\n postgres | Superuser, Create role, Create DB, Replication, Bypass RLS | {}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"creation-of-additional-databases"},"children":[{"type":"text","value":"Creation of additional databases"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"One can create new Postgres databases within an instance. Therefore you can use the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"psql"}]},{"type":"text","value":"\ncommand to login (see above)."}]},{"type":"element","tag":"code","props":{"code":"CREATE DATABASE dbname OWNER myuser;\nCREATE DATABASE\n\npostgres=# \\l\n List of databases\n Name | Owner | Encoding | Collate | Ctype | Access privileges\n-----------+----------+----------+-------------+-------------+-----------------------\n dbname | myuser | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n postgres | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n template0 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n template1 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"CREATE DATABASE dbname OWNER myuser;\nCREATE DATABASE\n\npostgres=# \\l\n List of databases\n Name | Owner | Encoding | Collate | Ctype | Access privileges\n-----------+----------+----------+-------------+-------------+-----------------------\n dbname | myuser | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n postgres | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n template0 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n template1 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You can leave the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"OWNER"}]},{"type":"text","value":" section of the command, when doing so, the current user will become\nowner of the newly created database."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To change the owner of an existing database later, you can use the following command:"}]},{"type":"element","tag":"code","props":{"code":"postgres=# alter database dbname owner to myuser;\nALTER DATABASE\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"postgres=# alter database dbname owner to myuser;\nALTER DATABASE\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"install-postgresql-12-on-ubuntu-2004-lts"},"children":[{"type":"text","value":"Install PostgreSQL 12 on Ubuntu 20.04 LTS"}]},{"type":"element","tag":"code","props":{"code":"sudo apt update\nsudo apt install -y postgresql postgresql-contrib postgresql-client\nsudo systemctl status postgresql.service\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"sudo apt update"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"sudo apt install -y postgresql postgresql-contrib postgresql-client"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"sudo systemctl status postgresql.service"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"initial-database-connection"},"children":[{"type":"text","value":"Initial database connection"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A local connection (from the database server) can be done by the following command:"}]},{"type":"element","tag":"code","props":{"code":"sudo -u postgres psql\n\npsql (12.12 (Ubuntu 12.12-0ubuntu0.20.04.1))\nType \"help\" for help.\n\npostgres=#\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"sudo -u postgres psql"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"psql (12.12 (Ubuntu 12.12-0ubuntu0.20.04.1))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"Type "}]},{"type":"element","tag":"span","props":{"class":"ct-2ca8ba"},"children":[{"type":"text","value":"\"help\""}]},{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-11c2dc"},"children":[{"type":"text","value":"for"}]},{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":" help."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"postgres="}]},{"type":"element","tag":"span","props":{"class":"ct-b954cf"},"children":[{"type":"text","value":"#"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"set-password-for-postgres-database-user"},"children":[{"type":"text","value":"Set password for postgres database user"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The password for the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" database user can be set the the quick command "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"\\password"}]},{"type":"text","value":"\nor by "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"alter user postgres password 'Supersecret'"}]},{"type":"text","value":". A connection using the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" user\nis still not possible from the \"outside\" hence to the default settings in the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"pg_hba.conf"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h3","props":{"id":"update-pg_hbaconf-to-allow-postgres-user-connections-with-password"},"children":[{"type":"text","value":"Update pg_hba.conf to allow postgres user connections with password"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"In order to allow connections of the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" database user not using OS user\nauthentication, you have to update the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"pg_hba.conf"}]},{"type":"text","value":" which can be found under\n"},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/postgresql/12/main/pg_hba.conf"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"sudo vi /etc/postgresql/12/main/pg_hba.conf\n\n...\nlocal all postgres peer\n...\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"sudo vi /etc/postgresql/12/main/pg_hba.conf"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ecfcaa"},"children":[{"type":"text","value":"local"}]},{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":" all postgres peer"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"..."}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change the last section of the above line to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"md5"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"local all postgres md5\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"local all postgres md5"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A restart is required in order to apply the new configuration:"}]},{"type":"element","tag":"code","props":{"code":"sudo systemctl restart postgresql\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"sudo systemctl restart postgresql"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Now a connection from outside the database host is possible e.g."}]},{"type":"element","tag":"code","props":{"code":"psql -U postgres -d postgres -h databasehostname\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"psql -U postgres -d postgres -h databasehostname"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"creation-of-additional-database-users"},"children":[{"type":"text","value":"Creation of additional database users"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A database user can be created by the following command:"}]},{"type":"element","tag":"code","props":{"code":"create user myuser with encrypted password 'Supersecret';\nCREATE ROLE\n\npostgres=# \\du\n List of roles\n Role name | Attributes | Member of\n-----------+------------------------------------------------------------+-----------\n myuser | | {}\n postgres | Superuser, Create role, Create DB, Replication, Bypass RLS | {}\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"create user myuser with encrypted password 'Supersecret';\nCREATE ROLE\n\npostgres=# \\du\n List of roles\n Role name | Attributes | Member of\n-----------+------------------------------------------------------------+-----------\n myuser | | {}\n postgres | Superuser, Create role, Create DB, Replication, Bypass RLS | {}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"creation-of-additional-databases"},"children":[{"type":"text","value":"Creation of additional databases"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"One can create new Postgres databases within an instance. Therefore you can use the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"psql"}]},{"type":"text","value":"\ncommand to login (see above)."}]},{"type":"element","tag":"code","props":{"code":"CREATE DATABASE dbname OWNER myuser;\nCREATE DATABASE\n\npostgres=# \\l\n List of databases\n Name | Owner | Encoding | Collate | Ctype | Access privileges\n-----------+----------+----------+-------------+-------------+-----------------------\n dbname | myuser | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n postgres | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n template0 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n template1 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"CREATE DATABASE dbname OWNER myuser;\nCREATE DATABASE\n\npostgres=# \\l\n List of databases\n Name | Owner | Encoding | Collate | Ctype | Access privileges\n-----------+----------+----------+-------------+-------------+-----------------------\n dbname | myuser | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n postgres | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n template0 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n template1 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You can leave the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"OWNER"}]},{"type":"text","value":" section of the command, when doing so, the current user will become\nowner of the newly created database."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To change the owner of an existing database later, you can use the following command:"}]},{"type":"element","tag":"code","props":{"code":"postgres=# alter database dbname owner to myuser;\nALTER DATABASE\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"postgres=# alter database dbname owner to myuser;\nALTER DATABASE"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-ecfcaa{color:#FF7B72}.ct-b954cf{color:#8B949E}.ct-11c2dc{color:#FF7B72}.ct-2ca8ba{color:#A5D6FF}.ct-230b36{color:#C9D1D9}.light .ct-230b36{color:#657B83}.light .ct-2ca8ba{color:#2AA198}.light .ct-11c2dc{color:#859900}.light .ct-b954cf{color:#93A1A1}.light .ct-ecfcaa{color:#073642}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"install-postgresql-12-on-ubuntu-2004-lts","depth":2,"text":"Install PostgreSQL 12 on Ubuntu 20.04 LTS"},{"id":"initial-database-connection","depth":2,"text":"Initial database connection"},{"id":"set-password-for-postgres-database-user","depth":2,"text":"Set password for postgres database user","children":[{"id":"update-pg_hbaconf-to-allow-postgres-user-connections-with-password","depth":3,"text":"Update pg_hba.conf to allow postgres user connections with password"}]},{"id":"creation-of-additional-database-users","depth":2,"text":"Creation of additional database users"},{"id":"creation-of-additional-databases","depth":2,"text":"Creation of additional databases"}]}},"_type":"markdown","_id":"content:SQL:Postgress setup.md","_source":"content","_file":"SQL/Postgress setup.md","_extension":"md"},{"_path":"/typescript/add-global-variable-to-window","_dir":"typescript","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Add Global Variable To Window","description":"Sometimes you want to add global variable to your window. That thing's called global module augmentation.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you want to add global variable to your "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window"}]},{"type":"text","value":". That thing's called "},{"type":"element","tag":"a","props":{"href":"https://www.typescriptlang.org/docs/handbook/declaration-merging.html#global-augmentation","rel":["nofollow"]},"children":[{"type":"text","value":"global module augmentation"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say you need to call "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.doFancyThings()"}]},{"type":"text","value":". For that you should augment global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window"}]},{"type":"text","value":" interface in "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"*.d.ts"}]},{"type":"text","value":" file:"}]},{"type":"element","tag":"code","props":{"code":"declare global {\n interface Window {\n doFancyThings: () => void;\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"declare global {\n interface Window {\n doFancyThings: () => void;\n }\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is useful for declaring global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.ethereum"}]},{"type":"text","value":" (or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.web3"}]},{"type":"text","value":") in "},{"type":"element","tag":"a","props":{"href":"/blockchain/Common%20typescript%20examples"},"children":[{"type":"text","value":"blockchain"}]},{"type":"text","value":" projects with typescript, which use wallet browser extensions."}]},{"type":"element","tag":"h2","props":{"id":"augmenting-existing-interface"},"children":[{"type":"text","value":"Augmenting existing interface"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For example, you have class "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Sample"}]},{"type":"text","value":" without any functionality:"}]},{"type":"element","tag":"code","props":{"code":"// Sample.ts\n\nexport class Sample {\n // nothing :-)\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// Sample.ts\n\nexport class Sample {\n // nothing :-)\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then you want extend it with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"doFancyThings()"}]},{"type":"text","value":" method. That can be achieved with said "},{"type":"element","tag":"a","props":{"href":"https://www.typescriptlang.org/docs/handbook/declaration-merging.html#module-augmentation","rel":["nofollow"]},"children":[{"type":"text","value":"module augmentation"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"// fancyThings.ts\nimport { Sample } from \"./Sample\";\n\ndeclare module \"./Sample\" {\n interface Sample {\n doFancyThings: () => void;\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// fancyThings.ts\nimport { Sample } from \"./Sample\";\n\ndeclare module \"./Sample\" {\n interface Sample {\n doFancyThings: () => void;\n }\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Now you can call "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"sample.doFancyThings()"}]},{"type":"text","value":" by importing both "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".ts"}]},{"type":"text","value":" files:"}]},{"type":"element","tag":"code","props":{"code":"import { Sample } from \"./sample\";\nimport \"./fancyThings\";\n\nconst sample = new Sample();\nsample.doFancyThings(); // ok\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { Sample } from \"./sample\";\nimport \"./fancyThings\";\n\nconst sample = new Sample();\nsample.doFancyThings(); // ok\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This example is useful for "},{"type":"element","tag":"a","props":{"href":"./Frontend/Vue/Adding%20global%20properties%20to%20component"},"children":[{"type":"text","value":"adding global properties to component"}]},{"type":"text","value":" in vue.js."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you want to add global variable to your "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window"}]},{"type":"text","value":". That thing's called "},{"type":"element","tag":"a","props":{"href":"https://www.typescriptlang.org/docs/handbook/declaration-merging.html#global-augmentation","rel":["nofollow"]},"children":[{"type":"text","value":"global module augmentation"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say you need to call "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.doFancyThings()"}]},{"type":"text","value":". For that you should augment global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window"}]},{"type":"text","value":" interface in "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"*.d.ts"}]},{"type":"text","value":" file:"}]},{"type":"element","tag":"code","props":{"code":"declare global {\n interface Window {\n doFancyThings: () => void;\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ddb5db"},"children":[{"type":"text","value":"declare"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-967933"},"children":[{"type":"text","value":"global"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ddb5db"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-480aec"},"children":[{"type":"text","value":"Window"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1694ff"},"children":[{"type":"text","value":"doFancyThings"}]},{"type":"element","tag":"span","props":{"class":"ct-06c8c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-ddb5db"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56b99e"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is useful for declaring global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.ethereum"}]},{"type":"text","value":" (or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.web3"}]},{"type":"text","value":") in "},{"type":"element","tag":"a","props":{"href":"/blockchain/Common%20typescript%20examples"},"children":[{"type":"text","value":"blockchain"}]},{"type":"text","value":" projects with typescript, which use wallet browser extensions."}]},{"type":"element","tag":"h2","props":{"id":"augmenting-existing-interface"},"children":[{"type":"text","value":"Augmenting existing interface"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For example, you have class "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Sample"}]},{"type":"text","value":" without any functionality:"}]},{"type":"element","tag":"code","props":{"code":"// Sample.ts\n\nexport class Sample {\n // nothing :-)\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-24091c"},"children":[{"type":"text","value":"// Sample.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-06c8c8"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ddb5db"},"children":[{"type":"text","value":"class"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-480aec"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24091c"},"children":[{"type":"text","value":"// nothing :-)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then you want extend it with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"doFancyThings()"}]},{"type":"text","value":" method. That can be achieved with said "},{"type":"element","tag":"a","props":{"href":"https://www.typescriptlang.org/docs/handbook/declaration-merging.html#module-augmentation","rel":["nofollow"]},"children":[{"type":"text","value":"module augmentation"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"// fancyThings.ts\nimport { Sample } from \"./Sample\";\n\ndeclare module \"./Sample\" {\n interface Sample {\n doFancyThings: () => void;\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-24091c"},"children":[{"type":"text","value":"// fancyThings.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-06c8c8"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-967933"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-06c8c8"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-174796"},"children":[{"type":"text","value":"\"./Sample\""}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ddb5db"},"children":[{"type":"text","value":"declare"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ddb5db"},"children":[{"type":"text","value":"module"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-174796"},"children":[{"type":"text","value":"\"./Sample\""}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ddb5db"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-480aec"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1694ff"},"children":[{"type":"text","value":"doFancyThings"}]},{"type":"element","tag":"span","props":{"class":"ct-06c8c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-ddb5db"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56b99e"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Now you can call "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"sample.doFancyThings()"}]},{"type":"text","value":" by importing both "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".ts"}]},{"type":"text","value":" files:"}]},{"type":"element","tag":"code","props":{"code":"import { Sample } from \"./sample\";\nimport \"./fancyThings\";\n\nconst sample = new Sample();\nsample.doFancyThings(); // ok\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-06c8c8"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-967933"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-06c8c8"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-174796"},"children":[{"type":"text","value":"\"./sample\""}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-06c8c8"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-174796"},"children":[{"type":"text","value":"\"./fancyThings\""}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ddb5db"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2c62ce"},"children":[{"type":"text","value":"sample"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06c8c8"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06c8c8"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1694ff"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-967933"},"children":[{"type":"text","value":"sample"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-1694ff"},"children":[{"type":"text","value":"doFancyThings"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":"(); "}]},{"type":"element","tag":"span","props":{"class":"ct-24091c"},"children":[{"type":"text","value":"// ok"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This example is useful for "},{"type":"element","tag":"a","props":{"href":"./Frontend/Vue/Adding%20global%20properties%20to%20component"},"children":[{"type":"text","value":"adding global properties to component"}]},{"type":"text","value":" in vue.js."}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-2c62ce{color:#79C0FF}.ct-174796{color:#A5D6FF}.ct-24091c{color:#8B949E}.ct-56b99e{color:#79C0FF}.ct-06c8c8{color:#FF7B72}.ct-1694ff{color:#D2A8FF}.ct-480aec{color:#FFA657}.ct-967933{color:#C9D1D9}.ct-b07aa9{color:#C9D1D9}.ct-ddb5db{color:#FF7B72}.light .ct-ddb5db{color:#073642}.light .ct-b07aa9{color:#657B83}.light .ct-967933{color:#268BD2}.light .ct-480aec{color:#268BD2}.light .ct-1694ff{color:#268BD2}.light .ct-06c8c8{color:#859900}.light .ct-56b99e{color:#859900}.light .ct-24091c{color:#93A1A1}.light .ct-174796{color:#2AA198}.light .ct-2c62ce{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"augmenting-existing-interface","depth":2,"text":"Augmenting existing interface"}]}},"_type":"markdown","_id":"content:Typescript:Add global variable to window.md","_source":"content","_file":"Typescript/Add global variable to window.md","_extension":"md"},{"_path":"/typescript/flatten-object-with-periods","_dir":"typescript","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Flatten Object With Periods","description":"This helper generates Typescript types for i18n dictionary json\nfiles by flattening it with period delimiter. Supports plural forms.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This helper generates Typescript types for i18n dictionary json\nfiles by flattening it with period delimiter. Supports plural forms."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Used for typing "},{"type":"element","tag":"a","props":{"href":"https://www.npmjs.com/package/i18n-js","rel":["nofollow"]},"children":[{"type":"text","value":"i18n.js"}]},{"type":"text","value":" dictionaries;"}]},{"type":"element","tag":"code","props":{"code":"import en from './en.json';\ntype TranslationPath = Flatten;\n\nconst t = (key: TranslationPath, options?: TranslateOptions) =>\n I18nLib.t(key, options);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import en from './en.json';\ntype TranslationPath = Flatten;\n\nconst t = (key: TranslationPath, options?: TranslateOptions) =>\n I18nLib.t(key, options);\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Flatten type defined here:"}]},{"type":"element","tag":"code","props":{"code":"// This one based on answer from StackOverflow:\n// https://stackoverflow.com/questions/58434389/typescript-deep-keyof-of-a-nested-object\n\nexport type Flatten = [D] extends [never]\n ? never\n : T extends PluralForm // plural object\n ? ''\n : T extends object\n ? { [K in keyof T]-?: Join> }[keyof T]\n : '';\n\n// Fix it for you plural form\ntype PluralForm = Record<'one' | 'few' | 'many', string>;\n\ntype Join = K extends string | number\n ? P extends string | number\n ? `${K}${'' extends P ? '' : '.'}${P}`\n : never\n : never;\n\ntype Prev = [never, 0, 1, 2, 3, 4, 5, ...Array<0>];\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// This one based on answer from StackOverflow:\n// https://stackoverflow.com/questions/58434389/typescript-deep-keyof-of-a-nested-object\n\nexport type Flatten = [D] extends [never]\n ? never\n : T extends PluralForm // plural object\n ? ''\n : T extends object\n ? { [K in keyof T]-?: Join> }[keyof T]\n : '';\n\n// Fix it for you plural form\ntype PluralForm = Record<'one' | 'few' | 'many', string>;\n\ntype Join = K extends string | number\n ? P extends string | number\n ? `${K}${'' extends P ? '' : '.'}${P}`\n : never\n : never;\n\ntype Prev = [never, 0, 1, 2, 3, 4, 5, ...Array<0>];\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This helper generates Typescript types for i18n dictionary json\nfiles by flattening it with period delimiter. Supports plural forms."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Used for typing "},{"type":"element","tag":"a","props":{"href":"https://www.npmjs.com/package/i18n-js","rel":["nofollow"]},"children":[{"type":"text","value":"i18n.js"}]},{"type":"text","value":" dictionaries;"}]},{"type":"element","tag":"code","props":{"code":"import en from './en.json';\ntype TranslationPath = Flatten;\n\nconst t = (key: TranslationPath, options?: TranslateOptions) =>\n I18nLib.t(key, options);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-441a98"},"children":[{"type":"text","value":"en"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d390b"},"children":[{"type":"text","value":"'./en.json'"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"TranslationPath"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"Flatten"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"typeof"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-441a98"},"children":[{"type":"text","value":"en"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":">;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e2c7eb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-36fa95"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-30dc91"},"children":[{"type":"text","value":"t"}]},{"type":"element","tag":"span","props":{"class":"ct-36fa95"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4540c4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-36fa95"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-ca3455"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-4540c4"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-36fa95"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4d74f9"},"children":[{"type":"text","value":"TranslationPath"}]},{"type":"element","tag":"span","props":{"class":"ct-36fa95"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-ca3455"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-4540c4"},"children":[{"type":"text","value":"?:"}]},{"type":"element","tag":"span","props":{"class":"ct-36fa95"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4d74f9"},"children":[{"type":"text","value":"TranslateOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-36fa95"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-e2c7eb"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-441a98"},"children":[{"type":"text","value":"I18nLib"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-394af7"},"children":[{"type":"text","value":"t"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-441a98"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-441a98"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Flatten type defined here:"}]},{"type":"element","tag":"code","props":{"code":"// This one based on answer from StackOverflow:\n// https://stackoverflow.com/questions/58434389/typescript-deep-keyof-of-a-nested-object\n\nexport type Flatten = [D] extends [never]\n ? never\n : T extends PluralForm // plural object\n ? ''\n : T extends object\n ? { [K in keyof T]-?: Join> }[keyof T]\n : '';\n\n// Fix it for you plural form\ntype PluralForm = Record<'one' | 'few' | 'many', string>;\n\ntype Join = K extends string | number\n ? P extends string | number\n ? `${K}${'' extends P ? '' : '.'}${P}`\n : never\n : never;\n\ntype Prev = [never, 0, 1, 2, 3, 4, 5, ...Array<0>];\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bc4f67"},"children":[{"type":"text","value":"// This one based on answer from StackOverflow:"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bc4f67"},"children":[{"type":"text","value":"// https://stackoverflow.com/questions/58434389/typescript-deep-keyof-of-a-nested-object"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"Flatten"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"D"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-059763"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"D"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"] "}]},{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"never"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"never"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"PluralForm"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc4f67"},"children":[{"type":"text","value":"// plural object"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d390b"},"children":[{"type":"text","value":"''"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"object"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" { ["}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"in"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"keyof"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"]"}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"-?:"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"Join"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"Flatten"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"], "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"Prev"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"D"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"]>> }["}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"keyof"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d390b"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bc4f67"},"children":[{"type":"text","value":"// Fix it for you plural form"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"PluralForm"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"Record"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-6d390b"},"children":[{"type":"text","value":"'one'"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d390b"},"children":[{"type":"text","value":"'few'"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d390b"},"children":[{"type":"text","value":"'many'"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":">;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"Join"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"number"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"number"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d390b"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-6d390b"},"children":[{"type":"text","value":"}${''"}]},{"type":"element","tag":"span","props":{"class":"ct-c0bc31"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-c0bc31"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-c0bc31"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-c0bc31"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d390b"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-c0bc31"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-c0bc31"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d390b"},"children":[{"type":"text","value":"'.'}${"}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-6d390b"},"children":[{"type":"text","value":"}`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"never"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"never"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"Prev"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"never"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-059763"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-059763"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-059763"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-059763"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-059763"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-059763"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"Array"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-059763"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":">];"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-c0bc31{color:#A5D6FF}.ct-059763{color:#79C0FF}.ct-5be865{color:#79C0FF}.ct-bc4f67{color:#8B949E}.ct-394af7{color:#D2A8FF}.ct-4d74f9{color:#FFA657}.ct-ca3455{color:#FFA657}.ct-4540c4{color:#FF7B72}.ct-30dc91{color:#D2A8FF}.ct-36fa95{color:#C9D1D9}.ct-e2c7eb{color:#FF7B72}.ct-098f84{color:#FFA657}.ct-1cf06c{color:#FF7B72}.ct-6d390b{color:#A5D6FF}.ct-441a98{color:#C9D1D9}.ct-bb5dba{color:#C9D1D9}.ct-cf7037{color:#FF7B72}.light .ct-cf7037{color:#859900}.light .ct-bb5dba{color:#657B83}.light .ct-441a98{color:#268BD2}.light .ct-6d390b{color:#2AA198}.light .ct-1cf06c{color:#073642}.light .ct-098f84{color:#268BD2}.light .ct-e2c7eb{color:#073642}.light .ct-36fa95{color:#657B83}.light .ct-30dc91{color:#268BD2}.light .ct-4540c4{color:#859900}.light .ct-ca3455{color:#657B83}.light .ct-4d74f9{color:#268BD2}.light .ct-394af7{color:#268BD2}.light .ct-bc4f67{color:#93A1A1}.light .ct-5be865{color:#859900}.light .ct-059763{color:#D33682}.light .ct-c0bc31{color:#657B83}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Typescript:Flatten object with periods.md","_source":"content","_file":"Typescript/Flatten object with periods.md","_extension":"md"},{"_path":"/typescript/type-guards","_dir":"typescript","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Type Guards","description":"Useful for type checking at compile and run time:","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful for type checking at compile and run time:"}]},{"type":"element","tag":"code","props":{"code":"function isFish(pet: Fish | Bird): pet is Fish {\n return (pet as Fish).swim !== undefined;\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"function isFish(pet: Fish | Bird): pet is Fish {\n return (pet as Fish).swim !== undefined;\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Usage:"}]},{"type":"element","tag":"code","props":{"code":"const pet = getSmallPet();\n \nif (isFish(pet)) {\n pet.swim();\n} else {\n pet.fly();\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const pet = getSmallPet();\n \nif (isFish(pet)) {\n pet.swim();\n} else {\n pet.fly();\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful for type checking at compile and run time:"}]},{"type":"element","tag":"code","props":{"code":"function isFish(pet: Fish | Bird): pet is Fish {\n return (pet as Fish).swim !== undefined;\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5996ab"},"children":[{"type":"text","value":"function"}]},{"type":"element","tag":"span","props":{"class":"ct-18ca61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-85d161"},"children":[{"type":"text","value":"isFish"}]},{"type":"element","tag":"span","props":{"class":"ct-18ca61"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-373e6c"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-1b2855"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-18ca61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90ecad"},"children":[{"type":"text","value":"Fish"}]},{"type":"element","tag":"span","props":{"class":"ct-18ca61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1b2855"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-18ca61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90ecad"},"children":[{"type":"text","value":"Bird"}]},{"type":"element","tag":"span","props":{"class":"ct-18ca61"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-1b2855"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-18ca61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-373e6c"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-18ca61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1b2855"},"children":[{"type":"text","value":"is"}]},{"type":"element","tag":"span","props":{"class":"ct-18ca61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90ecad"},"children":[{"type":"text","value":"Fish"}]},{"type":"element","tag":"span","props":{"class":"ct-18ca61"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5abcba"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-e53464"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5abcba"},"children":[{"type":"text","value":"as"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a9a5e4"},"children":[{"type":"text","value":"Fish"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-e53464"},"children":[{"type":"text","value":"swim"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5abcba"},"children":[{"type":"text","value":"!=="}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f9810"},"children":[{"type":"text","value":"undefined"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Usage:"}]},{"type":"element","tag":"code","props":{"code":"const pet = getSmallPet();\n \nif (isFish(pet)) {\n pet.swim();\n} else {\n pet.fly();\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3ecc1d"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-38cc9e"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5abcba"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6baa9"},"children":[{"type":"text","value":"getSmallPet"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5abcba"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-c6baa9"},"children":[{"type":"text","value":"isFish"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e53464"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e53464"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c6baa9"},"children":[{"type":"text","value":"swim"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":"} "}]},{"type":"element","tag":"span","props":{"class":"ct-5abcba"},"children":[{"type":"text","value":"else"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e53464"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c6baa9"},"children":[{"type":"text","value":"fly"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-c6baa9{color:#D2A8FF}.ct-38cc9e{color:#79C0FF}.ct-3ecc1d{color:#FF7B72}.ct-6f9810{color:#79C0FF}.ct-a9a5e4{color:#FFA657}.ct-e53464{color:#C9D1D9}.ct-5abcba{color:#FF7B72}.ct-812250{color:#C9D1D9}.ct-90ecad{color:#FFA657}.ct-1b2855{color:#FF7B72}.ct-373e6c{color:#FFA657}.ct-85d161{color:#D2A8FF}.ct-18ca61{color:#C9D1D9}.ct-5996ab{color:#FF7B72}.light .ct-5996ab{color:#073642}.light .ct-18ca61{color:#657B83}.light .ct-85d161{color:#268BD2}.light .ct-373e6c{color:#657B83}.light .ct-1b2855{color:#859900}.light .ct-90ecad{color:#268BD2}.light .ct-812250{color:#657B83}.light .ct-5abcba{color:#859900}.light .ct-e53464{color:#268BD2}.light .ct-a9a5e4{color:#268BD2}.light .ct-6f9810{color:#B58900}.light .ct-3ecc1d{color:#073642}.light .ct-38cc9e{color:#268BD2}.light .ct-c6baa9{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Typescript:Type guards.md","_source":"content","_file":"Typescript/Type guards.md","_extension":"md"}],"navigation":[{"title":"Blockchain","_path":"/blockchain","children":[{"title":"Common Typescript Examples","_path":"/blockchain/common-typescript-examples"},{"title":"Smart Contracts","_path":"/blockchain/smart-contracts"}]},{"title":"Css","_path":"/css","children":[{"title":"Automatic Grid Like Masonry With Pure CSS","_path":"/css/automatic-grid-like-masonry-with-pure-css"},{"title":"Sass Nth Child Iterate Mixin","_path":"/css/sass-nth-child-iterate-mixin"},{"title":"Test If Browser Supports CSS Rules","_path":"/css/test-if-browser-supports-css-rules"}]},{"title":"Docker","_path":"/docker","children":[{"title":"Building Static Pages With Docker","_path":"/docker/building-static-pages-with-docker"},{"title":"Common Things With Docker Mailserver","_path":"/docker/common-things-with-docker-mailserver"},{"title":"Drone Ci","_path":"/docker/drone-ci"},{"title":"Github Pages With Drone Ci","_path":"/docker/github-pages-with-drone-ci"},{"title":"Private Docker Registry","_path":"/docker/private-docker-registry"},{"title":"Refresh Containers On Pull","_path":"/docker/refresh-containers-on-pull"},{"title":"Seed Dump Inside Docker","_path":"/docker/seed-dump-inside-docker"},{"title":"Wait For Mysql","_path":"/docker/wait-for-mysql"},{"title":"Wait For Redis","_path":"/docker/wait-for-redis"}]},{"title":"Frontend","_path":"/frontend","children":[{"title":"React Native","_path":"/frontend/react-native","children":[{"title":"OAuth2 Login","_path":"/frontend/react-native/oauth2-login"},{"title":"Preserve FlatList Scroll Position In React Native","_path":"/frontend/react-native/preserve-flatlist-scroll-position-in-react-native"},{"title":"Useful Comands","_path":"/frontend/react-native/useful-comands"}]},{"title":"React","_path":"/frontend/react","children":[{"title":"Axios Refresh Token On React","_path":"/frontend/react/axios-refresh-token-on-react"},{"title":"Axios With AbortController","_path":"/frontend/react/axios-with-abortcontroller"},{"title":"Detect Hook Deps Changes With UseWhatsChanged","_path":"/frontend/react/detect-hook-deps-changes-with-usewhatschanged"}]},{"title":"Vue","_path":"/frontend/vue","children":[{"title":"Adding Global Properties To Component","_path":"/frontend/vue/adding-global-properties-to-component"},{"title":"Make Nuxt Handle Obsidian Highlights","_path":"/frontend/vue/make-nuxt-handle-obsidian-highlights"}]},{"title":"Webgl","_path":"/frontend/webgl","children":[{"title":"Basics Of WebGL (Drawing A Cube)","_path":"/frontend/webgl/basics-of-webgl-(drawing-a-cube)"},{"title":"Fragment Shaders","_path":"/frontend/webgl/fragment-shaders"},{"title":"Rendering Without Blocking In A Worker","_path":"/frontend/webgl/rendering-without-blocking-in-a-worker"},{"title":"Vertex Shaders","_path":"/frontend/webgl/vertex-shaders"}]}]},{"title":"Git","_path":"/git","children":[{"title":"Force Git To Use HTTPS","_path":"/git/force-git-to-use-https"},{"title":"Git Aliases And Useful Commands","_path":"/git/git-aliases-and-useful-commands"}]},{"title":"Golang","_path":"/golang","children":[{"title":"I18n In Golang","_path":"/golang/i18n-in-golang"}]},{"title":"Graphql","_path":"/graphql","children":[{"title":"Apollo Client Pagination","_path":"/graphql/apollo-client-pagination"},{"title":"Refresh Token In Apollo Client","_path":"/graphql/refresh-token-in-apollo-client"}]},{"title":"Linux","_path":"/linux","children":[{"title":"Certbot Well Known Auto Renew","_path":"/linux/certbot-well-known-auto-renew"},{"title":"Find Out Who Uses Swap","_path":"/linux/find-out-who-uses-swap"},{"title":"Fixing Lagging USB Headphones","_path":"/linux/fixing-lagging-usb-headphones"},{"title":"Gitea For Git Hosting","_path":"/linux/gitea-for-git-hosting"},{"title":"Google Photos Alternative With Photoprism","_path":"/linux/google-photos-alternative-with-photoprism"},{"title":"Linux On Asus Zenbook UM3402 YA","_path":"/linux/linux-on-asus-zenbook-um3402-ya"},{"title":"Resume Or Start Screen Session","_path":"/linux/resume-or-start-screen-session"},{"title":"Rsync File With SSH","_path":"/linux/rsync-file-with-ssh"},{"title":"Setting Up NGINX","_path":"/linux/setting-up-nginx"},{"title":"SSH","_path":"/linux/ssh"}]},{"title":"Obsidian","_path":"/obsidian","children":[{"title":"Self Hosted Obsidian Sync With CouchDB","_path":"/obsidian/self-hosted-obsidian-sync-with-couchdb"}]},{"title":"Sql","_path":"/sql","children":[{"title":"MySQL And MariaDB Setup","_path":"/sql/mysql-and-mariadb-setup"},{"title":"Postgress Setup","_path":"/sql/postgress-setup"}]},{"title":"Typescript","_path":"/typescript","children":[{"title":"Add Global Variable To Window","_path":"/typescript/add-global-variable-to-window"},{"title":"Flatten Object With Periods","_path":"/typescript/flatten-object-with-periods"},{"title":"Type Guards","_path":"/typescript/type-guards"}]}]} \ No newline at end of file diff --git a/docs/api/_content/query/068glZS8Mz.json b/docs/api/_content/query/068glZS8Mz.json index 0a3d6de..d74e83d 100644 --- a/docs/api/_content/query/068glZS8Mz.json +++ b/docs/api/_content/query/068glZS8Mz.json @@ -1 +1 @@ -{"_path":"/css/automatic-grid-like-masonry-with-pure-css","_dir":"css","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Automatic Grid Like Masonry With Pure CSS","description":"Grid, that places items by density. Pure #css solution. Can be used with items, that take different amount of rows/columns.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Grid, that places items by density. Pure #css solution. Can be used with items, that take different amount of rows/columns."}]},{"type":"element","tag":"code","props":{"code":"$cell: 250px;\n$gap: 20px;\n\n.grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax($cell, 1fr));\n grid-auto-rows: 256px;\n grid-auto-flow: row dense;\n grid-column-gap: $gap;\n grid-row-gap: $gap;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"$cell: 250px;\n$gap: 20px;\n\n.grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax($cell, 1fr));\n grid-auto-rows: 256px;\n grid-auto-flow: row dense;\n grid-column-gap: $gap;\n grid-row-gap: $gap;\n}\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"basic-elements-with-double-height-or-width"},"children":[{"type":"text","value":"Basic elements with double height or width"}]},{"type":"element","tag":"code","props":{"code":".h-2 { // takes 2 columns\n grid-column-end: span 2;\n}\n\n.v-2 { // takes 2 rows\n grid-row-end: span 2;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":".h-2 { // takes 2 columns\n grid-column-end: span 2;\n}\n\n.v-2 { // takes 2 rows\n grid-row-end: span 2;\n}\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"header-that-fills-all-columns"},"children":[{"type":"text","value":"Header, that fills all columns"}]},{"type":"element","tag":"code","props":{"code":".full-width {\n grid-row: 1 / 2; // height: 1 row\n grid-column: 1 / -1;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":".full-width {\n grid-row: 1 / 2; // height: 1 row\n grid-column: 1 / -1;\n}\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"stamp-element-that-takes-3-rows-in-the-top-right-corner"},"children":[{"type":"text","value":"Stamp element, that takes 3 rows in the top right corner"}]},{"type":"element","tag":"code","props":{"code":".top-right {\n grid-row: 1 / 3; // height here\n grid-column: -2 / -1; // width here\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":".top-right {\n grid-row: 1 / 3; // height here\n grid-column: -2 / -1; // width here\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Grid, that places items by density. Pure #css solution. Can be used with items, that take different amount of rows/columns."}]},{"type":"element","tag":"code","props":{"code":"$cell: 250px;\n$gap: 20px;\n\n.grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax($cell, 1fr));\n grid-auto-rows: 256px;\n grid-auto-flow: row dense;\n grid-column-gap: $gap;\n grid-row-gap: $gap;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-056ebb"},"children":[{"type":"text","value":"$cell: "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"250"}]},{"type":"element","tag":"span","props":{"class":"ct-c67ab6"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-056ebb"},"children":[{"type":"text","value":"$gap: "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"20"}]},{"type":"element","tag":"span","props":{"class":"ct-c67ab6"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-afae65"},"children":[{"type":"text","value":".grid"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-46c41a"},"children":[{"type":"text","value":"display"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-5445d1"},"children":[{"type":"text","value":"grid"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-46c41a"},"children":[{"type":"text","value":"grid-template-columns"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a411fb"},"children":[{"type":"text","value":"repeat"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-0e1737"},"children":[{"type":"text","value":"auto-fit"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-a411fb"},"children":[{"type":"text","value":"minmax"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-0e1737"},"children":[{"type":"text","value":"$cell"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-473b07"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-a21da7"},"children":[{"type":"text","value":"fr"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a351a6"},"children":[{"type":"text","value":"grid-auto-rows"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"256"}]},{"type":"element","tag":"span","props":{"class":"ct-c67ab6"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-46c41a"},"children":[{"type":"text","value":"grid-auto-flow"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-5445d1"},"children":[{"type":"text","value":"row"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5445d1"},"children":[{"type":"text","value":"dense"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-46c41a"},"children":[{"type":"text","value":"grid-column-gap"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0e1737"},"children":[{"type":"text","value":"$gap"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-46c41a"},"children":[{"type":"text","value":"grid-row-gap"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0e1737"},"children":[{"type":"text","value":"$gap"}]},{"type":"element","tag":"span","props":{"class":"ct-880855"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"basic-elements-with-double-height-or-width"},"children":[{"type":"text","value":"Basic elements with double height or width"}]},{"type":"element","tag":"code","props":{"code":".h-2 { // takes 2 columns\n grid-column-end: span 2;\n}\n\n.v-2 { // takes 2 rows\n grid-row-end: span 2;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-afae65"},"children":[{"type":"text","value":".h-2"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-aeae87"},"children":[{"type":"text","value":"// takes 2 columns"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a351a6"},"children":[{"type":"text","value":"grid-column-end"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a351a6"},"children":[{"type":"text","value":"span"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-afae65"},"children":[{"type":"text","value":".v-2"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-aeae87"},"children":[{"type":"text","value":"// takes 2 rows"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a351a6"},"children":[{"type":"text","value":"grid-row-end"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a351a6"},"children":[{"type":"text","value":"span"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"header-that-fills-all-columns"},"children":[{"type":"text","value":"Header, that fills all columns"}]},{"type":"element","tag":"code","props":{"code":".full-width {\n grid-row: 1 / 2; // height: 1 row\n grid-column: 1 / -1;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-afae65"},"children":[{"type":"text","value":".full-width"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a351a6"},"children":[{"type":"text","value":"grid-row"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c67ab6"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-aeae87"},"children":[{"type":"text","value":"// height: 1 row"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a351a6"},"children":[{"type":"text","value":"grid-column"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" / "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"-1"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"stamp-element-that-takes-3-rows-in-the-top-right-corner"},"children":[{"type":"text","value":"Stamp element, that takes 3 rows in the top right corner"}]},{"type":"element","tag":"code","props":{"code":".top-right {\n grid-row: 1 / 3; // height here\n grid-column: -2 / -1; // width here\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-afae65"},"children":[{"type":"text","value":".top-right"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a351a6"},"children":[{"type":"text","value":"grid-row"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c67ab6"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-aeae87"},"children":[{"type":"text","value":"// height here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a351a6"},"children":[{"type":"text","value":"grid-column"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"-2"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":" / "}]},{"type":"element","tag":"span","props":{"class":"ct-9ec046"},"children":[{"type":"text","value":"-1"}]},{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-aeae87"},"children":[{"type":"text","value":"// width here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56a0d"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-aeae87{color:#8B949E}.ct-a351a6{color:#79C0FF}.ct-a21da7{color:#FF7B72}.ct-473b07{color:#79C0FF}.ct-0e1737{color:#FFA657}.ct-a411fb{color:#79C0FF}.ct-5445d1{color:#79C0FF}.ct-46c41a{color:#79C0FF}.ct-880855{color:#C9D1D9}.ct-afae65{color:#79C0FF}.ct-b56a0d{color:#C9D1D9}.ct-c67ab6{color:#FF7B72}.ct-9ec046{color:#79C0FF}.ct-056ebb{color:#FFA657}.light .ct-056ebb{color:#657B83}.light .ct-9ec046{color:#D33682}.light .ct-c67ab6{color:#859900}.light .ct-b56a0d{color:#657B83}.light .ct-afae65{color:#93A1A1}.light .ct-880855{color:#657B83}.light .ct-46c41a{color:#859900}.light .ct-5445d1{color:#657B83}.light .ct-a411fb{color:#268BD2}.light .ct-0e1737{color:#657B83}.light .ct-473b07{color:#D33682}.light .ct-a21da7{color:#859900}.light .ct-a351a6{color:#859900}.light .ct-aeae87{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"basic-elements-with-double-height-or-width","depth":3,"text":"Basic elements with double height or width"},{"id":"header-that-fills-all-columns","depth":3,"text":"Header, that fills all columns"},{"id":"stamp-element-that-takes-3-rows-in-the-top-right-corner","depth":3,"text":"Stamp element, that takes 3 rows in the top right corner"}]}},"_type":"markdown","_id":"content:CSS:Automatic Grid like Masonry with pure CSS.md","_source":"content","_file":"CSS/Automatic Grid like Masonry with pure CSS.md","_extension":"md"} \ No newline at end of file +{"_path":"/css/automatic-grid-like-masonry-with-pure-css","_dir":"css","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Automatic Grid Like Masonry With Pure CSS","description":"Grid, that places items by density. Pure #css solution. Can be used with items, that take different amount of rows/columns.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Grid, that places items by density. Pure #css solution. Can be used with items, that take different amount of rows/columns."}]},{"type":"element","tag":"code","props":{"code":"$cell: 250px;\n$gap: 20px;\n\n.grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax($cell, 1fr));\n grid-auto-rows: 256px;\n grid-auto-flow: row dense;\n grid-column-gap: $gap;\n grid-row-gap: $gap;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"$cell: 250px;\n$gap: 20px;\n\n.grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax($cell, 1fr));\n grid-auto-rows: 256px;\n grid-auto-flow: row dense;\n grid-column-gap: $gap;\n grid-row-gap: $gap;\n}\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"basic-elements-with-double-height-or-width"},"children":[{"type":"text","value":"Basic elements with double height or width"}]},{"type":"element","tag":"code","props":{"code":".h-2 { // takes 2 columns\n grid-column-end: span 2;\n}\n\n.v-2 { // takes 2 rows\n grid-row-end: span 2;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":".h-2 { // takes 2 columns\n grid-column-end: span 2;\n}\n\n.v-2 { // takes 2 rows\n grid-row-end: span 2;\n}\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"header-that-fills-all-columns"},"children":[{"type":"text","value":"Header, that fills all columns"}]},{"type":"element","tag":"code","props":{"code":".full-width {\n grid-row: 1 / 2; // height: 1 row\n grid-column: 1 / -1;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":".full-width {\n grid-row: 1 / 2; // height: 1 row\n grid-column: 1 / -1;\n}\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"stamp-element-that-takes-3-rows-in-the-top-right-corner"},"children":[{"type":"text","value":"Stamp element, that takes 3 rows in the top right corner"}]},{"type":"element","tag":"code","props":{"code":".top-right {\n grid-row: 1 / 3; // height here\n grid-column: -2 / -1; // width here\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":".top-right {\n grid-row: 1 / 3; // height here\n grid-column: -2 / -1; // width here\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Grid, that places items by density. Pure #css solution. Can be used with items, that take different amount of rows/columns."}]},{"type":"element","tag":"code","props":{"code":"$cell: 250px;\n$gap: 20px;\n\n.grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax($cell, 1fr));\n grid-auto-rows: 256px;\n grid-auto-flow: row dense;\n grid-column-gap: $gap;\n grid-row-gap: $gap;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b7c931"},"children":[{"type":"text","value":"$cell: "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"250"}]},{"type":"element","tag":"span","props":{"class":"ct-535298"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b7c931"},"children":[{"type":"text","value":"$gap: "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"20"}]},{"type":"element","tag":"span","props":{"class":"ct-535298"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0deccd"},"children":[{"type":"text","value":".grid"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac4382"},"children":[{"type":"text","value":"display"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-03adce"},"children":[{"type":"text","value":"grid"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac4382"},"children":[{"type":"text","value":"grid-template-columns"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-5c090b"},"children":[{"type":"text","value":"repeat"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3e58c4"},"children":[{"type":"text","value":"auto-fit"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-5c090b"},"children":[{"type":"text","value":"minmax"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3e58c4"},"children":[{"type":"text","value":"$cell"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-401198"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-7bc134"},"children":[{"type":"text","value":"fr"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f6288"},"children":[{"type":"text","value":"grid-auto-rows"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"256"}]},{"type":"element","tag":"span","props":{"class":"ct-535298"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac4382"},"children":[{"type":"text","value":"grid-auto-flow"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-03adce"},"children":[{"type":"text","value":"row"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03adce"},"children":[{"type":"text","value":"dense"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac4382"},"children":[{"type":"text","value":"grid-column-gap"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3e58c4"},"children":[{"type":"text","value":"$gap"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac4382"},"children":[{"type":"text","value":"grid-row-gap"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3e58c4"},"children":[{"type":"text","value":"$gap"}]},{"type":"element","tag":"span","props":{"class":"ct-dd221a"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"basic-elements-with-double-height-or-width"},"children":[{"type":"text","value":"Basic elements with double height or width"}]},{"type":"element","tag":"code","props":{"code":".h-2 { // takes 2 columns\n grid-column-end: span 2;\n}\n\n.v-2 { // takes 2 rows\n grid-row-end: span 2;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0deccd"},"children":[{"type":"text","value":".h-2"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-202ff2"},"children":[{"type":"text","value":"// takes 2 columns"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f6288"},"children":[{"type":"text","value":"grid-column-end"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-7f6288"},"children":[{"type":"text","value":"span"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0deccd"},"children":[{"type":"text","value":".v-2"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-202ff2"},"children":[{"type":"text","value":"// takes 2 rows"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f6288"},"children":[{"type":"text","value":"grid-row-end"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-7f6288"},"children":[{"type":"text","value":"span"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"header-that-fills-all-columns"},"children":[{"type":"text","value":"Header, that fills all columns"}]},{"type":"element","tag":"code","props":{"code":".full-width {\n grid-row: 1 / 2; // height: 1 row\n grid-column: 1 / -1;\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0deccd"},"children":[{"type":"text","value":".full-width"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f6288"},"children":[{"type":"text","value":"grid-row"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535298"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-202ff2"},"children":[{"type":"text","value":"// height: 1 row"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f6288"},"children":[{"type":"text","value":"grid-column"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" / "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"-1"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"stamp-element-that-takes-3-rows-in-the-top-right-corner"},"children":[{"type":"text","value":"Stamp element, that takes 3 rows in the top right corner"}]},{"type":"element","tag":"code","props":{"code":".top-right {\n grid-row: 1 / 3; // height here\n grid-column: -2 / -1; // width here\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0deccd"},"children":[{"type":"text","value":".top-right"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f6288"},"children":[{"type":"text","value":"grid-row"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535298"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-202ff2"},"children":[{"type":"text","value":"// height here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f6288"},"children":[{"type":"text","value":"grid-column"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"-2"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":" / "}]},{"type":"element","tag":"span","props":{"class":"ct-a9479e"},"children":[{"type":"text","value":"-1"}]},{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-202ff2"},"children":[{"type":"text","value":"// width here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd1102"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-202ff2{color:#8B949E}.ct-7f6288{color:#79C0FF}.ct-7bc134{color:#FF7B72}.ct-401198{color:#79C0FF}.ct-3e58c4{color:#FFA657}.ct-5c090b{color:#79C0FF}.ct-03adce{color:#79C0FF}.ct-ac4382{color:#79C0FF}.ct-dd221a{color:#C9D1D9}.ct-0deccd{color:#79C0FF}.ct-cd1102{color:#C9D1D9}.ct-535298{color:#FF7B72}.ct-a9479e{color:#79C0FF}.ct-b7c931{color:#FFA657}.light .ct-b7c931{color:#657B83}.light .ct-a9479e{color:#D33682}.light .ct-535298{color:#859900}.light .ct-cd1102{color:#657B83}.light .ct-0deccd{color:#93A1A1}.light .ct-dd221a{color:#657B83}.light .ct-ac4382{color:#859900}.light .ct-03adce{color:#657B83}.light .ct-5c090b{color:#268BD2}.light .ct-3e58c4{color:#657B83}.light .ct-401198{color:#D33682}.light .ct-7bc134{color:#859900}.light .ct-7f6288{color:#859900}.light .ct-202ff2{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"basic-elements-with-double-height-or-width","depth":3,"text":"Basic elements with double height or width"},{"id":"header-that-fills-all-columns","depth":3,"text":"Header, that fills all columns"},{"id":"stamp-element-that-takes-3-rows-in-the-top-right-corner","depth":3,"text":"Stamp element, that takes 3 rows in the top right corner"}]}},"_type":"markdown","_id":"content:CSS:Automatic Grid like Masonry with pure CSS.md","_source":"content","_file":"CSS/Automatic Grid like Masonry with pure CSS.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/1Q9jaWh0XH.json b/docs/api/_content/query/1Q9jaWh0XH.json index ff2f6ec..4db9df3 100644 --- a/docs/api/_content/query/1Q9jaWh0XH.json +++ b/docs/api/_content/query/1Q9jaWh0XH.json @@ -1 +1 @@ -{"_path":"/obsidian/self-hosted-obsidian-sync-with-couchdb","_dir":"obsidian","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Self Hosted Obsidian Sync With CouchDB","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vrtmrz/obsidian-livesync","rel":["nofollow"]},"children":[{"type":"text","value":"Main documentation"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vrtmrz/obsidian-livesync/blob/main/docs/setup_own_server.md","rel":["nofollow"]},"children":[{"type":"text","value":"Setting up couchdb"}]}]}]},{"type":"element","tag":"h2","props":{"id":"setting-up-environment"},"children":[{"type":"text","value":"Setting up environment"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"First, you should create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-compose.yml"}]},{"type":"text","value":" with the following contents:"}]},{"type":"element","tag":"code","props":{"code":"version: '3'\nservices:\n couchserver:\n container_name: obsidian__database\n image: couchdb\n restart: always\n ports:\n - \"5984:5984\"\n environment:\n - COUCHDB_USER=user\n - COUCHDB_PASSWORD=somepassword\n volumes:\n - ./couchdb/dbdata:/opt/couchdb/data\n - ./couchdb/local.ini:/opt/couchdb/etc/local.ini\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: '3'\nservices:\n couchserver:\n container_name: obsidian__database\n image: couchdb\n restart: always\n ports:\n - \"5984:5984\"\n environment:\n - COUCHDB_USER=user\n - COUCHDB_PASSWORD=somepassword\n volumes:\n - ./couchdb/dbdata:/opt/couchdb/data\n - ./couchdb/local.ini:/opt/couchdb/etc/local.ini\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then create initial config at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./couchdb/local.ini"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"[couchdb]\nsingle_node=true\nmax_document_size=50000000\nmax_http_request_size=4294967296\n\n[chttpd]\nrequire_valid_user = true\n\n[chttpd_auth]\nrequire_valid_user = true\nauthentication_redirect = /_utils/session.html\n\n[httpd]\nWWW-Authenticate = Basic realm=\"couchdb\"\nenable_cors = true\n\n[cors]\norigins = app://obsidian.md,capacitor://localhost,http://localhost\ncredentials = true\nheaders = accept, authorization, content-type, origin, referer\nmethods = GET, PUT, POST, HEAD, DELETE\nmax_age = 3600\n","language":"ini"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"[couchdb]\nsingle_node=true\nmax_document_size=50000000\nmax_http_request_size=4294967296\n\n[chttpd]\nrequire_valid_user = true\n\n[chttpd_auth]\nrequire_valid_user = true\nauthentication_redirect = /_utils/session.html\n\n[httpd]\nWWW-Authenticate = Basic realm=\"couchdb\"\nenable_cors = true\n\n[cors]\norigins = app://obsidian.md,capacitor://localhost,http://localhost\ncredentials = true\nheaders = accept, authorization, content-type, origin, referer\nmethods = GET, PUT, POST, HEAD, DELETE\nmax_age = 3600\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then, in order to have sync on mobile devices, we will need a reverse proxy with nginx at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/nginx/sites-enabled/obsidian-couchdb"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"server {\n listen 80;\n listen [::]:80;\n server_name couchdb.yourhost.com;\n return 301 https://$host$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n\n ssl_certificate /etc/letsencrypt/live/yourhost.com/fullchain.pem; # managed by Certbot\n ssl_certificate_key /etc/letsencrypt/live/yourhost.com/privkey.pem; # managed by Certbot\n ssl_trusted_certificate /etc/letsencrypt/live/yourhost.com/chain.pem;\n\n server_name couchdb.yourhost.com;\n client_max_body_size 200M;\n\n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n\n proxy_pass http://127.0.0.1:5984;\n }\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"server {\n listen 80;\n listen [::]:80;\n server_name couchdb.yourhost.com;\n return 301 https://$host$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n\n ssl_certificate /etc/letsencrypt/live/yourhost.com/fullchain.pem; # managed by Certbot\n ssl_certificate_key /etc/letsencrypt/live/yourhost.com/privkey.pem; # managed by Certbot\n ssl_trusted_certificate /etc/letsencrypt/live/yourhost.com/chain.pem;\n\n server_name couchdb.yourhost.com;\n client_max_body_size 200M;\n\n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n\n proxy_pass http://127.0.0.1:5984;\n }\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"setting-up-obsidian"},"children":[{"type":"text","value":"Setting up Obsidian"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Install "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Self-hosted LiveSync"}]},{"type":"text","value":" plugin"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Change host to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https://yourhost.com"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Specify username and password"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Press "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"test"}]},{"type":"text","value":", then "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fetch database"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vrtmrz/obsidian-livesync","rel":["nofollow"]},"children":[{"type":"text","value":"Main documentation"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vrtmrz/obsidian-livesync/blob/main/docs/setup_own_server.md","rel":["nofollow"]},"children":[{"type":"text","value":"Setting up couchdb"}]}]}]},{"type":"element","tag":"h2","props":{"id":"setting-up-environment"},"children":[{"type":"text","value":"Setting up environment"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"First, you should create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-compose.yml"}]},{"type":"text","value":" with the following contents:"}]},{"type":"element","tag":"code","props":{"code":"version: '3'\nservices:\n couchserver:\n container_name: obsidian__database\n image: couchdb\n restart: always\n ports:\n - \"5984:5984\"\n environment:\n - COUCHDB_USER=user\n - COUCHDB_PASSWORD=somepassword\n volumes:\n - ./couchdb/dbdata:/opt/couchdb/data\n - ./couchdb/local.ini:/opt/couchdb/etc/local.ini\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b338a"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-865540"},"children":[{"type":"text","value":"'3'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b338a"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9b338a"},"children":[{"type":"text","value":"couchserver"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9b338a"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-865540"},"children":[{"type":"text","value":"obsidian__database"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9b338a"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-865540"},"children":[{"type":"text","value":"couchdb"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9b338a"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-865540"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9b338a"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-865540"},"children":[{"type":"text","value":"\"5984:5984\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9b338a"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-865540"},"children":[{"type":"text","value":"COUCHDB_USER=user"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-865540"},"children":[{"type":"text","value":"COUCHDB_PASSWORD=somepassword"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9b338a"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-865540"},"children":[{"type":"text","value":"./couchdb/dbdata:/opt/couchdb/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-865540"},"children":[{"type":"text","value":"./couchdb/local.ini:/opt/couchdb/etc/local.ini"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then create initial config at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./couchdb/local.ini"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"[couchdb]\nsingle_node=true\nmax_document_size=50000000\nmax_http_request_size=4294967296\n\n[chttpd]\nrequire_valid_user = true\n\n[chttpd_auth]\nrequire_valid_user = true\nauthentication_redirect = /_utils/session.html\n\n[httpd]\nWWW-Authenticate = Basic realm=\"couchdb\"\nenable_cors = true\n\n[cors]\norigins = app://obsidian.md,capacitor://localhost,http://localhost\ncredentials = true\nheaders = accept, authorization, content-type, origin, referer\nmethods = GET, PUT, POST, HEAD, DELETE\nmax_age = 3600\n","language":"ini"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"[couchdb]\nsingle_node=true\nmax_document_size=50000000\nmax_http_request_size=4294967296\n\n[chttpd]\nrequire_valid_user = true\n\n[chttpd_auth]\nrequire_valid_user = true\nauthentication_redirect = /_utils/session.html\n\n[httpd]\nWWW-Authenticate = Basic realm=\"couchdb\"\nenable_cors = true\n\n[cors]\norigins = app://obsidian.md,capacitor://localhost,http://localhost\ncredentials = true\nheaders = accept, authorization, content-type, origin, referer\nmethods = GET, PUT, POST, HEAD, DELETE\nmax_age = 3600"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then, in order to have sync on mobile devices, we will need a reverse proxy with nginx at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/nginx/sites-enabled/obsidian-couchdb"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"server {\n listen 80;\n listen [::]:80;\n server_name couchdb.yourhost.com;\n return 301 https://$host$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n\n ssl_certificate /etc/letsencrypt/live/yourhost.com/fullchain.pem; # managed by Certbot\n ssl_certificate_key /etc/letsencrypt/live/yourhost.com/privkey.pem; # managed by Certbot\n ssl_trusted_certificate /etc/letsencrypt/live/yourhost.com/chain.pem;\n\n server_name couchdb.yourhost.com;\n client_max_body_size 200M;\n\n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n\n proxy_pass http://127.0.0.1:5984;\n }\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5ea5bb"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"80;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"[::]:80;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"couchdb.yourhost.com;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fac75e"},"children":[{"type":"text","value":"301"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" https://"}]},{"type":"element","tag":"span","props":{"class":"ct-a1f629"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7a53cc"},"children":[{"type":"text","value":"host"}]},{"type":"element","tag":"span","props":{"class":"ct-a1f629"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7a53cc"},"children":[{"type":"text","value":"request_uri"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5ea5bb"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"443 ssl http2;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"[::]:443 ssl http2;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" ssl_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"/etc/letsencrypt/live/yourhost.com/fullchain.pem; "}]},{"type":"element","tag":"span","props":{"class":"ct-126005"},"children":[{"type":"text","value":"# managed by Certbot"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" ssl_certificate_key "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"/etc/letsencrypt/live/yourhost.com/privkey.pem; "}]},{"type":"element","tag":"span","props":{"class":"ct-126005"},"children":[{"type":"text","value":"# managed by Certbot"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" ssl_trusted_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"/etc/letsencrypt/live/yourhost.com/chain.pem;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"couchdb.yourhost.com;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" client_max_body_size "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"200M;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-967ad5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-db94fc"},"children":[{"type":"text","value":"location"}]},{"type":"element","tag":"span","props":{"class":"ct-967ad5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6e93f6"},"children":[{"type":"text","value":"/ "}]},{"type":"element","tag":"span","props":{"class":"ct-967ad5"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" proxy_redirect "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"off;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"Host "}]},{"type":"element","tag":"span","props":{"class":"ct-a1f629"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7a53cc"},"children":[{"type":"text","value":"host"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"X-Real-IP "}]},{"type":"element","tag":"span","props":{"class":"ct-a1f629"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7a53cc"},"children":[{"type":"text","value":"remote_addr"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"X-Forwarded-For "}]},{"type":"element","tag":"span","props":{"class":"ct-a1f629"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7a53cc"},"children":[{"type":"text","value":"proxy_add_x_forwarded_for"}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9798e6"},"children":[{"type":"text","value":" proxy_pass "}]},{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"http://127.0.0.1:5984;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-507697"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"setting-up-obsidian"},"children":[{"type":"text","value":"Setting up Obsidian"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Install "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Self-hosted LiveSync"}]},{"type":"text","value":" plugin"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Change host to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https://yourhost.com"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Specify username and password"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Press "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"test"}]},{"type":"text","value":", then "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fetch database"}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-6e93f6{color:#FFA657}.ct-db94fc{color:#FF7B72}.ct-967ad5{color:#C9D1D9}.ct-126005{color:#8B949E}.ct-7a53cc{color:#C9D1D9}.ct-a1f629{color:#C9D1D9}.ct-fac75e{color:#79C0FF}.ct-9798e6{color:#FF7B72}.ct-5ea5bb{color:#FF7B72}.ct-865540{color:#A5D6FF}.ct-507697{color:#C9D1D9}.ct-9b338a{color:#7EE787}.light .ct-9b338a{color:#268BD2}.light .ct-507697{color:#657B83}.light .ct-865540{color:#2AA198}.light .ct-5ea5bb{color:#073642}.light .ct-9798e6{color:#859900}.light .ct-fac75e{color:#D33682}.light .ct-a1f629{color:#859900}.light .ct-7a53cc{color:#268BD2}.light .ct-126005{color:#93A1A1}.light .ct-967ad5{color:#657B83}.light .ct-db94fc{color:#073642}.light .ct-6e93f6{color:#657B83}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"setting-up-environment","depth":2,"text":"Setting up environment"},{"id":"setting-up-obsidian","depth":2,"text":"Setting up Obsidian"}]}},"_type":"markdown","_id":"content:Obsidian:Self-hosted Obsidian sync with CouchDB.md","_source":"content","_file":"Obsidian/Self-hosted Obsidian sync with CouchDB.md","_extension":"md"} \ No newline at end of file +{"_path":"/obsidian/self-hosted-obsidian-sync-with-couchdb","_dir":"obsidian","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Self Hosted Obsidian Sync With CouchDB","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vrtmrz/obsidian-livesync","rel":["nofollow"]},"children":[{"type":"text","value":"Main documentation"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vrtmrz/obsidian-livesync/blob/main/docs/setup_own_server.md","rel":["nofollow"]},"children":[{"type":"text","value":"Setting up couchdb"}]}]}]},{"type":"element","tag":"h2","props":{"id":"setting-up-environment"},"children":[{"type":"text","value":"Setting up environment"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"First, you should create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-compose.yml"}]},{"type":"text","value":" with the following contents:"}]},{"type":"element","tag":"code","props":{"code":"version: '3'\nservices:\n couchserver:\n container_name: obsidian__database\n image: couchdb\n restart: always\n ports:\n - \"5984:5984\"\n environment:\n - COUCHDB_USER=user\n - COUCHDB_PASSWORD=somepassword\n volumes:\n - ./couchdb/dbdata:/opt/couchdb/data\n - ./couchdb/local.ini:/opt/couchdb/etc/local.ini\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: '3'\nservices:\n couchserver:\n container_name: obsidian__database\n image: couchdb\n restart: always\n ports:\n - \"5984:5984\"\n environment:\n - COUCHDB_USER=user\n - COUCHDB_PASSWORD=somepassword\n volumes:\n - ./couchdb/dbdata:/opt/couchdb/data\n - ./couchdb/local.ini:/opt/couchdb/etc/local.ini\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then create initial config at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./couchdb/local.ini"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"[couchdb]\nsingle_node=true\nmax_document_size=50000000\nmax_http_request_size=4294967296\n\n[chttpd]\nrequire_valid_user = true\n\n[chttpd_auth]\nrequire_valid_user = true\nauthentication_redirect = /_utils/session.html\n\n[httpd]\nWWW-Authenticate = Basic realm=\"couchdb\"\nenable_cors = true\n\n[cors]\norigins = app://obsidian.md,capacitor://localhost,http://localhost\ncredentials = true\nheaders = accept, authorization, content-type, origin, referer\nmethods = GET, PUT, POST, HEAD, DELETE\nmax_age = 3600\n","language":"ini"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"[couchdb]\nsingle_node=true\nmax_document_size=50000000\nmax_http_request_size=4294967296\n\n[chttpd]\nrequire_valid_user = true\n\n[chttpd_auth]\nrequire_valid_user = true\nauthentication_redirect = /_utils/session.html\n\n[httpd]\nWWW-Authenticate = Basic realm=\"couchdb\"\nenable_cors = true\n\n[cors]\norigins = app://obsidian.md,capacitor://localhost,http://localhost\ncredentials = true\nheaders = accept, authorization, content-type, origin, referer\nmethods = GET, PUT, POST, HEAD, DELETE\nmax_age = 3600\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then, in order to have sync on mobile devices, we will need a reverse proxy with nginx at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/nginx/sites-enabled/obsidian-couchdb"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"server {\n listen 80;\n listen [::]:80;\n server_name couchdb.yourhost.com;\n return 301 https://$host$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n\n ssl_certificate /etc/letsencrypt/live/yourhost.com/fullchain.pem; # managed by Certbot\n ssl_certificate_key /etc/letsencrypt/live/yourhost.com/privkey.pem; # managed by Certbot\n ssl_trusted_certificate /etc/letsencrypt/live/yourhost.com/chain.pem;\n\n server_name couchdb.yourhost.com;\n client_max_body_size 200M;\n\n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n\n proxy_pass http://127.0.0.1:5984;\n }\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"server {\n listen 80;\n listen [::]:80;\n server_name couchdb.yourhost.com;\n return 301 https://$host$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n\n ssl_certificate /etc/letsencrypt/live/yourhost.com/fullchain.pem; # managed by Certbot\n ssl_certificate_key /etc/letsencrypt/live/yourhost.com/privkey.pem; # managed by Certbot\n ssl_trusted_certificate /etc/letsencrypt/live/yourhost.com/chain.pem;\n\n server_name couchdb.yourhost.com;\n client_max_body_size 200M;\n\n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n\n proxy_pass http://127.0.0.1:5984;\n }\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"setting-up-obsidian"},"children":[{"type":"text","value":"Setting up Obsidian"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Install "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Self-hosted LiveSync"}]},{"type":"text","value":" plugin"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Change host to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https://yourhost.com"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Specify username and password"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Press "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"test"}]},{"type":"text","value":", then "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fetch database"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vrtmrz/obsidian-livesync","rel":["nofollow"]},"children":[{"type":"text","value":"Main documentation"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vrtmrz/obsidian-livesync/blob/main/docs/setup_own_server.md","rel":["nofollow"]},"children":[{"type":"text","value":"Setting up couchdb"}]}]}]},{"type":"element","tag":"h2","props":{"id":"setting-up-environment"},"children":[{"type":"text","value":"Setting up environment"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"First, you should create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-compose.yml"}]},{"type":"text","value":" with the following contents:"}]},{"type":"element","tag":"code","props":{"code":"version: '3'\nservices:\n couchserver:\n container_name: obsidian__database\n image: couchdb\n restart: always\n ports:\n - \"5984:5984\"\n environment:\n - COUCHDB_USER=user\n - COUCHDB_PASSWORD=somepassword\n volumes:\n - ./couchdb/dbdata:/opt/couchdb/data\n - ./couchdb/local.ini:/opt/couchdb/etc/local.ini\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d64517"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-53f02b"},"children":[{"type":"text","value":"'3'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d64517"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d64517"},"children":[{"type":"text","value":"couchserver"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d64517"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-53f02b"},"children":[{"type":"text","value":"obsidian__database"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d64517"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-53f02b"},"children":[{"type":"text","value":"couchdb"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d64517"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-53f02b"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d64517"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-53f02b"},"children":[{"type":"text","value":"\"5984:5984\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d64517"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-53f02b"},"children":[{"type":"text","value":"COUCHDB_USER=user"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-53f02b"},"children":[{"type":"text","value":"COUCHDB_PASSWORD=somepassword"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d64517"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-53f02b"},"children":[{"type":"text","value":"./couchdb/dbdata:/opt/couchdb/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-53f02b"},"children":[{"type":"text","value":"./couchdb/local.ini:/opt/couchdb/etc/local.ini"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then create initial config at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./couchdb/local.ini"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"[couchdb]\nsingle_node=true\nmax_document_size=50000000\nmax_http_request_size=4294967296\n\n[chttpd]\nrequire_valid_user = true\n\n[chttpd_auth]\nrequire_valid_user = true\nauthentication_redirect = /_utils/session.html\n\n[httpd]\nWWW-Authenticate = Basic realm=\"couchdb\"\nenable_cors = true\n\n[cors]\norigins = app://obsidian.md,capacitor://localhost,http://localhost\ncredentials = true\nheaders = accept, authorization, content-type, origin, referer\nmethods = GET, PUT, POST, HEAD, DELETE\nmax_age = 3600\n","language":"ini"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"[couchdb]\nsingle_node=true\nmax_document_size=50000000\nmax_http_request_size=4294967296\n\n[chttpd]\nrequire_valid_user = true\n\n[chttpd_auth]\nrequire_valid_user = true\nauthentication_redirect = /_utils/session.html\n\n[httpd]\nWWW-Authenticate = Basic realm=\"couchdb\"\nenable_cors = true\n\n[cors]\norigins = app://obsidian.md,capacitor://localhost,http://localhost\ncredentials = true\nheaders = accept, authorization, content-type, origin, referer\nmethods = GET, PUT, POST, HEAD, DELETE\nmax_age = 3600"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then, in order to have sync on mobile devices, we will need a reverse proxy with nginx at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/nginx/sites-enabled/obsidian-couchdb"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"server {\n listen 80;\n listen [::]:80;\n server_name couchdb.yourhost.com;\n return 301 https://$host$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n\n ssl_certificate /etc/letsencrypt/live/yourhost.com/fullchain.pem; # managed by Certbot\n ssl_certificate_key /etc/letsencrypt/live/yourhost.com/privkey.pem; # managed by Certbot\n ssl_trusted_certificate /etc/letsencrypt/live/yourhost.com/chain.pem;\n\n server_name couchdb.yourhost.com;\n client_max_body_size 200M;\n\n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n\n proxy_pass http://127.0.0.1:5984;\n }\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-18900e"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"80;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"[::]:80;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"couchdb.yourhost.com;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fd005d"},"children":[{"type":"text","value":"301"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" https://"}]},{"type":"element","tag":"span","props":{"class":"ct-6b7a71"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-efa454"},"children":[{"type":"text","value":"host"}]},{"type":"element","tag":"span","props":{"class":"ct-6b7a71"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-efa454"},"children":[{"type":"text","value":"request_uri"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-18900e"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"443 ssl http2;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"[::]:443 ssl http2;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" ssl_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"/etc/letsencrypt/live/yourhost.com/fullchain.pem; "}]},{"type":"element","tag":"span","props":{"class":"ct-828f3e"},"children":[{"type":"text","value":"# managed by Certbot"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" ssl_certificate_key "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"/etc/letsencrypt/live/yourhost.com/privkey.pem; "}]},{"type":"element","tag":"span","props":{"class":"ct-828f3e"},"children":[{"type":"text","value":"# managed by Certbot"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" ssl_trusted_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"/etc/letsencrypt/live/yourhost.com/chain.pem;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"couchdb.yourhost.com;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" client_max_body_size "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"200M;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bda083"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-955371"},"children":[{"type":"text","value":"location"}]},{"type":"element","tag":"span","props":{"class":"ct-bda083"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-15522e"},"children":[{"type":"text","value":"/ "}]},{"type":"element","tag":"span","props":{"class":"ct-bda083"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" proxy_redirect "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"off;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"Host "}]},{"type":"element","tag":"span","props":{"class":"ct-6b7a71"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-efa454"},"children":[{"type":"text","value":"host"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"X-Real-IP "}]},{"type":"element","tag":"span","props":{"class":"ct-6b7a71"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-efa454"},"children":[{"type":"text","value":"remote_addr"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"X-Forwarded-For "}]},{"type":"element","tag":"span","props":{"class":"ct-6b7a71"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-efa454"},"children":[{"type":"text","value":"proxy_add_x_forwarded_for"}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0d7550"},"children":[{"type":"text","value":" proxy_pass "}]},{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"http://127.0.0.1:5984;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27e645"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"setting-up-obsidian"},"children":[{"type":"text","value":"Setting up Obsidian"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Install "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Self-hosted LiveSync"}]},{"type":"text","value":" plugin"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Change host to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https://yourhost.com"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Specify username and password"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Press "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"test"}]},{"type":"text","value":", then "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fetch database"}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-15522e{color:#FFA657}.ct-955371{color:#FF7B72}.ct-bda083{color:#C9D1D9}.ct-828f3e{color:#8B949E}.ct-efa454{color:#C9D1D9}.ct-6b7a71{color:#C9D1D9}.ct-fd005d{color:#79C0FF}.ct-0d7550{color:#FF7B72}.ct-18900e{color:#FF7B72}.ct-53f02b{color:#A5D6FF}.ct-27e645{color:#C9D1D9}.ct-d64517{color:#7EE787}.light .ct-d64517{color:#268BD2}.light .ct-27e645{color:#657B83}.light .ct-53f02b{color:#2AA198}.light .ct-18900e{color:#073642}.light .ct-0d7550{color:#859900}.light .ct-fd005d{color:#D33682}.light .ct-6b7a71{color:#859900}.light .ct-efa454{color:#268BD2}.light .ct-828f3e{color:#93A1A1}.light .ct-bda083{color:#657B83}.light .ct-955371{color:#073642}.light .ct-15522e{color:#657B83}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"setting-up-environment","depth":2,"text":"Setting up environment"},{"id":"setting-up-obsidian","depth":2,"text":"Setting up Obsidian"}]}},"_type":"markdown","_id":"content:Obsidian:Self-hosted Obsidian sync with CouchDB.md","_source":"content","_file":"Obsidian/Self-hosted Obsidian sync with CouchDB.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/23vTOdYUTM.json b/docs/api/_content/query/23vTOdYUTM.json index 4725746..4958844 100644 --- a/docs/api/_content/query/23vTOdYUTM.json +++ b/docs/api/_content/query/23vTOdYUTM.json @@ -1 +1 @@ -{"_path":"/linux/certbot-well-known-auto-renew","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Certbot Well Known Auto Renew","description":"This is translation of article from clsv.ru, which explains how to automate certbot's well-known, also known as HTTP challenge for wildcard certs renewal.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is translation of article from "},{"type":"element","tag":"a","props":{"href":"https://clsv.ru/linux/lets_encrypt_eto_legko_i_prosto_60","rel":["nofollow"]},"children":[{"type":"text","value":"clsv.ru"}]},{"type":"text","value":", which explains how to automate certbot's well-known, also known as HTTP challenge for wildcard certs renewal."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You'll need 4 scripts:"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Authentication script, which will write authentication file:"}]}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\necho $CERTBOT_VALIDATION > /var/www/html/.well-known/$CERTBOT_TOKEN\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"#!/bin/bash\necho $CERTBOT_VALIDATION > /var/www/html/.well-known/$CERTBOT_TOKEN\n"}]}]}]},{"type":"element","tag":"ol","props":{"start":2},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Cleanup script, that will delete that"}]}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\nrm -f /var/www/html/.well-known/$CERTBOT_TOKEN\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"#!/bin/bash\nrm -f /var/www/html/.well-known/$CERTBOT_TOKEN\n"}]}]}]},{"type":"element","tag":"ol","props":{"start":3},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Initial cert acquiring script:"}]}]},{"type":"element","tag":"code","props":{"code":"certbot certonly \\\n --preferred-challenges=http --manual \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /oath/to/clean.sh\n -d \"yourhost.org,*.yourhost.org\" \\\n --manual-public-ip-logging-ok\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"certbot certonly \\\n --preferred-challenges=http --manual \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /oath/to/clean.sh\n -d \"yourhost.org,*.yourhost.org\" \\\n --manual-public-ip-logging-ok\n"}]}]}]},{"type":"element","tag":"ol","props":{"start":4},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Renewal script itself, to put it in crontab (or /etc/cron.weekly)"}]}]},{"type":"element","tag":"code","props":{"code":"certbot renew --manual-public-ip-logging-ok \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /path/to/clean.sh\n\nsystemctl reload nginx\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"certbot renew --manual-public-ip-logging-ok \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /path/to/clean.sh\n\nsystemctl reload nginx\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to configure your http server to serve "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".well-known"}]},{"type":"text","value":"."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is translation of article from "},{"type":"element","tag":"a","props":{"href":"https://clsv.ru/linux/lets_encrypt_eto_legko_i_prosto_60","rel":["nofollow"]},"children":[{"type":"text","value":"clsv.ru"}]},{"type":"text","value":", which explains how to automate certbot's well-known, also known as HTTP challenge for wildcard certs renewal."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You'll need 4 scripts:"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Authentication script, which will write authentication file:"}]}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\necho $CERTBOT_VALIDATION > /var/www/html/.well-known/$CERTBOT_TOKEN\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-30b3d5"},"children":[{"type":"text","value":"#!/bin/bash"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5e1d2f"},"children":[{"type":"text","value":"echo"}]},{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f1e10"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-61baa0"},"children":[{"type":"text","value":"CERTBOT_VALIDATION"}]},{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d4cb39"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":" /var/www/html/.well-known/"}]},{"type":"element","tag":"span","props":{"class":"ct-0f1e10"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-61baa0"},"children":[{"type":"text","value":"CERTBOT_TOKEN"}]}]}]}]}]},{"type":"element","tag":"ol","props":{"start":2},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Cleanup script, that will delete that"}]}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\nrm -f /var/www/html/.well-known/$CERTBOT_TOKEN\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-30b3d5"},"children":[{"type":"text","value":"#!/bin/bash"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":"rm -f /var/www/html/.well-known/"}]},{"type":"element","tag":"span","props":{"class":"ct-0f1e10"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-61baa0"},"children":[{"type":"text","value":"CERTBOT_TOKEN"}]}]}]}]}]},{"type":"element","tag":"ol","props":{"start":3},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Initial cert acquiring script:"}]}]},{"type":"element","tag":"code","props":{"code":"certbot certonly \\\n --preferred-challenges=http --manual \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /oath/to/clean.sh\n -d \"yourhost.org,*.yourhost.org\" \\\n --manual-public-ip-logging-ok\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":"certbot certonly \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":" --preferred-challenges=http --manual \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":" --manual-auth-hook /path/to/auth.sh \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":" --manual-cleanup-hook /oath/to/clean.sh"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":" -d "}]},{"type":"element","tag":"span","props":{"class":"ct-8f08f4"},"children":[{"type":"text","value":"\"yourhost.org,*.yourhost.org\""}]},{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":" --manual-public-ip-logging-ok"}]}]}]}]}]},{"type":"element","tag":"ol","props":{"start":4},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Renewal script itself, to put it in crontab (or /etc/cron.weekly)"}]}]},{"type":"element","tag":"code","props":{"code":"certbot renew --manual-public-ip-logging-ok \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /path/to/clean.sh\n\nsystemctl reload nginx\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":"certbot renew --manual-public-ip-logging-ok \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":" --manual-auth-hook /path/to/auth.sh \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":" --manual-cleanup-hook /path/to/clean.sh"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-722310"},"children":[{"type":"text","value":"systemctl reload nginx"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to configure your http server to serve "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".well-known"}]},{"type":"text","value":"."}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-8f08f4{color:#A5D6FF}.ct-d4cb39{color:#FF7B72}.ct-61baa0{color:#C9D1D9}.ct-0f1e10{color:#C9D1D9}.ct-722310{color:#C9D1D9}.ct-5e1d2f{color:#79C0FF}.ct-30b3d5{color:#8B949E}.light .ct-30b3d5{color:#93A1A1}.light .ct-5e1d2f{color:#268BD2}.light .ct-722310{color:#657B83}.light .ct-0f1e10{color:#859900}.light .ct-61baa0{color:#268BD2}.light .ct-d4cb39{color:#859900}.light .ct-8f08f4{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Linux:Certbot well-known auto renew.md","_source":"content","_file":"Linux/Certbot well-known auto renew.md","_extension":"md"} \ No newline at end of file +{"_path":"/linux/certbot-well-known-auto-renew","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Certbot Well Known Auto Renew","description":"This is translation of article from clsv.ru, which explains how to automate certbot's well-known, also known as HTTP challenge for wildcard certs renewal.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is translation of article from "},{"type":"element","tag":"a","props":{"href":"https://clsv.ru/linux/lets_encrypt_eto_legko_i_prosto_60","rel":["nofollow"]},"children":[{"type":"text","value":"clsv.ru"}]},{"type":"text","value":", which explains how to automate certbot's well-known, also known as HTTP challenge for wildcard certs renewal."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You'll need 4 scripts:"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Authentication script, which will write authentication file:"}]}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\necho $CERTBOT_VALIDATION > /var/www/html/.well-known/$CERTBOT_TOKEN\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"#!/bin/bash\necho $CERTBOT_VALIDATION > /var/www/html/.well-known/$CERTBOT_TOKEN\n"}]}]}]},{"type":"element","tag":"ol","props":{"start":2},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Cleanup script, that will delete that"}]}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\nrm -f /var/www/html/.well-known/$CERTBOT_TOKEN\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"#!/bin/bash\nrm -f /var/www/html/.well-known/$CERTBOT_TOKEN\n"}]}]}]},{"type":"element","tag":"ol","props":{"start":3},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Initial cert acquiring script:"}]}]},{"type":"element","tag":"code","props":{"code":"certbot certonly \\\n --preferred-challenges=http --manual \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /oath/to/clean.sh\n -d \"yourhost.org,*.yourhost.org\" \\\n --manual-public-ip-logging-ok\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"certbot certonly \\\n --preferred-challenges=http --manual \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /oath/to/clean.sh\n -d \"yourhost.org,*.yourhost.org\" \\\n --manual-public-ip-logging-ok\n"}]}]}]},{"type":"element","tag":"ol","props":{"start":4},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Renewal script itself, to put it in crontab (or /etc/cron.weekly)"}]}]},{"type":"element","tag":"code","props":{"code":"certbot renew --manual-public-ip-logging-ok \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /path/to/clean.sh\n\nsystemctl reload nginx\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"certbot renew --manual-public-ip-logging-ok \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /path/to/clean.sh\n\nsystemctl reload nginx\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to configure your http server to serve "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".well-known"}]},{"type":"text","value":"."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is translation of article from "},{"type":"element","tag":"a","props":{"href":"https://clsv.ru/linux/lets_encrypt_eto_legko_i_prosto_60","rel":["nofollow"]},"children":[{"type":"text","value":"clsv.ru"}]},{"type":"text","value":", which explains how to automate certbot's well-known, also known as HTTP challenge for wildcard certs renewal."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You'll need 4 scripts:"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Authentication script, which will write authentication file:"}]}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\necho $CERTBOT_VALIDATION > /var/www/html/.well-known/$CERTBOT_TOKEN\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-93e482"},"children":[{"type":"text","value":"#!/bin/bash"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b712ed"},"children":[{"type":"text","value":"echo"}]},{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4a3db1"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-80830f"},"children":[{"type":"text","value":"CERTBOT_VALIDATION"}]},{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ab39e2"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":" /var/www/html/.well-known/"}]},{"type":"element","tag":"span","props":{"class":"ct-4a3db1"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-80830f"},"children":[{"type":"text","value":"CERTBOT_TOKEN"}]}]}]}]}]},{"type":"element","tag":"ol","props":{"start":2},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Cleanup script, that will delete that"}]}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\nrm -f /var/www/html/.well-known/$CERTBOT_TOKEN\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-93e482"},"children":[{"type":"text","value":"#!/bin/bash"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":"rm -f /var/www/html/.well-known/"}]},{"type":"element","tag":"span","props":{"class":"ct-4a3db1"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-80830f"},"children":[{"type":"text","value":"CERTBOT_TOKEN"}]}]}]}]}]},{"type":"element","tag":"ol","props":{"start":3},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Initial cert acquiring script:"}]}]},{"type":"element","tag":"code","props":{"code":"certbot certonly \\\n --preferred-challenges=http --manual \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /oath/to/clean.sh\n -d \"yourhost.org,*.yourhost.org\" \\\n --manual-public-ip-logging-ok\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":"certbot certonly \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":" --preferred-challenges=http --manual \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":" --manual-auth-hook /path/to/auth.sh \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":" --manual-cleanup-hook /oath/to/clean.sh"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":" -d "}]},{"type":"element","tag":"span","props":{"class":"ct-13b590"},"children":[{"type":"text","value":"\"yourhost.org,*.yourhost.org\""}]},{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":" --manual-public-ip-logging-ok"}]}]}]}]}]},{"type":"element","tag":"ol","props":{"start":4},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Renewal script itself, to put it in crontab (or /etc/cron.weekly)"}]}]},{"type":"element","tag":"code","props":{"code":"certbot renew --manual-public-ip-logging-ok \\\n --manual-auth-hook /path/to/auth.sh \\\n --manual-cleanup-hook /path/to/clean.sh\n\nsystemctl reload nginx\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":"certbot renew --manual-public-ip-logging-ok \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":" --manual-auth-hook /path/to/auth.sh \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":" --manual-cleanup-hook /path/to/clean.sh"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3f309e"},"children":[{"type":"text","value":"systemctl reload nginx"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to configure your http server to serve "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".well-known"}]},{"type":"text","value":"."}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-13b590{color:#A5D6FF}.ct-ab39e2{color:#FF7B72}.ct-80830f{color:#C9D1D9}.ct-4a3db1{color:#C9D1D9}.ct-3f309e{color:#C9D1D9}.ct-b712ed{color:#79C0FF}.ct-93e482{color:#8B949E}.light .ct-93e482{color:#93A1A1}.light .ct-b712ed{color:#268BD2}.light .ct-3f309e{color:#657B83}.light .ct-4a3db1{color:#859900}.light .ct-80830f{color:#268BD2}.light .ct-ab39e2{color:#859900}.light .ct-13b590{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Linux:Certbot well-known auto renew.md","_source":"content","_file":"Linux/Certbot well-known auto renew.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/2vMf3x3doM.json b/docs/api/_content/query/2vMf3x3doM.json index 01b795c..b2238e4 100644 --- a/docs/api/_content/query/2vMf3x3doM.json +++ b/docs/api/_content/query/2vMf3x3doM.json @@ -1 +1 @@ -{"_path":"/graphql/apollo-client-pagination","_dir":"graphql","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Apollo Client Pagination","description":"Say, we have gql response like this and we wan't to have pagination with it. Let's merge it as it specified in official documentation","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say, we have "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gql"}]},{"type":"text","value":" response like this and we wan't to have pagination with it. Let's merge it as it specified in "},{"type":"element","tag":"a","props":{"href":"https://www.apollographql.com/docs/react/caching/cache-field-behavior/#the-merge-function","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]}]},{"type":"element","tag":"code","props":{"code":"query listItems(\n filter: Filter, \n sort: String,\n limit: Number,\n offset: Number,\n): ItemList!\n\ninput Filter {\n name: String!\n type: String!\n}\n\ntype ItemList {\n items: [Item!]!\n totalCount: Int!\n}\n","language":"graphql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"query listItems(\n filter: Filter, \n sort: String,\n limit: Number,\n offset: Number,\n): ItemList!\n\ninput Filter {\n name: String!\n type: String!\n}\n\ntype ItemList {\n items: [Item!]!\n totalCount: Int!\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We will setup "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"ApolloClient"}]},{"type":"text","value":" with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"typePolicies"}]},{"type":"text","value":" to merge incoming data in cache:"}]},{"type":"element","tag":"code","props":{"code":"import { ApolloClient, InMemoryCache } from '@apollo/client';\n\nconst client = new ApolloClient({\n // ...\n cache: new InMemoryCache({ typePolicies }),\n // ...\n});\n\nexport const typePolicies: TypePolicies = {\n Query: {\n fields: {\n // query name\n listItems: {\n // apollo will serialize and use keyArgs as unique\n // identifier in cache for every query\n // consider choosing the right fields, \n // i.e. limit and offset won't work here\n keyArgs: [\n 'sort', // primitive type\n 'filter', ['name', 'type'] // nested fields of `filter`\n ],\n merge: mergeItemsWithTotalCount,\n },\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { ApolloClient, InMemoryCache } from '@apollo/client';\n\nconst client = new ApolloClient({\n // ...\n cache: new InMemoryCache({ typePolicies }),\n // ...\n});\n\nexport const typePolicies: TypePolicies = {\n Query: {\n fields: {\n // query name\n listItems: {\n // apollo will serialize and use keyArgs as unique\n // identifier in cache for every query\n // consider choosing the right fields, \n // i.e. limit and offset won't work here\n keyArgs: [\n 'sort', // primitive type\n 'filter', ['name', 'type'] // nested fields of `filter`\n ],\n merge: mergeItemsWithTotalCount,\n },\n }\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We will need merge function "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mergeItemsWithTotalCount"}]},{"type":"text","value":", which will join results of query and cached data for specific key:"}]},{"type":"element","tag":"code","props":{"code":"/** merges all sources with { items: unknown[], totalCount: number } */\nconst mergeItemsWithTotalCount = (existing, incoming, { args }) => {\n // no existing data\n if (!existing || !args?.offset || args.offset < existing.length) {\n return incoming || [];\n }\n\n // If hook was called multiple times\n if (existing?.items?.length && args?.offset < existing.items.length) {\n return existing || [];\n }\n\n // merge cache and incoming data\n const items = [...(existing?.items || []), ...(incoming?.items || [])];\n\n // apply latest result for totalCount\n const totalCount = incoming?.totalCount || existing?.totalCount;\n\n return {\n ...(incoming || existing || {}),\n items,\n totalCount,\n };\n };\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"/** merges all sources with { items: unknown[], totalCount: number } */\nconst mergeItemsWithTotalCount = (existing, incoming, { args }) => {\n // no existing data\n if (!existing || !args?.offset || args.offset < existing.length) {\n return incoming || [];\n }\n\n // If hook was called multiple times\n if (existing?.items?.length && args?.offset < existing.items.length) {\n return existing || [];\n }\n\n // merge cache and incoming data\n const items = [...(existing?.items || []), ...(incoming?.items || [])];\n\n // apply latest result for totalCount\n const totalCount = incoming?.totalCount || existing?.totalCount;\n\n return {\n ...(incoming || existing || {}),\n items,\n totalCount,\n };\n };\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say, we have "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gql"}]},{"type":"text","value":" response like this and we wan't to have pagination with it. Let's merge it as it specified in "},{"type":"element","tag":"a","props":{"href":"https://www.apollographql.com/docs/react/caching/cache-field-behavior/#the-merge-function","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]}]},{"type":"element","tag":"code","props":{"code":"query listItems(\n filter: Filter, \n sort: String,\n limit: Number,\n offset: Number,\n): ItemList!\n\ninput Filter {\n name: String!\n type: String!\n}\n\ntype ItemList {\n items: [Item!]!\n totalCount: Int!\n}\n","language":"graphql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"query"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afdd79"},"children":[{"type":"text","value":"listItems"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ea2c84"},"children":[{"type":"text","value":"filter"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-f1c0e2"},"children":[{"type":"text","value":"Filter"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ea2c84"},"children":[{"type":"text","value":"sort"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-f1c0e2"},"children":[{"type":"text","value":"String"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ea2c84"},"children":[{"type":"text","value":"limit"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-f1c0e2"},"children":[{"type":"text","value":"Number"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ea2c84"},"children":[{"type":"text","value":"offset"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-f1c0e2"},"children":[{"type":"text","value":"Number"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"): "}]},{"type":"element","tag":"span","props":{"class":"ct-afdd79"},"children":[{"type":"text","value":"ItemList"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"input"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f47193"},"children":[{"type":"text","value":"Filter"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ea2c84"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-f1c0e2"},"children":[{"type":"text","value":"String"}]},{"type":"element","tag":"span","props":{"class":"ct-b59deb"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ea2c84"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-f1c0e2"},"children":[{"type":"text","value":"String"}]},{"type":"element","tag":"span","props":{"class":"ct-b59deb"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f47193"},"children":[{"type":"text","value":"ItemList"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ea2c84"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":": ["}]},{"type":"element","tag":"span","props":{"class":"ct-f1c0e2"},"children":[{"type":"text","value":"Item"}]},{"type":"element","tag":"span","props":{"class":"ct-b59deb"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":"]"}]},{"type":"element","tag":"span","props":{"class":"ct-b59deb"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ea2c84"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-f1c0e2"},"children":[{"type":"text","value":"Int"}]},{"type":"element","tag":"span","props":{"class":"ct-b59deb"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We will setup "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"ApolloClient"}]},{"type":"text","value":" with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"typePolicies"}]},{"type":"text","value":" to merge incoming data in cache:"}]},{"type":"element","tag":"code","props":{"code":"import { ApolloClient, InMemoryCache } from '@apollo/client';\n\nconst client = new ApolloClient({\n // ...\n cache: new InMemoryCache({ typePolicies }),\n // ...\n});\n\nexport const typePolicies: TypePolicies = {\n Query: {\n fields: {\n // query name\n listItems: {\n // apollo will serialize and use keyArgs as unique\n // identifier in cache for every query\n // consider choosing the right fields, \n // i.e. limit and offset won't work here\n keyArgs: [\n 'sort', // primitive type\n 'filter', ['name', 'type'] // nested fields of `filter`\n ],\n merge: mergeItemsWithTotalCount,\n },\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"ApolloClient"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"InMemoryCache"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5a2d2f"},"children":[{"type":"text","value":"'@apollo/client'"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-da6361"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba692c"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afdd79"},"children":[{"type":"text","value":"ApolloClient"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" cache: "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afdd79"},"children":[{"type":"text","value":"InMemoryCache"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"({ "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"typePolicies"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"});"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da6361"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba692c"},"children":[{"type":"text","value":"typePolicies"}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-13862b"},"children":[{"type":"text","value":"TypePolicies"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" Query: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" fields: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// query name"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" listItems: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// apollo will serialize and use keyArgs as unique"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// identifier in cache for every query"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// consider choosing the right fields, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// i.e. limit and offset won't work here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" keyArgs: ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5a2d2f"},"children":[{"type":"text","value":"'sort'"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// primitive type"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5a2d2f"},"children":[{"type":"text","value":"'filter'"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":", ["}]},{"type":"element","tag":"span","props":{"class":"ct-5a2d2f"},"children":[{"type":"text","value":"'name'"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-5a2d2f"},"children":[{"type":"text","value":"'type'"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"] "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// nested fields of `filter`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" ],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" merge: "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"mergeItemsWithTotalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We will need merge function "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mergeItemsWithTotalCount"}]},{"type":"text","value":", which will join results of query and cached data for specific key:"}]},{"type":"element","tag":"code","props":{"code":"/** merges all sources with { items: unknown[], totalCount: number } */\nconst mergeItemsWithTotalCount = (existing, incoming, { args }) => {\n // no existing data\n if (!existing || !args?.offset || args.offset < existing.length) {\n return incoming || [];\n }\n\n // If hook was called multiple times\n if (existing?.items?.length && args?.offset < existing.items.length) {\n return existing || [];\n }\n\n // merge cache and incoming data\n const items = [...(existing?.items || []), ...(incoming?.items || [])];\n\n // apply latest result for totalCount\n const totalCount = incoming?.totalCount || existing?.totalCount;\n\n return {\n ...(incoming || existing || {}),\n items,\n totalCount,\n };\n };\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"/** merges all sources with { items: unknown[], totalCount: number } */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-da03a1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c198ce"},"children":[{"type":"text","value":"mergeItemsWithTotalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b59deb"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-ea2c84"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-ea2c84"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":", { "}]},{"type":"element","tag":"span","props":{"class":"ct-ea2c84"},"children":[{"type":"text","value":"args"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-da03a1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-74bdc2"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// no existing data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"args"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"offset"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"args"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"offset"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"existing"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" [];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// If hook was called multiple times"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"?."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" [];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// merge cache and incoming data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da6361"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba692c"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-153212"},"children":[{"type":"text","value":"// apply latest result for totalCount"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da6361"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba692c"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-89106e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-565cdc"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90afac"},"children":[{"type":"text","value":" };"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-c198ce{color:#D2A8FF}.ct-da03a1{color:#FF7B72}.ct-13862b{color:#FFA657}.ct-153212{color:#8B949E}.ct-ba692c{color:#79C0FF}.ct-da6361{color:#FF7B72}.ct-5a2d2f{color:#A5D6FF}.ct-565cdc{color:#C9D1D9}.ct-b59deb{color:#FF7B72}.ct-f47193{color:#79C0FF}.ct-f1c0e2{color:#79C0FF}.ct-ea2c84{color:#FFA657}.ct-74bdc2{color:#C9D1D9}.ct-afdd79{color:#D2A8FF}.ct-90afac{color:#C9D1D9}.ct-89106e{color:#FF7B72}.light .ct-89106e{color:#859900}.light .ct-90afac{color:#657B83}.light .ct-afdd79{color:#268BD2}.light .ct-74bdc2{color:#657B83}.light .ct-ea2c84{color:#657B83}.light .ct-f1c0e2{color:#859900}.light .ct-f47193{color:#859900}.light .ct-b59deb{color:#859900}.light .ct-565cdc{color:#268BD2}.light .ct-5a2d2f{color:#2AA198}.light .ct-da6361{color:#073642}.light .ct-ba692c{color:#268BD2}.light .ct-153212{color:#93A1A1}.light .ct-13862b{color:#268BD2}.light .ct-da03a1{color:#073642}.light .ct-c198ce{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:GraphQL:Apollo Client pagination.md","_source":"content","_file":"GraphQL/Apollo Client pagination.md","_extension":"md"} \ No newline at end of file +{"_path":"/graphql/apollo-client-pagination","_dir":"graphql","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Apollo Client Pagination","description":"Say, we have gql response like this and we wan't to have pagination with it. Let's merge it as it specified in official documentation","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say, we have "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gql"}]},{"type":"text","value":" response like this and we wan't to have pagination with it. Let's merge it as it specified in "},{"type":"element","tag":"a","props":{"href":"https://www.apollographql.com/docs/react/caching/cache-field-behavior/#the-merge-function","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]}]},{"type":"element","tag":"code","props":{"code":"query listItems(\n filter: Filter, \n sort: String,\n limit: Number,\n offset: Number,\n): ItemList!\n\ninput Filter {\n name: String!\n type: String!\n}\n\ntype ItemList {\n items: [Item!]!\n totalCount: Int!\n}\n","language":"graphql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"query listItems(\n filter: Filter, \n sort: String,\n limit: Number,\n offset: Number,\n): ItemList!\n\ninput Filter {\n name: String!\n type: String!\n}\n\ntype ItemList {\n items: [Item!]!\n totalCount: Int!\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We will setup "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"ApolloClient"}]},{"type":"text","value":" with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"typePolicies"}]},{"type":"text","value":" to merge incoming data in cache:"}]},{"type":"element","tag":"code","props":{"code":"import { ApolloClient, InMemoryCache } from '@apollo/client';\n\nconst client = new ApolloClient({\n // ...\n cache: new InMemoryCache({ typePolicies }),\n // ...\n});\n\nexport const typePolicies: TypePolicies = {\n Query: {\n fields: {\n // query name\n listItems: {\n // apollo will serialize and use keyArgs as unique\n // identifier in cache for every query\n // consider choosing the right fields, \n // i.e. limit and offset won't work here\n keyArgs: [\n 'sort', // primitive type\n 'filter', ['name', 'type'] // nested fields of `filter`\n ],\n merge: mergeItemsWithTotalCount,\n },\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { ApolloClient, InMemoryCache } from '@apollo/client';\n\nconst client = new ApolloClient({\n // ...\n cache: new InMemoryCache({ typePolicies }),\n // ...\n});\n\nexport const typePolicies: TypePolicies = {\n Query: {\n fields: {\n // query name\n listItems: {\n // apollo will serialize and use keyArgs as unique\n // identifier in cache for every query\n // consider choosing the right fields, \n // i.e. limit and offset won't work here\n keyArgs: [\n 'sort', // primitive type\n 'filter', ['name', 'type'] // nested fields of `filter`\n ],\n merge: mergeItemsWithTotalCount,\n },\n }\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We will need merge function "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mergeItemsWithTotalCount"}]},{"type":"text","value":", which will join results of query and cached data for specific key:"}]},{"type":"element","tag":"code","props":{"code":"/** merges all sources with { items: unknown[], totalCount: number } */\nconst mergeItemsWithTotalCount = (existing, incoming, { args }) => {\n // no existing data\n if (!existing || !args?.offset || args.offset < existing.length) {\n return incoming || [];\n }\n\n // If hook was called multiple times\n if (existing?.items?.length && args?.offset < existing.items.length) {\n return existing || [];\n }\n\n // merge cache and incoming data\n const items = [...(existing?.items || []), ...(incoming?.items || [])];\n\n // apply latest result for totalCount\n const totalCount = incoming?.totalCount || existing?.totalCount;\n\n return {\n ...(incoming || existing || {}),\n items,\n totalCount,\n };\n };\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"/** merges all sources with { items: unknown[], totalCount: number } */\nconst mergeItemsWithTotalCount = (existing, incoming, { args }) => {\n // no existing data\n if (!existing || !args?.offset || args.offset < existing.length) {\n return incoming || [];\n }\n\n // If hook was called multiple times\n if (existing?.items?.length && args?.offset < existing.items.length) {\n return existing || [];\n }\n\n // merge cache and incoming data\n const items = [...(existing?.items || []), ...(incoming?.items || [])];\n\n // apply latest result for totalCount\n const totalCount = incoming?.totalCount || existing?.totalCount;\n\n return {\n ...(incoming || existing || {}),\n items,\n totalCount,\n };\n };\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say, we have "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gql"}]},{"type":"text","value":" response like this and we wan't to have pagination with it. Let's merge it as it specified in "},{"type":"element","tag":"a","props":{"href":"https://www.apollographql.com/docs/react/caching/cache-field-behavior/#the-merge-function","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]}]},{"type":"element","tag":"code","props":{"code":"query listItems(\n filter: Filter, \n sort: String,\n limit: Number,\n offset: Number,\n): ItemList!\n\ninput Filter {\n name: String!\n type: String!\n}\n\ntype ItemList {\n items: [Item!]!\n totalCount: Int!\n}\n","language":"graphql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"query"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1e640f"},"children":[{"type":"text","value":"listItems"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-af2982"},"children":[{"type":"text","value":"filter"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3b4ce6"},"children":[{"type":"text","value":"Filter"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-af2982"},"children":[{"type":"text","value":"sort"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3b4ce6"},"children":[{"type":"text","value":"String"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-af2982"},"children":[{"type":"text","value":"limit"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3b4ce6"},"children":[{"type":"text","value":"Number"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-af2982"},"children":[{"type":"text","value":"offset"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3b4ce6"},"children":[{"type":"text","value":"Number"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"): "}]},{"type":"element","tag":"span","props":{"class":"ct-1e640f"},"children":[{"type":"text","value":"ItemList"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"input"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eac85e"},"children":[{"type":"text","value":"Filter"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-af2982"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3b4ce6"},"children":[{"type":"text","value":"String"}]},{"type":"element","tag":"span","props":{"class":"ct-7b1289"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-af2982"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3b4ce6"},"children":[{"type":"text","value":"String"}]},{"type":"element","tag":"span","props":{"class":"ct-7b1289"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eac85e"},"children":[{"type":"text","value":"ItemList"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-af2982"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":": ["}]},{"type":"element","tag":"span","props":{"class":"ct-3b4ce6"},"children":[{"type":"text","value":"Item"}]},{"type":"element","tag":"span","props":{"class":"ct-7b1289"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":"]"}]},{"type":"element","tag":"span","props":{"class":"ct-7b1289"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-af2982"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-3b4ce6"},"children":[{"type":"text","value":"Int"}]},{"type":"element","tag":"span","props":{"class":"ct-7b1289"},"children":[{"type":"text","value":"!"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We will setup "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"ApolloClient"}]},{"type":"text","value":" with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"typePolicies"}]},{"type":"text","value":" to merge incoming data in cache:"}]},{"type":"element","tag":"code","props":{"code":"import { ApolloClient, InMemoryCache } from '@apollo/client';\n\nconst client = new ApolloClient({\n // ...\n cache: new InMemoryCache({ typePolicies }),\n // ...\n});\n\nexport const typePolicies: TypePolicies = {\n Query: {\n fields: {\n // query name\n listItems: {\n // apollo will serialize and use keyArgs as unique\n // identifier in cache for every query\n // consider choosing the right fields, \n // i.e. limit and offset won't work here\n keyArgs: [\n 'sort', // primitive type\n 'filter', ['name', 'type'] // nested fields of `filter`\n ],\n merge: mergeItemsWithTotalCount,\n },\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"ApolloClient"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"InMemoryCache"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3764bc"},"children":[{"type":"text","value":"'@apollo/client'"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a5e4ff"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ccbc70"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1e640f"},"children":[{"type":"text","value":"ApolloClient"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" cache: "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1e640f"},"children":[{"type":"text","value":"InMemoryCache"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"({ "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"typePolicies"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"});"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a5e4ff"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ccbc70"},"children":[{"type":"text","value":"typePolicies"}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8c4995"},"children":[{"type":"text","value":"TypePolicies"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" Query: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" fields: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// query name"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" listItems: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// apollo will serialize and use keyArgs as unique"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// identifier in cache for every query"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// consider choosing the right fields, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// i.e. limit and offset won't work here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" keyArgs: ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3764bc"},"children":[{"type":"text","value":"'sort'"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// primitive type"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3764bc"},"children":[{"type":"text","value":"'filter'"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":", ["}]},{"type":"element","tag":"span","props":{"class":"ct-3764bc"},"children":[{"type":"text","value":"'name'"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3764bc"},"children":[{"type":"text","value":"'type'"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"] "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// nested fields of `filter`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" ],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" merge: "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"mergeItemsWithTotalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We will need merge function "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mergeItemsWithTotalCount"}]},{"type":"text","value":", which will join results of query and cached data for specific key:"}]},{"type":"element","tag":"code","props":{"code":"/** merges all sources with { items: unknown[], totalCount: number } */\nconst mergeItemsWithTotalCount = (existing, incoming, { args }) => {\n // no existing data\n if (!existing || !args?.offset || args.offset < existing.length) {\n return incoming || [];\n }\n\n // If hook was called multiple times\n if (existing?.items?.length && args?.offset < existing.items.length) {\n return existing || [];\n }\n\n // merge cache and incoming data\n const items = [...(existing?.items || []), ...(incoming?.items || [])];\n\n // apply latest result for totalCount\n const totalCount = incoming?.totalCount || existing?.totalCount;\n\n return {\n ...(incoming || existing || {}),\n items,\n totalCount,\n };\n };\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"/** merges all sources with { items: unknown[], totalCount: number } */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9dffe1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-031566"},"children":[{"type":"text","value":"mergeItemsWithTotalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7b1289"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-af2982"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-af2982"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":", { "}]},{"type":"element","tag":"span","props":{"class":"ct-af2982"},"children":[{"type":"text","value":"args"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-9dffe1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-d80d1a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// no existing data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"args"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"offset"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"args"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"offset"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"existing"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" [];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// If hook was called multiple times"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"?."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" [];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// merge cache and incoming data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a5e4ff"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ccbc70"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-845267"},"children":[{"type":"text","value":"// apply latest result for totalCount"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a5e4ff"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ccbc70"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"existing"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"incoming"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3add6e"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"items"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7744f1"},"children":[{"type":"text","value":"totalCount"}]},{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-dbc662"},"children":[{"type":"text","value":" };"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-031566{color:#D2A8FF}.ct-9dffe1{color:#FF7B72}.ct-8c4995{color:#FFA657}.ct-845267{color:#8B949E}.ct-ccbc70{color:#79C0FF}.ct-a5e4ff{color:#FF7B72}.ct-3764bc{color:#A5D6FF}.ct-7744f1{color:#C9D1D9}.ct-7b1289{color:#FF7B72}.ct-eac85e{color:#79C0FF}.ct-3b4ce6{color:#79C0FF}.ct-af2982{color:#FFA657}.ct-d80d1a{color:#C9D1D9}.ct-1e640f{color:#D2A8FF}.ct-dbc662{color:#C9D1D9}.ct-3add6e{color:#FF7B72}.light .ct-3add6e{color:#859900}.light .ct-dbc662{color:#657B83}.light .ct-1e640f{color:#268BD2}.light .ct-d80d1a{color:#657B83}.light .ct-af2982{color:#657B83}.light .ct-3b4ce6{color:#859900}.light .ct-eac85e{color:#859900}.light .ct-7b1289{color:#859900}.light .ct-7744f1{color:#268BD2}.light .ct-3764bc{color:#2AA198}.light .ct-a5e4ff{color:#073642}.light .ct-ccbc70{color:#268BD2}.light .ct-845267{color:#93A1A1}.light .ct-8c4995{color:#268BD2}.light .ct-9dffe1{color:#073642}.light .ct-031566{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:GraphQL:Apollo Client pagination.md","_source":"content","_file":"GraphQL/Apollo Client pagination.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/4AUGrl0JGY.json b/docs/api/_content/query/4AUGrl0JGY.json index 40c0b0d..86b086c 100644 --- a/docs/api/_content/query/4AUGrl0JGY.json +++ b/docs/api/_content/query/4AUGrl0JGY.json @@ -1 +1 @@ -{"_path":"/docker/wait-for-redis","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Wait For Redis","description":"wait-for-it.sh doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before redis is ready to accept connections","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vishnubob/wait-for-it","rel":["nofollow"]},"children":[{"type":"text","value":"wait-for-it.sh"}]},{"type":"text","value":" doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before redis is ready to accept connections"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This script waits for first successful ping or exits with non-zero status after 3 minutes."}]},{"type":"element","tag":"code","props":{"code":"# Waits for redis to become actually available\nwait_for_redis() {\n timeout=180 # 3 minutes\n i=0\n while ! docker exec -it \"$1\" redis-cli -h localhost -p 6379 -a \"$2\" ping | grep \"PONG\" >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly ping Redis container after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_redis miin-redis-dev password\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"# Waits for redis to become actually available\nwait_for_redis() {\n timeout=180 # 3 minutes\n i=0\n while ! docker exec -it \"$1\" redis-cli -h localhost -p 6379 -a \"$2\" ping | grep \"PONG\" >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly ping Redis container after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_redis miin-redis-dev password\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Wait%20for%20mysql"},"children":[{"type":"text","value":"Wait for mysql"}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vishnubob/wait-for-it","rel":["nofollow"]},"children":[{"type":"text","value":"wait-for-it.sh"}]},{"type":"text","value":" doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before redis is ready to accept connections"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This script waits for first successful ping or exits with non-zero status after 3 minutes."}]},{"type":"element","tag":"code","props":{"code":"# Waits for redis to become actually available\nwait_for_redis() {\n timeout=180 # 3 minutes\n i=0\n while ! docker exec -it \"$1\" redis-cli -h localhost -p 6379 -a \"$2\" ping | grep \"PONG\" >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly ping Redis container after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_redis miin-redis-dev password\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763b9c"},"children":[{"type":"text","value":"# Waits for redis to become actually available"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6003c4"},"children":[{"type":"text","value":"wait_for_redis"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":"() {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" timeout=180 "}]},{"type":"element","tag":"span","props":{"class":"ct-763b9c"},"children":[{"type":"text","value":"# 3 minutes"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" i=0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":"while"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" docker "}]},{"type":"element","tag":"span","props":{"class":"ct-f19cb2"},"children":[{"type":"text","value":"exec"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" -it "}]},{"type":"element","tag":"span","props":{"class":"ct-1a89b4"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-45c1f7"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-3c6a3e"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-1a89b4"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" redis-cli -h localhost -p 6379 -a "}]},{"type":"element","tag":"span","props":{"class":"ct-1a89b4"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-45c1f7"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-3c6a3e"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-1a89b4"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" ping "}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" grep "}]},{"type":"element","tag":"span","props":{"class":"ct-1a89b4"},"children":[{"type":"text","value":"\"PONG\""}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":"/dev/null "}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":"2>&1;"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":"do"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" sleep 1"}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" i="}]},{"type":"element","tag":"span","props":{"class":"ct-1a89b4"},"children":[{"type":"text","value":"$(("}]},{"type":"element","tag":"span","props":{"class":"ct-45c1f7"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-3c6a3e"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-300474"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-1a89b4"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" [[ "}]},{"type":"element","tag":"span","props":{"class":"ct-45c1f7"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-3c6a3e"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-45c1f7"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":"-ge"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-45c1f7"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-3c6a3e"},"children":[{"type":"text","value":"timeout"}]},{"type":"element","tag":"span","props":{"class":"ct-45c1f7"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" ]]"}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":";"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":"then"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f19cb2"},"children":[{"type":"text","value":"echo"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1a89b4"},"children":[{"type":"text","value":"\"[Error] can't properly ping Redis container after "}]},{"type":"element","tag":"span","props":{"class":"ct-45c1f7"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-3c6a3e"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-45c1f7"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-1a89b4"},"children":[{"type":"text","value":" secs\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f19cb2"},"children":[{"type":"text","value":"exit"}]},{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" 1"}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":"fi"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8a1f59"},"children":[{"type":"text","value":"done"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20f250"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763b9c"},"children":[{"type":"text","value":"# usage: wait_for_redis miin-redis-dev password"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Wait%20for%20mysql"},"children":[{"type":"text","value":"Wait for mysql"}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-300474{color:#79C0FF}.ct-3c6a3e{color:#C9D1D9}.ct-45c1f7{color:#C9D1D9}.ct-1a89b4{color:#A5D6FF}.ct-f19cb2{color:#79C0FF}.ct-8a1f59{color:#FF7B72}.ct-20f250{color:#C9D1D9}.ct-6003c4{color:#D2A8FF}.ct-763b9c{color:#8B949E}.light .ct-763b9c{color:#93A1A1}.light .ct-6003c4{color:#268BD2}.light .ct-20f250{color:#657B83}.light .ct-8a1f59{color:#859900}.light .ct-f19cb2{color:#268BD2}.light .ct-1a89b4{color:#2AA198}.light .ct-45c1f7{color:#859900}.light .ct-3c6a3e{color:#268BD2}.light .ct-300474{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Docker:Wait for redis.md","_source":"content","_file":"Docker/Wait for redis.md","_extension":"md"} \ No newline at end of file +{"_path":"/docker/wait-for-redis","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Wait For Redis","description":"wait-for-it.sh doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before redis is ready to accept connections","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vishnubob/wait-for-it","rel":["nofollow"]},"children":[{"type":"text","value":"wait-for-it.sh"}]},{"type":"text","value":" doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before redis is ready to accept connections"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This script waits for first successful ping or exits with non-zero status after 3 minutes."}]},{"type":"element","tag":"code","props":{"code":"# Waits for redis to become actually available\nwait_for_redis() {\n timeout=180 # 3 minutes\n i=0\n while ! docker exec -it \"$1\" redis-cli -h localhost -p 6379 -a \"$2\" ping | grep \"PONG\" >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly ping Redis container after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_redis miin-redis-dev password\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"# Waits for redis to become actually available\nwait_for_redis() {\n timeout=180 # 3 minutes\n i=0\n while ! docker exec -it \"$1\" redis-cli -h localhost -p 6379 -a \"$2\" ping | grep \"PONG\" >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly ping Redis container after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_redis miin-redis-dev password\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Wait%20for%20mysql"},"children":[{"type":"text","value":"Wait for mysql"}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vishnubob/wait-for-it","rel":["nofollow"]},"children":[{"type":"text","value":"wait-for-it.sh"}]},{"type":"text","value":" doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before redis is ready to accept connections"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This script waits for first successful ping or exits with non-zero status after 3 minutes."}]},{"type":"element","tag":"code","props":{"code":"# Waits for redis to become actually available\nwait_for_redis() {\n timeout=180 # 3 minutes\n i=0\n while ! docker exec -it \"$1\" redis-cli -h localhost -p 6379 -a \"$2\" ping | grep \"PONG\" >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly ping Redis container after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_redis miin-redis-dev password\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3d82fe"},"children":[{"type":"text","value":"# Waits for redis to become actually available"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a45584"},"children":[{"type":"text","value":"wait_for_redis"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":"() {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" timeout=180 "}]},{"type":"element","tag":"span","props":{"class":"ct-3d82fe"},"children":[{"type":"text","value":"# 3 minutes"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" i=0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":"while"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" docker "}]},{"type":"element","tag":"span","props":{"class":"ct-48c63c"},"children":[{"type":"text","value":"exec"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" -it "}]},{"type":"element","tag":"span","props":{"class":"ct-5a6fca"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-1904d6"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-9f136f"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5a6fca"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" redis-cli -h localhost -p 6379 -a "}]},{"type":"element","tag":"span","props":{"class":"ct-5a6fca"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-1904d6"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-9f136f"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-5a6fca"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" ping "}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" grep "}]},{"type":"element","tag":"span","props":{"class":"ct-5a6fca"},"children":[{"type":"text","value":"\"PONG\""}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":"/dev/null "}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":"2>&1;"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":"do"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" sleep 1"}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" i="}]},{"type":"element","tag":"span","props":{"class":"ct-5a6fca"},"children":[{"type":"text","value":"$(("}]},{"type":"element","tag":"span","props":{"class":"ct-1904d6"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-9f136f"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-e51a4c"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5a6fca"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" [[ "}]},{"type":"element","tag":"span","props":{"class":"ct-1904d6"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-9f136f"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-1904d6"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":"-ge"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1904d6"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-9f136f"},"children":[{"type":"text","value":"timeout"}]},{"type":"element","tag":"span","props":{"class":"ct-1904d6"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" ]]"}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":";"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":"then"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-48c63c"},"children":[{"type":"text","value":"echo"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5a6fca"},"children":[{"type":"text","value":"\"[Error] can't properly ping Redis container after "}]},{"type":"element","tag":"span","props":{"class":"ct-1904d6"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-9f136f"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-1904d6"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-5a6fca"},"children":[{"type":"text","value":" secs\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-48c63c"},"children":[{"type":"text","value":"exit"}]},{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" 1"}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":"fi"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-363153"},"children":[{"type":"text","value":"done"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-717443"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3d82fe"},"children":[{"type":"text","value":"# usage: wait_for_redis miin-redis-dev password"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Wait%20for%20mysql"},"children":[{"type":"text","value":"Wait for mysql"}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-e51a4c{color:#79C0FF}.ct-9f136f{color:#C9D1D9}.ct-1904d6{color:#C9D1D9}.ct-5a6fca{color:#A5D6FF}.ct-48c63c{color:#79C0FF}.ct-363153{color:#FF7B72}.ct-717443{color:#C9D1D9}.ct-a45584{color:#D2A8FF}.ct-3d82fe{color:#8B949E}.light .ct-3d82fe{color:#93A1A1}.light .ct-a45584{color:#268BD2}.light .ct-717443{color:#657B83}.light .ct-363153{color:#859900}.light .ct-48c63c{color:#268BD2}.light .ct-5a6fca{color:#2AA198}.light .ct-1904d6{color:#859900}.light .ct-9f136f{color:#268BD2}.light .ct-e51a4c{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Docker:Wait for redis.md","_source":"content","_file":"Docker/Wait for redis.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/8cFyiEqgoq.json b/docs/api/_content/query/8cFyiEqgoq.json index d4df2a6..df2335f 100644 --- a/docs/api/_content/query/8cFyiEqgoq.json +++ b/docs/api/_content/query/8cFyiEqgoq.json @@ -1 +1 @@ -{"_path":"/blockchain/common-typescript-examples","_dir":"blockchain","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Common Typescript Examples","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Simple #dapp example for tests: "},{"type":"element","tag":"a","props":{"href":"https://metamask.github.io/test-dapp/","rel":["nofollow"]},"children":[{"type":"text","value":"https://metamask.github.io/test-dapp/"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Interaction with smart contracts described in "},{"type":"element","tag":"a","props":{"href":"Smart%20contracts"},"children":[{"type":"text","value":"Smart contracts"}]}]}]},{"type":"element","tag":"h2","props":{"id":"connecting-to-node"},"children":[{"type":"text","value":"Connecting to node"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If #Metamask extension installed, "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Web3.givenProvider"}]},{"type":"text","value":" is available in global window. You can use "},{"type":"element","tag":"a","props":{"href":"https://infura.io","rel":["nofollow"]},"children":[{"type":"text","value":"Infura"}]},{"type":"text","value":" or your node instead:"}]},{"type":"element","tag":"code","props":{"code":"import Web3 from 'web3';\n\n// URL of your node\nconst PROVIDER_URL = 'https://...';\n\nexport const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import Web3 from 'web3';\n\n// URL of your node\nconst PROVIDER_URL = 'https://...';\n\nexport const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"getting-wallet-balance"},"children":[{"type":"text","value":"Getting wallet balance"}]},{"type":"element","tag":"code","props":{"code":"const getBalance = async (address: string) => {\n return await web3.eth.getBalance(address);\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const getBalance = async (address: string) => {\n return await web3.eth.getBalance(address);\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"getting-wallet-address"},"children":[{"type":"text","value":"Getting wallet address"}]},{"type":"element","tag":"code","props":{"code":"// first we need to authorize\nconst authorize = async () => {\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n}\n\n// then we can get wallet address\nconst getCurrentAddressUser = () => {\n return web3.currentProvider.selectedAddress;\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// first we need to authorize\nconst authorize = async () => {\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n}\n\n// then we can get wallet address\nconst getCurrentAddressUser = () => {\n return web3.currentProvider.selectedAddress;\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"sending-transaction"},"children":[{"type":"text","value":"Sending transaction"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sending "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"value"}]},{"type":"text","value":" tokens with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"memo"}]},{"type":"text","value":" as value:"}]},{"type":"element","tag":"code","props":{"code":"\nconst transfer = async ({ \n from, \n to, \n value, \n memo, \n privateKey, \n gasLimit = 44000 \n}) => {\n const nonce = await web3.eth.getTransactionCount(from);\n const gasPrice = await web3.eth.getGasPrice();\n \n const rawTx = {\n from,\n to,\n value: web3.utils.toHex(Web3.utils.toWei(value, 'ether')),\n gasLimit: web3.utils.toHex(gasLimit),\n gasPrice: web3.utils.toHex(gasPrice),\n nonce: web3.utils.toHex(nonce),\n data: memo,\n };\n \n const privateKeyBuffer = EthUtil.toBuffer(privateKey);\n \n const tx = new Transaction(rawTx);\n \n tx.sign(privateKeyBuffer);\n const serializedTx = tx.serialize();\n \n return this.web3.eth.sendSignedTransaction(\n `0x${serializedTx.toString('hex')}`\n );\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"\nconst transfer = async ({ \n from, \n to, \n value, \n memo, \n privateKey, \n gasLimit = 44000 \n}) => {\n const nonce = await web3.eth.getTransactionCount(from);\n const gasPrice = await web3.eth.getGasPrice();\n \n const rawTx = {\n from,\n to,\n value: web3.utils.toHex(Web3.utils.toWei(value, 'ether')),\n gasLimit: web3.utils.toHex(gasLimit),\n gasPrice: web3.utils.toHex(gasPrice),\n nonce: web3.utils.toHex(nonce),\n data: memo,\n };\n \n const privateKeyBuffer = EthUtil.toBuffer(privateKey);\n \n const tx = new Transaction(rawTx);\n \n tx.sign(privateKeyBuffer);\n const serializedTx = tx.serialize();\n \n return this.web3.eth.sendSignedTransaction(\n `0x${serializedTx.toString('hex')}`\n );\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"estimating-transaction-fee"},"children":[{"type":"text","value":"Estimating transaction FEE"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful to get fixed amount of tokens from user with pre-estimated fee."}]},{"type":"element","tag":"code","props":{"code":"import { web3 } from '.';\n\nconst estimateFee = async ({\n from,\n to,\n value,\n memo,\n}) => {\n const gasPrice = await web3.eth.getGasPrice();\n const gasLimit = await web3.eth.estimateGas({\n from,\n to,\n value: web3.utils.toHex(web3.utils.toWei(value, 'ether')),\n data: web3.utils.asciiToHex(memo),\n }).call();\n \n return web3.utils.fromWei(\n BigInt(gasPrice.toString())\n .multiply(BigInt(gasLimit.toString()))\n .toString()\n );\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { web3 } from '.';\n\nconst estimateFee = async ({\n from,\n to,\n value,\n memo,\n}) => {\n const gasPrice = await web3.eth.getGasPrice();\n const gasLimit = await web3.eth.estimateGas({\n from,\n to,\n value: web3.utils.toHex(web3.utils.toWei(value, 'ether')),\n data: web3.utils.asciiToHex(memo),\n }).call();\n \n return web3.utils.fromWei(\n BigInt(gasPrice.toString())\n .multiply(BigInt(gasLimit.toString()))\n .toString()\n );\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"subscribing-to-wallet-address-change"},"children":[{"type":"text","value":"Subscribing to wallet address change"}]},{"type":"element","tag":"code","props":{"code":"import { web3 } from '.';\n\nweb3.currentProvider.on('accountsChanged', callback);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { web3 } from '.';\n\nweb3.currentProvider.on('accountsChanged', callback);\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"watching-network-change"},"children":[{"type":"text","value":"Watching network change"}]},{"type":"element","tag":"code","props":{"code":"ethereum.on('chainChanged', handler: (chainId: string) => void);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"ethereum.on('chainChanged', handler: (chainId: string) => void);\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"adding-custom-token-to-wallet"},"children":[{"type":"text","value":"Adding custom token to wallet"}]},{"type":"element","tag":"code","props":{"code":"window.ethereum\n .request({\n method: 'wallet_watchAsset',\n params: {\n type: 'ERC20',\n options: {\n address: '0xb60e8dd61c5d32be8058bb8eb970870f07233155',\n symbol: 'FOO',\n decimals: 18,\n image: 'https://foo.io/token-image.svg',\n },\n },\n })\n .then((success) => {\n if (success) {\n console.log('FOO successfully added to wallet!')\n } else {\n throw new Error('Something went wrong.')\n }\n })\n .catch(console.error)\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"window.ethereum\n .request({\n method: 'wallet_watchAsset',\n params: {\n type: 'ERC20',\n options: {\n address: '0xb60e8dd61c5d32be8058bb8eb970870f07233155',\n symbol: 'FOO',\n decimals: 18,\n image: 'https://foo.io/token-image.svg',\n },\n },\n })\n .then((success) => {\n if (success) {\n console.log('FOO successfully added to wallet!')\n } else {\n throw new Error('Something went wrong.')\n }\n })\n .catch(console.error)\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"changing-network-to-custom"},"children":[{"type":"text","value":"Changing network to custom"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Checking current chainId:"}]},{"type":"element","tag":"code","props":{"code":"const getChainID = async () => {\n return ethereum.request({ method: 'eth_chainId' })\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const getChainID = async () => {\n return ethereum.request({ method: 'eth_chainId' })\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Asking wallet to change current network:"}]},{"type":"element","tag":"code","props":{"code":"try {\n await window.ethereum.request({\n method: 'wallet_switchEthereumChain',\n params: [{ chainId: '0x03' }], // ropsten chainID (3) in hex\n });\n} catch (switchError) {\n // This error code indicates that the chain has not been added to MetaMask.\n if (error.code === 4902) {\n try {\n await window.ethereum.request({\n method: 'wallet_addEthereumChain',\n params: [{ \n chainId: '0x03', // ropsten chainID (3) in hex\n chainName: 'Ropsten Test Network', \n nativeCurrency: { \n name: 'ETH',\n symbol: 'ETH',\n decimals: 18\n }, \n rpcUrls: ['https://ropsten.infura.io/v3/9aa3d95b3bc440fa88ea12eaa4456161'], \n blockExplorerUrls: ['https://ropsten.etherscan.io'] \n }] ,\n });\n } catch (addError) {\n // handle \"add\" error\n }\n }\n // handle other \"switch\" errors\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"try {\n await window.ethereum.request({\n method: 'wallet_switchEthereumChain',\n params: [{ chainId: '0x03' }], // ropsten chainID (3) in hex\n });\n} catch (switchError) {\n // This error code indicates that the chain has not been added to MetaMask.\n if (error.code === 4902) {\n try {\n await window.ethereum.request({\n method: 'wallet_addEthereumChain',\n params: [{ \n chainId: '0x03', // ropsten chainID (3) in hex\n chainName: 'Ropsten Test Network', \n nativeCurrency: { \n name: 'ETH',\n symbol: 'ETH',\n decimals: 18\n }, \n rpcUrls: ['https://ropsten.infura.io/v3/9aa3d95b3bc440fa88ea12eaa4456161'], \n blockExplorerUrls: ['https://ropsten.etherscan.io'] \n }] ,\n });\n } catch (addError) {\n // handle \"add\" error\n }\n }\n // handle other \"switch\" errors\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Simple #dapp example for tests: "},{"type":"element","tag":"a","props":{"href":"https://metamask.github.io/test-dapp/","rel":["nofollow"]},"children":[{"type":"text","value":"https://metamask.github.io/test-dapp/"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Interaction with smart contracts described in "},{"type":"element","tag":"a","props":{"href":"Smart%20contracts"},"children":[{"type":"text","value":"Smart contracts"}]}]}]},{"type":"element","tag":"h2","props":{"id":"connecting-to-node"},"children":[{"type":"text","value":"Connecting to node"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If #Metamask extension installed, "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Web3.givenProvider"}]},{"type":"text","value":" is available in global window. You can use "},{"type":"element","tag":"a","props":{"href":"https://infura.io","rel":["nofollow"]},"children":[{"type":"text","value":"Infura"}]},{"type":"text","value":" or your node instead:"}]},{"type":"element","tag":"code","props":{"code":"import Web3 from 'web3';\n\n// URL of your node\nconst PROVIDER_URL = 'https://...';\n\nexport const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'web3'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-75e8dd"},"children":[{"type":"text","value":"// URL of your node"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"PROVIDER_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'https://...'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"givenProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"PROVIDER_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"getting-wallet-balance"},"children":[{"type":"text","value":"Getting wallet balance"}]},{"type":"element","tag":"code","props":{"code":"const getBalance = async (address: string) => {\n return await web3.eth.getBalance(address);\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a4ec55"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-2f2ea3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-adb89a"},"children":[{"type":"text","value":"getBalance"}]},{"type":"element","tag":"span","props":{"class":"ct-2f2ea3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a0c55"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-2f2ea3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a4ec55"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-2f2ea3"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-53baf5"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-6a0c55"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-2f2ea3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5949b"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-2f2ea3"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-a4ec55"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-2f2ea3"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"getBalance"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"getting-wallet-address"},"children":[{"type":"text","value":"Getting wallet address"}]},{"type":"element","tag":"code","props":{"code":"// first we need to authorize\nconst authorize = async () => {\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n}\n\n// then we can get wallet address\nconst getCurrentAddressUser = () => {\n return web3.currentProvider.selectedAddress;\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-75e8dd"},"children":[{"type":"text","value":"// first we need to authorize"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"({ method: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'eth_requestAccounts'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-75e8dd"},"children":[{"type":"text","value":"// then we can get wallet address"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"getCurrentAddressUser"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"selectedAddress"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"sending-transaction"},"children":[{"type":"text","value":"Sending transaction"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sending "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"value"}]},{"type":"text","value":" tokens with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"memo"}]},{"type":"text","value":" as value:"}]},{"type":"element","tag":"code","props":{"code":"\nconst transfer = async ({ \n from, \n to, \n value, \n memo, \n privateKey, \n gasLimit = 44000 \n}) => {\n const nonce = await web3.eth.getTransactionCount(from);\n const gasPrice = await web3.eth.getGasPrice();\n \n const rawTx = {\n from,\n to,\n value: web3.utils.toHex(Web3.utils.toWei(value, 'ether')),\n gasLimit: web3.utils.toHex(gasLimit),\n gasPrice: web3.utils.toHex(gasPrice),\n nonce: web3.utils.toHex(nonce),\n data: memo,\n };\n \n const privateKeyBuffer = EthUtil.toBuffer(privateKey);\n \n const tx = new Transaction(rawTx);\n \n tx.sign(privateKeyBuffer);\n const serializedTx = tx.serialize();\n \n return this.web3.eth.sendSignedTransaction(\n `0x${serializedTx.toString('hex')}`\n );\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"transfer"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" ({ "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"}) "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"nonce"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"getTransactionCount"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"getGasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"rawTx"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" value: "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toWei"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'ether'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":")),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" gasLimit: "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" gasPrice: "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" nonce: "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"nonce"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" data: "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"privateKeyBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"EthUtil"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"tx"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"Transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"rawTx"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"tx"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"sign"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"privateKeyBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"serializedTx"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"tx"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"serialize"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"this"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"sendSignedTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"`0x${"}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"serializedTx"}]},{"type":"element","tag":"span","props":{"class":"ct-4ab335"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-4ab335"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'hex'"}]},{"type":"element","tag":"span","props":{"class":"ct-4ab335"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"}`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"estimating-transaction-fee"},"children":[{"type":"text","value":"Estimating transaction FEE"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful to get fixed amount of tokens from user with pre-estimated fee."}]},{"type":"element","tag":"code","props":{"code":"import { web3 } from '.';\n\nconst estimateFee = async ({\n from,\n to,\n value,\n memo,\n}) => {\n const gasPrice = await web3.eth.getGasPrice();\n const gasLimit = await web3.eth.estimateGas({\n from,\n to,\n value: web3.utils.toHex(web3.utils.toWei(value, 'ether')),\n data: web3.utils.asciiToHex(memo),\n }).call();\n \n return web3.utils.fromWei(\n BigInt(gasPrice.toString())\n .multiply(BigInt(gasLimit.toString()))\n .toString()\n );\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"estimateFee"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" ({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"}) "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"getGasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-654ee1"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"estimateGas"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" value: "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toWei"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'ether'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":")),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" data: "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"asciiToHex"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" })."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"call"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"fromWei"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f08b88"},"children":[{"type":"text","value":"BigInt"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"())"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"multiply"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f08b88"},"children":[{"type":"text","value":"BigInt"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"()))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"()"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"subscribing-to-wallet-address-change"},"children":[{"type":"text","value":"Subscribing to wallet address change"}]},{"type":"element","tag":"code","props":{"code":"import { web3 } from '.';\n\nweb3.currentProvider.on('accountsChanged', callback);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'accountsChanged'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"callback"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"watching-network-change"},"children":[{"type":"text","value":"Watching network change"}]},{"type":"element","tag":"code","props":{"code":"ethereum.on('chainChanged', handler: (chainId: string) => void);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'chainChanged'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"handler"}]},{"type":"element","tag":"span","props":{"class":"ct-78e6f9"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"adding-custom-token-to-wallet"},"children":[{"type":"text","value":"Adding custom token to wallet"}]},{"type":"element","tag":"code","props":{"code":"window.ethereum\n .request({\n method: 'wallet_watchAsset',\n params: {\n type: 'ERC20',\n options: {\n address: '0xb60e8dd61c5d32be8058bb8eb970870f07233155',\n symbol: 'FOO',\n decimals: 18,\n image: 'https://foo.io/token-image.svg',\n },\n },\n })\n .then((success) => {\n if (success) {\n console.log('FOO successfully added to wallet!')\n } else {\n throw new Error('Something went wrong.')\n }\n })\n .catch(console.error)\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"window"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"ethereum"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" method: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'wallet_watchAsset'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" params: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" type: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'ERC20'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" options: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" address: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'0xb60e8dd61c5d32be8058bb8eb970870f07233155'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" symbol: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'FOO'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" decimals: "}]},{"type":"element","tag":"span","props":{"class":"ct-9f9086"},"children":[{"type":"text","value":"18"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" image: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'https://foo.io/token-image.svg'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2f2ea3"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-adb89a"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-2f2ea3"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-53baf5"},"children":[{"type":"text","value":"success"}]},{"type":"element","tag":"span","props":{"class":"ct-2f2ea3"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-a4ec55"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-2f2ea3"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"success"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'FOO successfully added to wallet!'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"else"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f08b88"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'Something went wrong.'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":")"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"changing-network-to-custom"},"children":[{"type":"text","value":"Changing network to custom"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Checking current chainId:"}]},{"type":"element","tag":"code","props":{"code":"const getChainID = async () => {\n return ethereum.request({ method: 'eth_chainId' })\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"getChainID"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-ac442e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"({ method: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'eth_chainId'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Asking wallet to change current network:"}]},{"type":"element","tag":"code","props":{"code":"try {\n await window.ethereum.request({\n method: 'wallet_switchEthereumChain',\n params: [{ chainId: '0x03' }], // ropsten chainID (3) in hex\n });\n} catch (switchError) {\n // This error code indicates that the chain has not been added to MetaMask.\n if (error.code === 4902) {\n try {\n await window.ethereum.request({\n method: 'wallet_addEthereumChain',\n params: [{ \n chainId: '0x03', // ropsten chainID (3) in hex\n chainName: 'Ropsten Test Network', \n nativeCurrency: { \n name: 'ETH',\n symbol: 'ETH',\n decimals: 18\n }, \n rpcUrls: ['https://ropsten.infura.io/v3/9aa3d95b3bc440fa88ea12eaa4456161'], \n blockExplorerUrls: ['https://ropsten.etherscan.io'] \n }] ,\n });\n } catch (addError) {\n // handle \"add\" error\n }\n }\n // handle other \"switch\" errors\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"window"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" method: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'wallet_switchEthereumChain'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" params: [{ chainId: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'0x03'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" }], "}]},{"type":"element","tag":"span","props":{"class":"ct-75e8dd"},"children":[{"type":"text","value":"// ropsten chainID (3) in hex"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"} "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"switchError"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-75e8dd"},"children":[{"type":"text","value":"// This error code indicates that the chain has not been added to MetaMask."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"code"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9f9086"},"children":[{"type":"text","value":"4902"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"window"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-29697d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" method: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'wallet_addEthereumChain'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" params: [{ "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" chainId: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'0x03'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-75e8dd"},"children":[{"type":"text","value":"// ropsten chainID (3) in hex"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" chainName: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'Ropsten Test Network'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" nativeCurrency: { "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" name: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'ETH'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" symbol: "}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'ETH'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" decimals: "}]},{"type":"element","tag":"span","props":{"class":"ct-9f9086"},"children":[{"type":"text","value":"18"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" }, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" rpcUrls: ["}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'https://ropsten.infura.io/v3/9aa3d95b3bc440fa88ea12eaa4456161'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"], "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" blockExplorerUrls: ["}]},{"type":"element","tag":"span","props":{"class":"ct-aaf828"},"children":[{"type":"text","value":"'https://ropsten.etherscan.io'"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"] "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" }] ,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-eafdf1"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-7bd146"},"children":[{"type":"text","value":"addError"}]},{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-75e8dd"},"children":[{"type":"text","value":"// handle \"add\" error"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-75e8dd"},"children":[{"type":"text","value":"// handle other \"switch\" errors"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c2c078"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-9f9086{color:#79C0FF}.ct-78e6f9{color:#C9D1D9}.ct-f08b88{color:#79C0FF}.ct-4ab335{color:#A5D6FF}.ct-c5949b{color:#79C0FF}.ct-53baf5{color:#FFA657}.ct-6a0c55{color:#FF7B72}.ct-adb89a{color:#D2A8FF}.ct-2f2ea3{color:#C9D1D9}.ct-a4ec55{color:#FF7B72}.ct-29697d{color:#D2A8FF}.ct-654ee1{color:#79C0FF}.ct-ac442e{color:#FF7B72}.ct-75e8dd{color:#8B949E}.ct-aaf828{color:#A5D6FF}.ct-7bd146{color:#C9D1D9}.ct-c2c078{color:#C9D1D9}.ct-eafdf1{color:#FF7B72}.light .ct-eafdf1{color:#859900}.light .ct-c2c078{color:#657B83}.light .ct-7bd146{color:#268BD2}.light .ct-aaf828{color:#2AA198}.light .ct-75e8dd{color:#93A1A1}.light .ct-ac442e{color:#073642}.light .ct-654ee1{color:#268BD2}.light .ct-29697d{color:#268BD2}.light .ct-a4ec55{color:#073642}.light .ct-2f2ea3{color:#657B83}.light .ct-adb89a{color:#268BD2}.light .ct-6a0c55{color:#859900}.light .ct-53baf5{color:#657B83}.light .ct-c5949b{color:#859900}.light .ct-4ab335{color:#657B83}.light .ct-f08b88{color:#859900}.light .ct-78e6f9{color:#859900}.light .ct-9f9086{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"connecting-to-node","depth":2,"text":"Connecting to node"},{"id":"getting-wallet-balance","depth":2,"text":"Getting wallet balance"},{"id":"getting-wallet-address","depth":2,"text":"Getting wallet address"},{"id":"sending-transaction","depth":2,"text":"Sending transaction"},{"id":"estimating-transaction-fee","depth":2,"text":"Estimating transaction FEE"},{"id":"subscribing-to-wallet-address-change","depth":2,"text":"Subscribing to wallet address change"},{"id":"watching-network-change","depth":2,"text":"Watching network change"},{"id":"adding-custom-token-to-wallet","depth":2,"text":"Adding custom token to wallet"},{"id":"changing-network-to-custom","depth":2,"text":"Changing network to custom"}]}},"_type":"markdown","_id":"content:Blockchain:Common typescript examples.md","_source":"content","_file":"Blockchain/Common typescript examples.md","_extension":"md"} \ No newline at end of file +{"_path":"/blockchain/common-typescript-examples","_dir":"blockchain","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Common Typescript Examples","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Simple #dapp example for tests: "},{"type":"element","tag":"a","props":{"href":"https://metamask.github.io/test-dapp/","rel":["nofollow"]},"children":[{"type":"text","value":"https://metamask.github.io/test-dapp/"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Interaction with smart contracts described in "},{"type":"element","tag":"a","props":{"href":"Smart%20contracts"},"children":[{"type":"text","value":"Smart contracts"}]}]}]},{"type":"element","tag":"h2","props":{"id":"connecting-to-node"},"children":[{"type":"text","value":"Connecting to node"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If #Metamask extension installed, "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Web3.givenProvider"}]},{"type":"text","value":" is available in global window. You can use "},{"type":"element","tag":"a","props":{"href":"https://infura.io","rel":["nofollow"]},"children":[{"type":"text","value":"Infura"}]},{"type":"text","value":" or your node instead:"}]},{"type":"element","tag":"code","props":{"code":"import Web3 from 'web3';\n\n// URL of your node\nconst PROVIDER_URL = 'https://...';\n\nexport const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import Web3 from 'web3';\n\n// URL of your node\nconst PROVIDER_URL = 'https://...';\n\nexport const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"getting-wallet-balance"},"children":[{"type":"text","value":"Getting wallet balance"}]},{"type":"element","tag":"code","props":{"code":"const getBalance = async (address: string) => {\n return await web3.eth.getBalance(address);\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const getBalance = async (address: string) => {\n return await web3.eth.getBalance(address);\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"getting-wallet-address"},"children":[{"type":"text","value":"Getting wallet address"}]},{"type":"element","tag":"code","props":{"code":"// first we need to authorize\nconst authorize = async () => {\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n}\n\n// then we can get wallet address\nconst getCurrentAddressUser = () => {\n return web3.currentProvider.selectedAddress;\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// first we need to authorize\nconst authorize = async () => {\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n}\n\n// then we can get wallet address\nconst getCurrentAddressUser = () => {\n return web3.currentProvider.selectedAddress;\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"sending-transaction"},"children":[{"type":"text","value":"Sending transaction"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sending "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"value"}]},{"type":"text","value":" tokens with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"memo"}]},{"type":"text","value":" as value:"}]},{"type":"element","tag":"code","props":{"code":"\nconst transfer = async ({ \n from, \n to, \n value, \n memo, \n privateKey, \n gasLimit = 44000 \n}) => {\n const nonce = await web3.eth.getTransactionCount(from);\n const gasPrice = await web3.eth.getGasPrice();\n \n const rawTx = {\n from,\n to,\n value: web3.utils.toHex(Web3.utils.toWei(value, 'ether')),\n gasLimit: web3.utils.toHex(gasLimit),\n gasPrice: web3.utils.toHex(gasPrice),\n nonce: web3.utils.toHex(nonce),\n data: memo,\n };\n \n const privateKeyBuffer = EthUtil.toBuffer(privateKey);\n \n const tx = new Transaction(rawTx);\n \n tx.sign(privateKeyBuffer);\n const serializedTx = tx.serialize();\n \n return this.web3.eth.sendSignedTransaction(\n `0x${serializedTx.toString('hex')}`\n );\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"\nconst transfer = async ({ \n from, \n to, \n value, \n memo, \n privateKey, \n gasLimit = 44000 \n}) => {\n const nonce = await web3.eth.getTransactionCount(from);\n const gasPrice = await web3.eth.getGasPrice();\n \n const rawTx = {\n from,\n to,\n value: web3.utils.toHex(Web3.utils.toWei(value, 'ether')),\n gasLimit: web3.utils.toHex(gasLimit),\n gasPrice: web3.utils.toHex(gasPrice),\n nonce: web3.utils.toHex(nonce),\n data: memo,\n };\n \n const privateKeyBuffer = EthUtil.toBuffer(privateKey);\n \n const tx = new Transaction(rawTx);\n \n tx.sign(privateKeyBuffer);\n const serializedTx = tx.serialize();\n \n return this.web3.eth.sendSignedTransaction(\n `0x${serializedTx.toString('hex')}`\n );\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"estimating-transaction-fee"},"children":[{"type":"text","value":"Estimating transaction FEE"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful to get fixed amount of tokens from user with pre-estimated fee."}]},{"type":"element","tag":"code","props":{"code":"import { web3 } from '.';\n\nconst estimateFee = async ({\n from,\n to,\n value,\n memo,\n}) => {\n const gasPrice = await web3.eth.getGasPrice();\n const gasLimit = await web3.eth.estimateGas({\n from,\n to,\n value: web3.utils.toHex(web3.utils.toWei(value, 'ether')),\n data: web3.utils.asciiToHex(memo),\n }).call();\n \n return web3.utils.fromWei(\n BigInt(gasPrice.toString())\n .multiply(BigInt(gasLimit.toString()))\n .toString()\n );\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { web3 } from '.';\n\nconst estimateFee = async ({\n from,\n to,\n value,\n memo,\n}) => {\n const gasPrice = await web3.eth.getGasPrice();\n const gasLimit = await web3.eth.estimateGas({\n from,\n to,\n value: web3.utils.toHex(web3.utils.toWei(value, 'ether')),\n data: web3.utils.asciiToHex(memo),\n }).call();\n \n return web3.utils.fromWei(\n BigInt(gasPrice.toString())\n .multiply(BigInt(gasLimit.toString()))\n .toString()\n );\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"subscribing-to-wallet-address-change"},"children":[{"type":"text","value":"Subscribing to wallet address change"}]},{"type":"element","tag":"code","props":{"code":"import { web3 } from '.';\n\nweb3.currentProvider.on('accountsChanged', callback);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { web3 } from '.';\n\nweb3.currentProvider.on('accountsChanged', callback);\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"watching-network-change"},"children":[{"type":"text","value":"Watching network change"}]},{"type":"element","tag":"code","props":{"code":"ethereum.on('chainChanged', handler: (chainId: string) => void);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"ethereum.on('chainChanged', handler: (chainId: string) => void);\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"adding-custom-token-to-wallet"},"children":[{"type":"text","value":"Adding custom token to wallet"}]},{"type":"element","tag":"code","props":{"code":"window.ethereum\n .request({\n method: 'wallet_watchAsset',\n params: {\n type: 'ERC20',\n options: {\n address: '0xb60e8dd61c5d32be8058bb8eb970870f07233155',\n symbol: 'FOO',\n decimals: 18,\n image: 'https://foo.io/token-image.svg',\n },\n },\n })\n .then((success) => {\n if (success) {\n console.log('FOO successfully added to wallet!')\n } else {\n throw new Error('Something went wrong.')\n }\n })\n .catch(console.error)\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"window.ethereum\n .request({\n method: 'wallet_watchAsset',\n params: {\n type: 'ERC20',\n options: {\n address: '0xb60e8dd61c5d32be8058bb8eb970870f07233155',\n symbol: 'FOO',\n decimals: 18,\n image: 'https://foo.io/token-image.svg',\n },\n },\n })\n .then((success) => {\n if (success) {\n console.log('FOO successfully added to wallet!')\n } else {\n throw new Error('Something went wrong.')\n }\n })\n .catch(console.error)\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"changing-network-to-custom"},"children":[{"type":"text","value":"Changing network to custom"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Checking current chainId:"}]},{"type":"element","tag":"code","props":{"code":"const getChainID = async () => {\n return ethereum.request({ method: 'eth_chainId' })\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const getChainID = async () => {\n return ethereum.request({ method: 'eth_chainId' })\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Asking wallet to change current network:"}]},{"type":"element","tag":"code","props":{"code":"try {\n await window.ethereum.request({\n method: 'wallet_switchEthereumChain',\n params: [{ chainId: '0x03' }], // ropsten chainID (3) in hex\n });\n} catch (switchError) {\n // This error code indicates that the chain has not been added to MetaMask.\n if (error.code === 4902) {\n try {\n await window.ethereum.request({\n method: 'wallet_addEthereumChain',\n params: [{ \n chainId: '0x03', // ropsten chainID (3) in hex\n chainName: 'Ropsten Test Network', \n nativeCurrency: { \n name: 'ETH',\n symbol: 'ETH',\n decimals: 18\n }, \n rpcUrls: ['https://ropsten.infura.io/v3/9aa3d95b3bc440fa88ea12eaa4456161'], \n blockExplorerUrls: ['https://ropsten.etherscan.io'] \n }] ,\n });\n } catch (addError) {\n // handle \"add\" error\n }\n }\n // handle other \"switch\" errors\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"try {\n await window.ethereum.request({\n method: 'wallet_switchEthereumChain',\n params: [{ chainId: '0x03' }], // ropsten chainID (3) in hex\n });\n} catch (switchError) {\n // This error code indicates that the chain has not been added to MetaMask.\n if (error.code === 4902) {\n try {\n await window.ethereum.request({\n method: 'wallet_addEthereumChain',\n params: [{ \n chainId: '0x03', // ropsten chainID (3) in hex\n chainName: 'Ropsten Test Network', \n nativeCurrency: { \n name: 'ETH',\n symbol: 'ETH',\n decimals: 18\n }, \n rpcUrls: ['https://ropsten.infura.io/v3/9aa3d95b3bc440fa88ea12eaa4456161'], \n blockExplorerUrls: ['https://ropsten.etherscan.io'] \n }] ,\n });\n } catch (addError) {\n // handle \"add\" error\n }\n }\n // handle other \"switch\" errors\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Simple #dapp example for tests: "},{"type":"element","tag":"a","props":{"href":"https://metamask.github.io/test-dapp/","rel":["nofollow"]},"children":[{"type":"text","value":"https://metamask.github.io/test-dapp/"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Interaction with smart contracts described in "},{"type":"element","tag":"a","props":{"href":"Smart%20contracts"},"children":[{"type":"text","value":"Smart contracts"}]}]}]},{"type":"element","tag":"h2","props":{"id":"connecting-to-node"},"children":[{"type":"text","value":"Connecting to node"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If #Metamask extension installed, "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Web3.givenProvider"}]},{"type":"text","value":" is available in global window. You can use "},{"type":"element","tag":"a","props":{"href":"https://infura.io","rel":["nofollow"]},"children":[{"type":"text","value":"Infura"}]},{"type":"text","value":" or your node instead:"}]},{"type":"element","tag":"code","props":{"code":"import Web3 from 'web3';\n\n// URL of your node\nconst PROVIDER_URL = 'https://...';\n\nexport const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'web3'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-06c9fd"},"children":[{"type":"text","value":"// URL of your node"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"PROVIDER_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'https://...'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"givenProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"PROVIDER_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"getting-wallet-balance"},"children":[{"type":"text","value":"Getting wallet balance"}]},{"type":"element","tag":"code","props":{"code":"const getBalance = async (address: string) => {\n return await web3.eth.getBalance(address);\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-343e52"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-044655"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-beff07"},"children":[{"type":"text","value":"getBalance"}]},{"type":"element","tag":"span","props":{"class":"ct-044655"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fbdb54"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-044655"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-343e52"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-044655"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-0feb94"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-fbdb54"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-044655"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5aec75"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-044655"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-343e52"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-044655"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"getBalance"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"getting-wallet-address"},"children":[{"type":"text","value":"Getting wallet address"}]},{"type":"element","tag":"code","props":{"code":"// first we need to authorize\nconst authorize = async () => {\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n}\n\n// then we can get wallet address\nconst getCurrentAddressUser = () => {\n return web3.currentProvider.selectedAddress;\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-06c9fd"},"children":[{"type":"text","value":"// first we need to authorize"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"({ method: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'eth_requestAccounts'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-06c9fd"},"children":[{"type":"text","value":"// then we can get wallet address"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"getCurrentAddressUser"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"selectedAddress"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"sending-transaction"},"children":[{"type":"text","value":"Sending transaction"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sending "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"value"}]},{"type":"text","value":" tokens with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"memo"}]},{"type":"text","value":" as value:"}]},{"type":"element","tag":"code","props":{"code":"\nconst transfer = async ({ \n from, \n to, \n value, \n memo, \n privateKey, \n gasLimit = 44000 \n}) => {\n const nonce = await web3.eth.getTransactionCount(from);\n const gasPrice = await web3.eth.getGasPrice();\n \n const rawTx = {\n from,\n to,\n value: web3.utils.toHex(Web3.utils.toWei(value, 'ether')),\n gasLimit: web3.utils.toHex(gasLimit),\n gasPrice: web3.utils.toHex(gasPrice),\n nonce: web3.utils.toHex(nonce),\n data: memo,\n };\n \n const privateKeyBuffer = EthUtil.toBuffer(privateKey);\n \n const tx = new Transaction(rawTx);\n \n tx.sign(privateKeyBuffer);\n const serializedTx = tx.serialize();\n \n return this.web3.eth.sendSignedTransaction(\n `0x${serializedTx.toString('hex')}`\n );\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"transfer"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" ({ "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"}) "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"nonce"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"getTransactionCount"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"getGasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"rawTx"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" value: "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toWei"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'ether'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":")),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" gasLimit: "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" gasPrice: "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" nonce: "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"nonce"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" data: "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"privateKeyBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"EthUtil"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"tx"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"Transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"rawTx"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"tx"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"sign"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"privateKeyBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"serializedTx"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"tx"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"serialize"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"this"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"sendSignedTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"`0x${"}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"serializedTx"}]},{"type":"element","tag":"span","props":{"class":"ct-7a93f8"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-7a93f8"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'hex'"}]},{"type":"element","tag":"span","props":{"class":"ct-7a93f8"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"}`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"estimating-transaction-fee"},"children":[{"type":"text","value":"Estimating transaction FEE"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful to get fixed amount of tokens from user with pre-estimated fee."}]},{"type":"element","tag":"code","props":{"code":"import { web3 } from '.';\n\nconst estimateFee = async ({\n from,\n to,\n value,\n memo,\n}) => {\n const gasPrice = await web3.eth.getGasPrice();\n const gasLimit = await web3.eth.estimateGas({\n from,\n to,\n value: web3.utils.toHex(web3.utils.toWei(value, 'ether')),\n data: web3.utils.asciiToHex(memo),\n }).call();\n \n return web3.utils.fromWei(\n BigInt(gasPrice.toString())\n .multiply(BigInt(gasLimit.toString()))\n .toString()\n );\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"estimateFee"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" ({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"}) "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"getGasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c29390"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"estimateGas"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"to"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" value: "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toHex"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toWei"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'ether'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":")),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" data: "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"asciiToHex"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"memo"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" })."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"call"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"utils"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"fromWei"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7549d7"},"children":[{"type":"text","value":"BigInt"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"gasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"())"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"multiply"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7549d7"},"children":[{"type":"text","value":"BigInt"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"gasLimit"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"()))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"toString"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"()"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"subscribing-to-wallet-address-change"},"children":[{"type":"text","value":"Subscribing to wallet address change"}]},{"type":"element","tag":"code","props":{"code":"import { web3 } from '.';\n\nweb3.currentProvider.on('accountsChanged', callback);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'accountsChanged'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"callback"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"watching-network-change"},"children":[{"type":"text","value":"Watching network change"}]},{"type":"element","tag":"code","props":{"code":"ethereum.on('chainChanged', handler: (chainId: string) => void);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'chainChanged'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"handler"}]},{"type":"element","tag":"span","props":{"class":"ct-ae222c"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"adding-custom-token-to-wallet"},"children":[{"type":"text","value":"Adding custom token to wallet"}]},{"type":"element","tag":"code","props":{"code":"window.ethereum\n .request({\n method: 'wallet_watchAsset',\n params: {\n type: 'ERC20',\n options: {\n address: '0xb60e8dd61c5d32be8058bb8eb970870f07233155',\n symbol: 'FOO',\n decimals: 18,\n image: 'https://foo.io/token-image.svg',\n },\n },\n })\n .then((success) => {\n if (success) {\n console.log('FOO successfully added to wallet!')\n } else {\n throw new Error('Something went wrong.')\n }\n })\n .catch(console.error)\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"window"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"ethereum"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" method: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'wallet_watchAsset'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" params: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" type: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'ERC20'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" options: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" address: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'0xb60e8dd61c5d32be8058bb8eb970870f07233155'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" symbol: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'FOO'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" decimals: "}]},{"type":"element","tag":"span","props":{"class":"ct-1b62bb"},"children":[{"type":"text","value":"18"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" image: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'https://foo.io/token-image.svg'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-044655"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-beff07"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-044655"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-0feb94"},"children":[{"type":"text","value":"success"}]},{"type":"element","tag":"span","props":{"class":"ct-044655"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-343e52"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-044655"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"success"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'FOO successfully added to wallet!'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"else"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7549d7"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'Something went wrong.'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":")"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"changing-network-to-custom"},"children":[{"type":"text","value":"Changing network to custom"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Checking current chainId:"}]},{"type":"element","tag":"code","props":{"code":"const getChainID = async () => {\n return ethereum.request({ method: 'eth_chainId' })\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"getChainID"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-b49b42"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"({ method: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'eth_chainId'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Asking wallet to change current network:"}]},{"type":"element","tag":"code","props":{"code":"try {\n await window.ethereum.request({\n method: 'wallet_switchEthereumChain',\n params: [{ chainId: '0x03' }], // ropsten chainID (3) in hex\n });\n} catch (switchError) {\n // This error code indicates that the chain has not been added to MetaMask.\n if (error.code === 4902) {\n try {\n await window.ethereum.request({\n method: 'wallet_addEthereumChain',\n params: [{ \n chainId: '0x03', // ropsten chainID (3) in hex\n chainName: 'Ropsten Test Network', \n nativeCurrency: { \n name: 'ETH',\n symbol: 'ETH',\n decimals: 18\n }, \n rpcUrls: ['https://ropsten.infura.io/v3/9aa3d95b3bc440fa88ea12eaa4456161'], \n blockExplorerUrls: ['https://ropsten.etherscan.io'] \n }] ,\n });\n } catch (addError) {\n // handle \"add\" error\n }\n }\n // handle other \"switch\" errors\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"window"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" method: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'wallet_switchEthereumChain'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" params: [{ chainId: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'0x03'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" }], "}]},{"type":"element","tag":"span","props":{"class":"ct-06c9fd"},"children":[{"type":"text","value":"// ropsten chainID (3) in hex"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"} "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"switchError"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06c9fd"},"children":[{"type":"text","value":"// This error code indicates that the chain has not been added to MetaMask."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"code"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1b62bb"},"children":[{"type":"text","value":"4902"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"window"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"ethereum"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-eb243d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" method: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'wallet_addEthereumChain'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" params: [{ "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" chainId: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'0x03'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-06c9fd"},"children":[{"type":"text","value":"// ropsten chainID (3) in hex"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" chainName: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'Ropsten Test Network'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" nativeCurrency: { "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" name: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'ETH'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" symbol: "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'ETH'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" decimals: "}]},{"type":"element","tag":"span","props":{"class":"ct-1b62bb"},"children":[{"type":"text","value":"18"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" }, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" rpcUrls: ["}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'https://ropsten.infura.io/v3/9aa3d95b3bc440fa88ea12eaa4456161'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"], "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" blockExplorerUrls: ["}]},{"type":"element","tag":"span","props":{"class":"ct-d5c300"},"children":[{"type":"text","value":"'https://ropsten.etherscan.io'"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"] "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" }] ,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-e0e232"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-5cf544"},"children":[{"type":"text","value":"addError"}]},{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06c9fd"},"children":[{"type":"text","value":"// handle \"add\" error"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06c9fd"},"children":[{"type":"text","value":"// handle other \"switch\" errors"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e988dc"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-1b62bb{color:#79C0FF}.ct-ae222c{color:#C9D1D9}.ct-7549d7{color:#79C0FF}.ct-7a93f8{color:#A5D6FF}.ct-5aec75{color:#79C0FF}.ct-0feb94{color:#FFA657}.ct-fbdb54{color:#FF7B72}.ct-beff07{color:#D2A8FF}.ct-044655{color:#C9D1D9}.ct-343e52{color:#FF7B72}.ct-eb243d{color:#D2A8FF}.ct-c29390{color:#79C0FF}.ct-b49b42{color:#FF7B72}.ct-06c9fd{color:#8B949E}.ct-d5c300{color:#A5D6FF}.ct-5cf544{color:#C9D1D9}.ct-e988dc{color:#C9D1D9}.ct-e0e232{color:#FF7B72}.light .ct-e0e232{color:#859900}.light .ct-e988dc{color:#657B83}.light .ct-5cf544{color:#268BD2}.light .ct-d5c300{color:#2AA198}.light .ct-06c9fd{color:#93A1A1}.light .ct-b49b42{color:#073642}.light .ct-c29390{color:#268BD2}.light .ct-eb243d{color:#268BD2}.light .ct-343e52{color:#073642}.light .ct-044655{color:#657B83}.light .ct-beff07{color:#268BD2}.light .ct-fbdb54{color:#859900}.light .ct-0feb94{color:#657B83}.light .ct-5aec75{color:#859900}.light .ct-7a93f8{color:#657B83}.light .ct-7549d7{color:#859900}.light .ct-ae222c{color:#859900}.light .ct-1b62bb{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"connecting-to-node","depth":2,"text":"Connecting to node"},{"id":"getting-wallet-balance","depth":2,"text":"Getting wallet balance"},{"id":"getting-wallet-address","depth":2,"text":"Getting wallet address"},{"id":"sending-transaction","depth":2,"text":"Sending transaction"},{"id":"estimating-transaction-fee","depth":2,"text":"Estimating transaction FEE"},{"id":"subscribing-to-wallet-address-change","depth":2,"text":"Subscribing to wallet address change"},{"id":"watching-network-change","depth":2,"text":"Watching network change"},{"id":"adding-custom-token-to-wallet","depth":2,"text":"Adding custom token to wallet"},{"id":"changing-network-to-custom","depth":2,"text":"Changing network to custom"}]}},"_type":"markdown","_id":"content:Blockchain:Common typescript examples.md","_source":"content","_file":"Blockchain/Common typescript examples.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/CMMQ5oxSPg.json b/docs/api/_content/query/CMMQ5oxSPg.json index 9269ebd..163b611 100644 --- a/docs/api/_content/query/CMMQ5oxSPg.json +++ b/docs/api/_content/query/CMMQ5oxSPg.json @@ -1 +1 @@ -{"_path":"/frontend/react/axios-with-abortcontroller","_dir":"react","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Axios With AbortController","description":"If you need to cancel some request, use axios with AbortController. Previously axios used cancellation token, but now it's deprecated.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If you need to cancel some request, use "},{"type":"element","tag":"a","props":{"href":"https://axios-http.com/docs/cancellation","rel":["nofollow"]},"children":[{"type":"text","value":"axios with AbortController"}]},{"type":"text","value":". Previously axios used cancellation token, but now it's deprecated."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"AbortController"}]},{"type":"text","value":" can be used with a multiple requests to cancel them at once."}]},{"type":"element","tag":"code","props":{"code":"import { useCallback, useRef } from \"react\";\nimport axios from 'axios';\n\nconst client = axios.create();\n\nexport const useGetUsers = () => {\n const controller = useRef(new AbortController());\n \n const get = useCallback(async () => {\n const result = await client.get(\"/\", {\n // params and props here\n signal: controller.current.signal,\n });\n\n return result.data;\n }, []);\n\n const cancel = useCallback(() => {\n controller.current.abort();\n \n // controller should be rewritten or all requests will fail\n controller.current = new AbortController();\n }, [controller]);\n\n return { get, cancel };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { useCallback, useRef } from \"react\";\nimport axios from 'axios';\n\nconst client = axios.create();\n\nexport const useGetUsers = () => {\n const controller = useRef(new AbortController());\n \n const get = useCallback(async () => {\n const result = await client.get(\"/\", {\n // params and props here\n signal: controller.current.signal,\n });\n\n return result.data;\n }, []);\n\n const cancel = useCallback(() => {\n controller.current.abort();\n \n // controller should be rewritten or all requests will fail\n controller.current = new AbortController();\n }, [controller]);\n\n return { get, cancel };\n};\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If you need to cancel some request, use "},{"type":"element","tag":"a","props":{"href":"https://axios-http.com/docs/cancellation","rel":["nofollow"]},"children":[{"type":"text","value":"axios with AbortController"}]},{"type":"text","value":". Previously axios used cancellation token, but now it's deprecated."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"AbortController"}]},{"type":"text","value":" can be used with a multiple requests to cancel them at once."}]},{"type":"element","tag":"code","props":{"code":"import { useCallback, useRef } from \"react\";\nimport axios from 'axios';\n\nconst client = axios.create();\n\nexport const useGetUsers = () => {\n const controller = useRef(new AbortController());\n \n const get = useCallback(async () => {\n const result = await client.get(\"/\", {\n // params and props here\n signal: controller.current.signal,\n });\n\n return result.data;\n }, []);\n\n const cancel = useCallback(() => {\n controller.current.abort();\n \n // controller should be rewritten or all requests will fail\n controller.current = new AbortController();\n }, [controller]);\n\n return { get, cancel };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-509459"},"children":[{"type":"text","value":"\"react\""}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-509459"},"children":[{"type":"text","value":"'axios'"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-424511"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-34d3f4"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b9c34f"},"children":[{"type":"text","value":"create"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-424511"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9c34f"},"children":[{"type":"text","value":"useGetUsers"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-424511"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-424511"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-34d3f4"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9c34f"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9c34f"},"children":[{"type":"text","value":"AbortController"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"());"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-424511"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-34d3f4"},"children":[{"type":"text","value":"get"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9c34f"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-424511"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-424511"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-424511"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-34d3f4"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b9c34f"},"children":[{"type":"text","value":"get"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-509459"},"children":[{"type":"text","value":"\"/\""}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1fa0ed"},"children":[{"type":"text","value":"// params and props here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" signal: "}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"signal"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" }, []);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-424511"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-34d3f4"},"children":[{"type":"text","value":"cancel"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9c34f"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-424511"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b9c34f"},"children":[{"type":"text","value":"abort"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1fa0ed"},"children":[{"type":"text","value":"// controller should be rewritten or all requests will fail"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9c34f"},"children":[{"type":"text","value":"AbortController"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" }, ["}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"]);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-20c8c4"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"get"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-b3c3b1"},"children":[{"type":"text","value":"cancel"}]},{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-763991"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-1fa0ed{color:#8B949E}.ct-b9c34f{color:#D2A8FF}.ct-34d3f4{color:#79C0FF}.ct-424511{color:#FF7B72}.ct-509459{color:#A5D6FF}.ct-b3c3b1{color:#C9D1D9}.ct-763991{color:#C9D1D9}.ct-20c8c4{color:#FF7B72}.light .ct-20c8c4{color:#859900}.light .ct-763991{color:#657B83}.light .ct-b3c3b1{color:#268BD2}.light .ct-509459{color:#2AA198}.light .ct-424511{color:#073642}.light .ct-34d3f4{color:#268BD2}.light .ct-b9c34f{color:#268BD2}.light .ct-1fa0ed{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:React:Axios with AbortController.md","_source":"content","_file":"Frontend/React/Axios with AbortController.md","_extension":"md"} \ No newline at end of file +{"_path":"/frontend/react/axios-with-abortcontroller","_dir":"react","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Axios With AbortController","description":"If you need to cancel some request, use axios with AbortController. Previously axios used cancellation token, but now it's deprecated.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If you need to cancel some request, use "},{"type":"element","tag":"a","props":{"href":"https://axios-http.com/docs/cancellation","rel":["nofollow"]},"children":[{"type":"text","value":"axios with AbortController"}]},{"type":"text","value":". Previously axios used cancellation token, but now it's deprecated."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"AbortController"}]},{"type":"text","value":" can be used with a multiple requests to cancel them at once."}]},{"type":"element","tag":"code","props":{"code":"import { useCallback, useRef } from \"react\";\nimport axios from 'axios';\n\nconst client = axios.create();\n\nexport const useGetUsers = () => {\n const controller = useRef(new AbortController());\n \n const get = useCallback(async () => {\n const result = await client.get(\"/\", {\n // params and props here\n signal: controller.current.signal,\n });\n\n return result.data;\n }, []);\n\n const cancel = useCallback(() => {\n controller.current.abort();\n \n // controller should be rewritten or all requests will fail\n controller.current = new AbortController();\n }, [controller]);\n\n return { get, cancel };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { useCallback, useRef } from \"react\";\nimport axios from 'axios';\n\nconst client = axios.create();\n\nexport const useGetUsers = () => {\n const controller = useRef(new AbortController());\n \n const get = useCallback(async () => {\n const result = await client.get(\"/\", {\n // params and props here\n signal: controller.current.signal,\n });\n\n return result.data;\n }, []);\n\n const cancel = useCallback(() => {\n controller.current.abort();\n \n // controller should be rewritten or all requests will fail\n controller.current = new AbortController();\n }, [controller]);\n\n return { get, cancel };\n};\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If you need to cancel some request, use "},{"type":"element","tag":"a","props":{"href":"https://axios-http.com/docs/cancellation","rel":["nofollow"]},"children":[{"type":"text","value":"axios with AbortController"}]},{"type":"text","value":". Previously axios used cancellation token, but now it's deprecated."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"AbortController"}]},{"type":"text","value":" can be used with a multiple requests to cancel them at once."}]},{"type":"element","tag":"code","props":{"code":"import { useCallback, useRef } from \"react\";\nimport axios from 'axios';\n\nconst client = axios.create();\n\nexport const useGetUsers = () => {\n const controller = useRef(new AbortController());\n \n const get = useCallback(async () => {\n const result = await client.get(\"/\", {\n // params and props here\n signal: controller.current.signal,\n });\n\n return result.data;\n }, []);\n\n const cancel = useCallback(() => {\n controller.current.abort();\n \n // controller should be rewritten or all requests will fail\n controller.current = new AbortController();\n }, [controller]);\n\n return { get, cancel };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d31196"},"children":[{"type":"text","value":"\"react\""}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d31196"},"children":[{"type":"text","value":"'axios'"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-080c78"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fdde86"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b05c66"},"children":[{"type":"text","value":"create"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-080c78"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b05c66"},"children":[{"type":"text","value":"useGetUsers"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-080c78"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-080c78"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fdde86"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b05c66"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b05c66"},"children":[{"type":"text","value":"AbortController"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"());"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-080c78"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fdde86"},"children":[{"type":"text","value":"get"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b05c66"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-080c78"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-080c78"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-080c78"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fdde86"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b05c66"},"children":[{"type":"text","value":"get"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d31196"},"children":[{"type":"text","value":"\"/\""}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-964aa7"},"children":[{"type":"text","value":"// params and props here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" signal: "}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"signal"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" }, []);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-080c78"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fdde86"},"children":[{"type":"text","value":"cancel"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b05c66"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-080c78"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b05c66"},"children":[{"type":"text","value":"abort"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-964aa7"},"children":[{"type":"text","value":"// controller should be rewritten or all requests will fail"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b05c66"},"children":[{"type":"text","value":"AbortController"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" }, ["}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"controller"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"]);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d2f6e"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"get"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-b5803b"},"children":[{"type":"text","value":"cancel"}]},{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5512bc"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-964aa7{color:#8B949E}.ct-b05c66{color:#D2A8FF}.ct-fdde86{color:#79C0FF}.ct-080c78{color:#FF7B72}.ct-d31196{color:#A5D6FF}.ct-b5803b{color:#C9D1D9}.ct-5512bc{color:#C9D1D9}.ct-6d2f6e{color:#FF7B72}.light .ct-6d2f6e{color:#859900}.light .ct-5512bc{color:#657B83}.light .ct-b5803b{color:#268BD2}.light .ct-d31196{color:#2AA198}.light .ct-080c78{color:#073642}.light .ct-fdde86{color:#268BD2}.light .ct-b05c66{color:#268BD2}.light .ct-964aa7{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:React:Axios with AbortController.md","_source":"content","_file":"Frontend/React/Axios with AbortController.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/DliR2N9mzp.json b/docs/api/_content/query/DliR2N9mzp.json index 20c6fda..3570b24 100644 --- a/docs/api/_content/query/DliR2N9mzp.json +++ b/docs/api/_content/query/DliR2N9mzp.json @@ -1 +1 @@ -{"_path":"/linux/setting-up-nginx","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Setting Up NGINX","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"fallback-url-for-spa-s"},"children":[{"type":"text","value":"Fallback url for SPA-s"}]},{"type":"element","tag":"code","props":{"code":"server {\n # ...\n location / {\n # First attempt to serve request as file, then\n # as directory, then fall back to displaying a 404.\n try_files $uri $uri/ =404;\n }\n # ...\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"server {\n # ...\n location / {\n # First attempt to serve request as file, then\n # as directory, then fall back to displaying a 404.\n try_files $uri $uri/ =404;\n }\n # ...\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"set-up-for-uploads"},"children":[{"type":"text","value":"Set up for uploads"}]},{"type":"element","tag":"code","props":{"code":"server {\n # ...\n client_max_body_size 200M;\n # ...\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"server {\n # ...\n client_max_body_size 200M;\n # ...\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"reverse-proxy-for-https"},"children":[{"type":"text","value":"Reverse proxy for https"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Given config forwards "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https"}]},{"type":"text","value":" traffic to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"http"}]},{"type":"text","value":" on port "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"8080"}]},{"type":"text","value":" for "},{"type":"element","tag":"a","props":{"href":"https://next.vault48.org","rel":["nofollow"]},"children":[{"type":"text","value":"https://next.vault48.org"}]},{"type":"text","value":"\nwith http2 support if possible."}]},{"type":"element","tag":"code","props":{"code":"server {\n listen 80;\n server_name next.vault48.org;\n return 301 https://next.vault48.org$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n \n # managed by Certbot\n ssl_certificate /etc/letsencrypt/live/vault48.org/fullchain.pem; \n ssl_certificate_key /etc/letsencrypt/live/vault48.org/privkey.pem; \n ssl_trusted_certificate /etc/letsencrypt/live/vault48.org/chain.pem;\n \n server_name next.vault48.org;\n \n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n \n proxy_pass http://127.0.0.1:8080;\n }\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"server {\n listen 80;\n server_name next.vault48.org;\n return 301 https://next.vault48.org$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n \n # managed by Certbot\n ssl_certificate /etc/letsencrypt/live/vault48.org/fullchain.pem; \n ssl_certificate_key /etc/letsencrypt/live/vault48.org/privkey.pem; \n ssl_trusted_certificate /etc/letsencrypt/live/vault48.org/chain.pem;\n \n server_name next.vault48.org;\n \n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n \n proxy_pass http://127.0.0.1:8080;\n }\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"fallback-url-for-spa-s"},"children":[{"type":"text","value":"Fallback url for SPA-s"}]},{"type":"element","tag":"code","props":{"code":"server {\n # ...\n location / {\n # First attempt to serve request as file, then\n # as directory, then fall back to displaying a 404.\n try_files $uri $uri/ =404;\n }\n # ...\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74d8c8"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ae28ca"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cdaa3d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f33879"},"children":[{"type":"text","value":"location"}]},{"type":"element","tag":"span","props":{"class":"ct-cdaa3d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f5638"},"children":[{"type":"text","value":"/ "}]},{"type":"element","tag":"span","props":{"class":"ct-cdaa3d"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ae28ca"},"children":[{"type":"text","value":"# First attempt to serve request as file, then"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ae28ca"},"children":[{"type":"text","value":"# as directory, then fall back to displaying a 404."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-671b3f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ae28ca"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"set-up-for-uploads"},"children":[{"type":"text","value":"Set up for uploads"}]},{"type":"element","tag":"code","props":{"code":"server {\n # ...\n client_max_body_size 200M;\n # ...\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74d8c8"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ae28ca"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" client_max_body_size "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"200M;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ae28ca"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"reverse-proxy-for-https"},"children":[{"type":"text","value":"Reverse proxy for https"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Given config forwards "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https"}]},{"type":"text","value":" traffic to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"http"}]},{"type":"text","value":" on port "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"8080"}]},{"type":"text","value":" for "},{"type":"element","tag":"a","props":{"href":"https://next.vault48.org","rel":["nofollow"]},"children":[{"type":"text","value":"https://next.vault48.org"}]},{"type":"text","value":"\nwith http2 support if possible."}]},{"type":"element","tag":"code","props":{"code":"server {\n listen 80;\n server_name next.vault48.org;\n return 301 https://next.vault48.org$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n \n # managed by Certbot\n ssl_certificate /etc/letsencrypt/live/vault48.org/fullchain.pem; \n ssl_certificate_key /etc/letsencrypt/live/vault48.org/privkey.pem; \n ssl_trusted_certificate /etc/letsencrypt/live/vault48.org/chain.pem;\n \n server_name next.vault48.org;\n \n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n \n proxy_pass http://127.0.0.1:8080;\n }\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74d8c8"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"80;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"next.vault48.org;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-078709"},"children":[{"type":"text","value":"301"}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" https://next.vault48.org"}]},{"type":"element","tag":"span","props":{"class":"ct-bc98b4"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-e3a788"},"children":[{"type":"text","value":"request_uri"}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74d8c8"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"443 ssl http2;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"[::]:443 ssl http2;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ae28ca"},"children":[{"type":"text","value":"# managed by Certbot"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" ssl_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"/etc/letsencrypt/live/vault48.org/fullchain.pem; "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" ssl_certificate_key "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"/etc/letsencrypt/live/vault48.org/privkey.pem; "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" ssl_trusted_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"/etc/letsencrypt/live/vault48.org/chain.pem;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"next.vault48.org;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cdaa3d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f33879"},"children":[{"type":"text","value":"location"}]},{"type":"element","tag":"span","props":{"class":"ct-cdaa3d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f5638"},"children":[{"type":"text","value":"/ "}]},{"type":"element","tag":"span","props":{"class":"ct-cdaa3d"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" proxy_redirect "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"off;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"Host "}]},{"type":"element","tag":"span","props":{"class":"ct-bc98b4"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-e3a788"},"children":[{"type":"text","value":"host"}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"X-Real-IP "}]},{"type":"element","tag":"span","props":{"class":"ct-bc98b4"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-e3a788"},"children":[{"type":"text","value":"remote_addr"}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"X-Forwarded-For "}]},{"type":"element","tag":"span","props":{"class":"ct-bc98b4"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-e3a788"},"children":[{"type":"text","value":"proxy_add_x_forwarded_for"}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9982ad"},"children":[{"type":"text","value":" proxy_pass "}]},{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"http://127.0.0.1:8080;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ab6757"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-e3a788{color:#C9D1D9}.ct-bc98b4{color:#C9D1D9}.ct-078709{color:#79C0FF}.ct-9982ad{color:#FF7B72}.ct-671b3f{color:#FF7B72}.ct-6f5638{color:#FFA657}.ct-f33879{color:#FF7B72}.ct-cdaa3d{color:#C9D1D9}.ct-ae28ca{color:#8B949E}.ct-ab6757{color:#C9D1D9}.ct-74d8c8{color:#FF7B72}.light .ct-74d8c8{color:#073642}.light .ct-ab6757{color:#657B83}.light .ct-ae28ca{color:#93A1A1}.light .ct-cdaa3d{color:#657B83}.light .ct-f33879{color:#073642}.light .ct-6f5638{color:#657B83}.light .ct-671b3f{color:#657B83}.light .ct-9982ad{color:#859900}.light .ct-078709{color:#D33682}.light .ct-bc98b4{color:#859900}.light .ct-e3a788{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"fallback-url-for-spa-s","depth":2,"text":"Fallback url for SPA-s"},{"id":"set-up-for-uploads","depth":2,"text":"Set up for uploads"},{"id":"reverse-proxy-for-https","depth":2,"text":"Reverse proxy for https"}]}},"_type":"markdown","_id":"content:Linux:Setting up NGINX.md","_source":"content","_file":"Linux/Setting up NGINX.md","_extension":"md"} \ No newline at end of file +{"_path":"/linux/setting-up-nginx","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Setting Up NGINX","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"fallback-url-for-spa-s"},"children":[{"type":"text","value":"Fallback url for SPA-s"}]},{"type":"element","tag":"code","props":{"code":"server {\n # ...\n location / {\n # First attempt to serve request as file, then\n # as directory, then fall back to displaying a 404.\n try_files $uri $uri/ =404;\n }\n # ...\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"server {\n # ...\n location / {\n # First attempt to serve request as file, then\n # as directory, then fall back to displaying a 404.\n try_files $uri $uri/ =404;\n }\n # ...\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"set-up-for-uploads"},"children":[{"type":"text","value":"Set up for uploads"}]},{"type":"element","tag":"code","props":{"code":"server {\n # ...\n client_max_body_size 200M;\n # ...\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"server {\n # ...\n client_max_body_size 200M;\n # ...\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"reverse-proxy-for-https"},"children":[{"type":"text","value":"Reverse proxy for https"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Given config forwards "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https"}]},{"type":"text","value":" traffic to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"http"}]},{"type":"text","value":" on port "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"8080"}]},{"type":"text","value":" for "},{"type":"element","tag":"a","props":{"href":"https://next.vault48.org","rel":["nofollow"]},"children":[{"type":"text","value":"https://next.vault48.org"}]},{"type":"text","value":"\nwith http2 support if possible."}]},{"type":"element","tag":"code","props":{"code":"server {\n listen 80;\n server_name next.vault48.org;\n return 301 https://next.vault48.org$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n \n # managed by Certbot\n ssl_certificate /etc/letsencrypt/live/vault48.org/fullchain.pem; \n ssl_certificate_key /etc/letsencrypt/live/vault48.org/privkey.pem; \n ssl_trusted_certificate /etc/letsencrypt/live/vault48.org/chain.pem;\n \n server_name next.vault48.org;\n \n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n \n proxy_pass http://127.0.0.1:8080;\n }\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"server {\n listen 80;\n server_name next.vault48.org;\n return 301 https://next.vault48.org$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n \n # managed by Certbot\n ssl_certificate /etc/letsencrypt/live/vault48.org/fullchain.pem; \n ssl_certificate_key /etc/letsencrypt/live/vault48.org/privkey.pem; \n ssl_trusted_certificate /etc/letsencrypt/live/vault48.org/chain.pem;\n \n server_name next.vault48.org;\n \n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n \n proxy_pass http://127.0.0.1:8080;\n }\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"fallback-url-for-spa-s"},"children":[{"type":"text","value":"Fallback url for SPA-s"}]},{"type":"element","tag":"code","props":{"code":"server {\n # ...\n location / {\n # First attempt to serve request as file, then\n # as directory, then fall back to displaying a 404.\n try_files $uri $uri/ =404;\n }\n # ...\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43630c"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fc236"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bd6321"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-042ac1"},"children":[{"type":"text","value":"location"}]},{"type":"element","tag":"span","props":{"class":"ct-bd6321"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b1fd04"},"children":[{"type":"text","value":"/ "}]},{"type":"element","tag":"span","props":{"class":"ct-bd6321"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fc236"},"children":[{"type":"text","value":"# First attempt to serve request as file, then"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fc236"},"children":[{"type":"text","value":"# as directory, then fall back to displaying a 404."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e3cb66"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fc236"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"set-up-for-uploads"},"children":[{"type":"text","value":"Set up for uploads"}]},{"type":"element","tag":"code","props":{"code":"server {\n # ...\n client_max_body_size 200M;\n # ...\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43630c"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fc236"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" client_max_body_size "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"200M;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fc236"},"children":[{"type":"text","value":"# ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"reverse-proxy-for-https"},"children":[{"type":"text","value":"Reverse proxy for https"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Given config forwards "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https"}]},{"type":"text","value":" traffic to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"http"}]},{"type":"text","value":" on port "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"8080"}]},{"type":"text","value":" for "},{"type":"element","tag":"a","props":{"href":"https://next.vault48.org","rel":["nofollow"]},"children":[{"type":"text","value":"https://next.vault48.org"}]},{"type":"text","value":"\nwith http2 support if possible."}]},{"type":"element","tag":"code","props":{"code":"server {\n listen 80;\n server_name next.vault48.org;\n return 301 https://next.vault48.org$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n \n # managed by Certbot\n ssl_certificate /etc/letsencrypt/live/vault48.org/fullchain.pem; \n ssl_certificate_key /etc/letsencrypt/live/vault48.org/privkey.pem; \n ssl_trusted_certificate /etc/letsencrypt/live/vault48.org/chain.pem;\n \n server_name next.vault48.org;\n \n location / {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n \n proxy_pass http://127.0.0.1:8080;\n }\n}\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43630c"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"80;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"next.vault48.org;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9a42cf"},"children":[{"type":"text","value":"301"}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" https://next.vault48.org"}]},{"type":"element","tag":"span","props":{"class":"ct-5daac2"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-4b2209"},"children":[{"type":"text","value":"request_uri"}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43630c"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"443 ssl http2;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" listen "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"[::]:443 ssl http2;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fc236"},"children":[{"type":"text","value":"# managed by Certbot"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" ssl_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"/etc/letsencrypt/live/vault48.org/fullchain.pem; "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" ssl_certificate_key "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"/etc/letsencrypt/live/vault48.org/privkey.pem; "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" ssl_trusted_certificate "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"/etc/letsencrypt/live/vault48.org/chain.pem;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" server_name "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"next.vault48.org;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bd6321"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-042ac1"},"children":[{"type":"text","value":"location"}]},{"type":"element","tag":"span","props":{"class":"ct-bd6321"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b1fd04"},"children":[{"type":"text","value":"/ "}]},{"type":"element","tag":"span","props":{"class":"ct-bd6321"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" proxy_redirect "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"off;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"Host "}]},{"type":"element","tag":"span","props":{"class":"ct-5daac2"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-4b2209"},"children":[{"type":"text","value":"host"}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"X-Real-IP "}]},{"type":"element","tag":"span","props":{"class":"ct-5daac2"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-4b2209"},"children":[{"type":"text","value":"remote_addr"}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" proxy_set_header "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"X-Forwarded-For "}]},{"type":"element","tag":"span","props":{"class":"ct-5daac2"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-4b2209"},"children":[{"type":"text","value":"proxy_add_x_forwarded_for"}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f801"},"children":[{"type":"text","value":" proxy_pass "}]},{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"http://127.0.0.1:8080;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a3354"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-4b2209{color:#C9D1D9}.ct-5daac2{color:#C9D1D9}.ct-9a42cf{color:#79C0FF}.ct-e8f801{color:#FF7B72}.ct-e3cb66{color:#FF7B72}.ct-b1fd04{color:#FFA657}.ct-042ac1{color:#FF7B72}.ct-bd6321{color:#C9D1D9}.ct-0fc236{color:#8B949E}.ct-1a3354{color:#C9D1D9}.ct-43630c{color:#FF7B72}.light .ct-43630c{color:#073642}.light .ct-1a3354{color:#657B83}.light .ct-0fc236{color:#93A1A1}.light .ct-bd6321{color:#657B83}.light .ct-042ac1{color:#073642}.light .ct-b1fd04{color:#657B83}.light .ct-e3cb66{color:#657B83}.light .ct-e8f801{color:#859900}.light .ct-9a42cf{color:#D33682}.light .ct-5daac2{color:#859900}.light .ct-4b2209{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"fallback-url-for-spa-s","depth":2,"text":"Fallback url for SPA-s"},{"id":"set-up-for-uploads","depth":2,"text":"Set up for uploads"},{"id":"reverse-proxy-for-https","depth":2,"text":"Reverse proxy for https"}]}},"_type":"markdown","_id":"content:Linux:Setting up NGINX.md","_source":"content","_file":"Linux/Setting up NGINX.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/EH6LeCIDqM.json b/docs/api/_content/query/EH6LeCIDqM.json index 7386e0a..69cb7d3 100644 --- a/docs/api/_content/query/EH6LeCIDqM.json +++ b/docs/api/_content/query/EH6LeCIDqM.json @@ -1 +1 @@ -{"_path":"/docker/private-docker-registry","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Private Docker Registry","description":"Suitable to work with Drone-ci for hosting private #docker images.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Suitable to work with "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":" for hosting private #docker images."}]},{"type":"element","tag":"h2","props":{"id":"sample-docker-compose-for-custom-docker-registry"},"children":[{"type":"text","value":"Sample docker-compose for custom docker registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This one brings up private docker registry with ui. First you'll need to generate password for it:"}]},{"type":"element","tag":"code","props":{"code":"docker run \\\n --entrypoint htpasswd registry:2 \\\n -Bbn user mypassword > auth/registry.password\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"docker run \\\n --entrypoint htpasswd registry:2 \\\n -Bbn user mypassword > auth/registry.password\n"}]}]}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\nservices:\n registry:\n container_name: docker__registry\n image: registry:2\n ports:\n - 5000:5000\n restart: always\n environment:\n - REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=/data\n - REGISTRY_AUTH=htpasswd\n - REGISTRY_AUTH_HTPASSWD_REALM=Registry\n - REGISTRY_AUTH_HTPASSWD_PATH=/auth/registry.password\n - REGISTRY_HTTP_SECRET=password\n - REGISTRY_STORAGE_DELETE_ENABLED=true\n volumes:\n - ./registry/auth:/auth\n - ./registry/data:/data\n ui:\n container_name: docker__ui\n image: parabuzzle/craneoperator:latest\n ports:\n - 80:80\n restart: always\n environment:\n - REGISTRY_HOST=registry\n - REGISTRY_PORT=5000\n - REGISTRY_PROTOCOL=http\n - ALLOW_REGISTRY_LOGIN=true\n - REGISTRY_ALLOW_DELETE=true\n - USERNAME=registry\n - PASSWORD=password\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: \"3\"\nservices:\n registry:\n container_name: docker__registry\n image: registry:2\n ports:\n - 5000:5000\n restart: always\n environment:\n - REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=/data\n - REGISTRY_AUTH=htpasswd\n - REGISTRY_AUTH_HTPASSWD_REALM=Registry\n - REGISTRY_AUTH_HTPASSWD_PATH=/auth/registry.password\n - REGISTRY_HTTP_SECRET=password\n - REGISTRY_STORAGE_DELETE_ENABLED=true\n volumes:\n - ./registry/auth:/auth\n - ./registry/data:/data\n ui:\n container_name: docker__ui\n image: parabuzzle/craneoperator:latest\n ports:\n - 80:80\n restart: always\n environment:\n - REGISTRY_HOST=registry\n - REGISTRY_PORT=5000\n - REGISTRY_PROTOCOL=http\n - ALLOW_REGISTRY_LOGIN=true\n - REGISTRY_ALLOW_DELETE=true\n - USERNAME=registry\n - PASSWORD=password\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"squash-layers-on-registry"},"children":[{"type":"text","value":"Squash layers on registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you need to squash all layers in docker registry to free up disk space."}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Run this command to mark oldest layers"}]}]},{"type":"element","tag":"code","props":{"code":"# Try this first\ndocker run \\\n --rm anoxis/registry-cli \\\n -r https://registry.url \\\n -l user:password \\\n --delete \\\n --num 2\n\n# Then this \ndocker run -it \\\n -v /path/to/registry/data:/registry \\\n -e REGISTRY_URL=https://registry.url \\\n -e DRY_RUN=\"false\" \\\n -e REGISTRY_AUTH=\"user:password\" \\\n mortensrasmussen/docker-registry-manifest-cleanup\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"# Try this first\ndocker run \\\n --rm anoxis/registry-cli \\\n -r https://registry.url \\\n -l user:password \\\n --delete \\\n --num 2\n\n# Then this \ndocker run -it \\\n -v /path/to/registry/data:/registry \\\n -e REGISTRY_URL=https://registry.url \\\n -e DRY_RUN=\"false\" \\\n -e REGISTRY_AUTH=\"user:password\" \\\n mortensrasmussen/docker-registry-manifest-cleanup\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Suitable to work with "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":" for hosting private #docker images."}]},{"type":"element","tag":"h2","props":{"id":"sample-docker-compose-for-custom-docker-registry"},"children":[{"type":"text","value":"Sample docker-compose for custom docker registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This one brings up private docker registry with ui. First you'll need to generate password for it:"}]},{"type":"element","tag":"code","props":{"code":"docker run \\\n --entrypoint htpasswd registry:2 \\\n -Bbn user mypassword > auth/registry.password\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":"docker run \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" --entrypoint htpasswd registry:2 \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" -Bbn user mypassword "}]},{"type":"element","tag":"span","props":{"class":"ct-8ef278"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" auth/registry.password"}]}]}]}]}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\nservices:\n registry:\n container_name: docker__registry\n image: registry:2\n ports:\n - 5000:5000\n restart: always\n environment:\n - REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=/data\n - REGISTRY_AUTH=htpasswd\n - REGISTRY_AUTH_HTPASSWD_REALM=Registry\n - REGISTRY_AUTH_HTPASSWD_PATH=/auth/registry.password\n - REGISTRY_HTTP_SECRET=password\n - REGISTRY_STORAGE_DELETE_ENABLED=true\n volumes:\n - ./registry/auth:/auth\n - ./registry/data:/data\n ui:\n container_name: docker__ui\n image: parabuzzle/craneoperator:latest\n ports:\n - 80:80\n restart: always\n environment:\n - REGISTRY_HOST=registry\n - REGISTRY_PORT=5000\n - REGISTRY_PROTOCOL=http\n - ALLOW_REGISTRY_LOGIN=true\n - REGISTRY_ALLOW_DELETE=true\n - USERNAME=registry\n - PASSWORD=password\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"\"3\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"registry"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"docker__registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"registry:2"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"5000:5000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"REGISTRY_AUTH=htpasswd"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"REGISTRY_AUTH_HTPASSWD_REALM=Registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"REGISTRY_AUTH_HTPASSWD_PATH=/auth/registry.password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"REGISTRY_HTTP_SECRET=password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"REGISTRY_STORAGE_DELETE_ENABLED=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"./registry/auth:/auth"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"./registry/data:/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"ui"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"docker__ui"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"parabuzzle/craneoperator:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"80:80"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5cf510"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"REGISTRY_HOST=registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"REGISTRY_PORT=5000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"REGISTRY_PROTOCOL=http"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"ALLOW_REGISTRY_LOGIN=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"REGISTRY_ALLOW_DELETE=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"USERNAME=registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"PASSWORD=password"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"squash-layers-on-registry"},"children":[{"type":"text","value":"Squash layers on registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you need to squash all layers in docker registry to free up disk space."}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Run this command to mark oldest layers"}]}]},{"type":"element","tag":"code","props":{"code":"# Try this first\ndocker run \\\n --rm anoxis/registry-cli \\\n -r https://registry.url \\\n -l user:password \\\n --delete \\\n --num 2\n\n# Then this \ndocker run -it \\\n -v /path/to/registry/data:/registry \\\n -e REGISTRY_URL=https://registry.url \\\n -e DRY_RUN=\"false\" \\\n -e REGISTRY_AUTH=\"user:password\" \\\n mortensrasmussen/docker-registry-manifest-cleanup\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-116223"},"children":[{"type":"text","value":"# Try this first"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":"docker run \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" --rm anoxis/registry-cli \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" -r https://registry.url \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" -l user:password \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" --delete \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" --num 2"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-116223"},"children":[{"type":"text","value":"# Then this "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":"docker run -it \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" -v /path/to/registry/data:/registry \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" -e REGISTRY_URL=https://registry.url \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" -e DRY_RUN="}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" -e REGISTRY_AUTH="}]},{"type":"element","tag":"span","props":{"class":"ct-8c53f0"},"children":[{"type":"text","value":"\"user:password\""}]},{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c7c611"},"children":[{"type":"text","value":" mortensrasmussen/docker-registry-manifest-cleanup"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-116223{color:#8B949E}.ct-8c53f0{color:#A5D6FF}.ct-5cf510{color:#7EE787}.ct-8ef278{color:#FF7B72}.ct-c7c611{color:#C9D1D9}.light .ct-c7c611{color:#657B83}.light .ct-8ef278{color:#859900}.light .ct-5cf510{color:#268BD2}.light .ct-8c53f0{color:#2AA198}.light .ct-116223{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"sample-docker-compose-for-custom-docker-registry","depth":2,"text":"Sample docker-compose for custom docker registry"},{"id":"squash-layers-on-registry","depth":2,"text":"Squash layers on registry"}]}},"_type":"markdown","_id":"content:Docker:Private docker registry.md","_source":"content","_file":"Docker/Private docker registry.md","_extension":"md"} \ No newline at end of file +{"_path":"/docker/private-docker-registry","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Private Docker Registry","description":"Suitable to work with Drone-ci for hosting private #docker images.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Suitable to work with "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":" for hosting private #docker images."}]},{"type":"element","tag":"h2","props":{"id":"sample-docker-compose-for-custom-docker-registry"},"children":[{"type":"text","value":"Sample docker-compose for custom docker registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This one brings up private docker registry with ui. First you'll need to generate password for it:"}]},{"type":"element","tag":"code","props":{"code":"docker run \\\n --entrypoint htpasswd registry:2 \\\n -Bbn user mypassword > auth/registry.password\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"docker run \\\n --entrypoint htpasswd registry:2 \\\n -Bbn user mypassword > auth/registry.password\n"}]}]}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\nservices:\n registry:\n container_name: docker__registry\n image: registry:2\n ports:\n - 5000:5000\n restart: always\n environment:\n - REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=/data\n - REGISTRY_AUTH=htpasswd\n - REGISTRY_AUTH_HTPASSWD_REALM=Registry\n - REGISTRY_AUTH_HTPASSWD_PATH=/auth/registry.password\n - REGISTRY_HTTP_SECRET=password\n - REGISTRY_STORAGE_DELETE_ENABLED=true\n volumes:\n - ./registry/auth:/auth\n - ./registry/data:/data\n ui:\n container_name: docker__ui\n image: parabuzzle/craneoperator:latest\n ports:\n - 80:80\n restart: always\n environment:\n - REGISTRY_HOST=registry\n - REGISTRY_PORT=5000\n - REGISTRY_PROTOCOL=http\n - ALLOW_REGISTRY_LOGIN=true\n - REGISTRY_ALLOW_DELETE=true\n - USERNAME=registry\n - PASSWORD=password\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: \"3\"\nservices:\n registry:\n container_name: docker__registry\n image: registry:2\n ports:\n - 5000:5000\n restart: always\n environment:\n - REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=/data\n - REGISTRY_AUTH=htpasswd\n - REGISTRY_AUTH_HTPASSWD_REALM=Registry\n - REGISTRY_AUTH_HTPASSWD_PATH=/auth/registry.password\n - REGISTRY_HTTP_SECRET=password\n - REGISTRY_STORAGE_DELETE_ENABLED=true\n volumes:\n - ./registry/auth:/auth\n - ./registry/data:/data\n ui:\n container_name: docker__ui\n image: parabuzzle/craneoperator:latest\n ports:\n - 80:80\n restart: always\n environment:\n - REGISTRY_HOST=registry\n - REGISTRY_PORT=5000\n - REGISTRY_PROTOCOL=http\n - ALLOW_REGISTRY_LOGIN=true\n - REGISTRY_ALLOW_DELETE=true\n - USERNAME=registry\n - PASSWORD=password\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"squash-layers-on-registry"},"children":[{"type":"text","value":"Squash layers on registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you need to squash all layers in docker registry to free up disk space."}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Run this command to mark oldest layers"}]}]},{"type":"element","tag":"code","props":{"code":"# Try this first\ndocker run \\\n --rm anoxis/registry-cli \\\n -r https://registry.url \\\n -l user:password \\\n --delete \\\n --num 2\n\n# Then this \ndocker run -it \\\n -v /path/to/registry/data:/registry \\\n -e REGISTRY_URL=https://registry.url \\\n -e DRY_RUN=\"false\" \\\n -e REGISTRY_AUTH=\"user:password\" \\\n mortensrasmussen/docker-registry-manifest-cleanup\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"# Try this first\ndocker run \\\n --rm anoxis/registry-cli \\\n -r https://registry.url \\\n -l user:password \\\n --delete \\\n --num 2\n\n# Then this \ndocker run -it \\\n -v /path/to/registry/data:/registry \\\n -e REGISTRY_URL=https://registry.url \\\n -e DRY_RUN=\"false\" \\\n -e REGISTRY_AUTH=\"user:password\" \\\n mortensrasmussen/docker-registry-manifest-cleanup\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Suitable to work with "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":" for hosting private #docker images."}]},{"type":"element","tag":"h2","props":{"id":"sample-docker-compose-for-custom-docker-registry"},"children":[{"type":"text","value":"Sample docker-compose for custom docker registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This one brings up private docker registry with ui. First you'll need to generate password for it:"}]},{"type":"element","tag":"code","props":{"code":"docker run \\\n --entrypoint htpasswd registry:2 \\\n -Bbn user mypassword > auth/registry.password\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":"docker run \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" --entrypoint htpasswd registry:2 \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" -Bbn user mypassword "}]},{"type":"element","tag":"span","props":{"class":"ct-ac602b"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" auth/registry.password"}]}]}]}]}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\nservices:\n registry:\n container_name: docker__registry\n image: registry:2\n ports:\n - 5000:5000\n restart: always\n environment:\n - REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=/data\n - REGISTRY_AUTH=htpasswd\n - REGISTRY_AUTH_HTPASSWD_REALM=Registry\n - REGISTRY_AUTH_HTPASSWD_PATH=/auth/registry.password\n - REGISTRY_HTTP_SECRET=password\n - REGISTRY_STORAGE_DELETE_ENABLED=true\n volumes:\n - ./registry/auth:/auth\n - ./registry/data:/data\n ui:\n container_name: docker__ui\n image: parabuzzle/craneoperator:latest\n ports:\n - 80:80\n restart: always\n environment:\n - REGISTRY_HOST=registry\n - REGISTRY_PORT=5000\n - REGISTRY_PROTOCOL=http\n - ALLOW_REGISTRY_LOGIN=true\n - REGISTRY_ALLOW_DELETE=true\n - USERNAME=registry\n - PASSWORD=password\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"\"3\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"registry"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"docker__registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"registry:2"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"5000:5000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"REGISTRY_AUTH=htpasswd"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"REGISTRY_AUTH_HTPASSWD_REALM=Registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"REGISTRY_AUTH_HTPASSWD_PATH=/auth/registry.password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"REGISTRY_HTTP_SECRET=password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"REGISTRY_STORAGE_DELETE_ENABLED=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"./registry/auth:/auth"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"./registry/data:/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"ui"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"docker__ui"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"parabuzzle/craneoperator:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"80:80"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0ddb55"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"REGISTRY_HOST=registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"REGISTRY_PORT=5000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"REGISTRY_PROTOCOL=http"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"ALLOW_REGISTRY_LOGIN=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"REGISTRY_ALLOW_DELETE=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"USERNAME=registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"PASSWORD=password"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"squash-layers-on-registry"},"children":[{"type":"text","value":"Squash layers on registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you need to squash all layers in docker registry to free up disk space."}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Run this command to mark oldest layers"}]}]},{"type":"element","tag":"code","props":{"code":"# Try this first\ndocker run \\\n --rm anoxis/registry-cli \\\n -r https://registry.url \\\n -l user:password \\\n --delete \\\n --num 2\n\n# Then this \ndocker run -it \\\n -v /path/to/registry/data:/registry \\\n -e REGISTRY_URL=https://registry.url \\\n -e DRY_RUN=\"false\" \\\n -e REGISTRY_AUTH=\"user:password\" \\\n mortensrasmussen/docker-registry-manifest-cleanup\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a663a1"},"children":[{"type":"text","value":"# Try this first"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":"docker run \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" --rm anoxis/registry-cli \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" -r https://registry.url \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" -l user:password \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" --delete \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" --num 2"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a663a1"},"children":[{"type":"text","value":"# Then this "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":"docker run -it \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" -v /path/to/registry/data:/registry \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" -e REGISTRY_URL=https://registry.url \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" -e DRY_RUN="}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" -e REGISTRY_AUTH="}]},{"type":"element","tag":"span","props":{"class":"ct-12b57b"},"children":[{"type":"text","value":"\"user:password\""}]},{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28deb7"},"children":[{"type":"text","value":" mortensrasmussen/docker-registry-manifest-cleanup"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-a663a1{color:#8B949E}.ct-12b57b{color:#A5D6FF}.ct-0ddb55{color:#7EE787}.ct-ac602b{color:#FF7B72}.ct-28deb7{color:#C9D1D9}.light .ct-28deb7{color:#657B83}.light .ct-ac602b{color:#859900}.light .ct-0ddb55{color:#268BD2}.light .ct-12b57b{color:#2AA198}.light .ct-a663a1{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"sample-docker-compose-for-custom-docker-registry","depth":2,"text":"Sample docker-compose for custom docker registry"},{"id":"squash-layers-on-registry","depth":2,"text":"Squash layers on registry"}]}},"_type":"markdown","_id":"content:Docker:Private docker registry.md","_source":"content","_file":"Docker/Private docker registry.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/FLiVxDo2qK.json b/docs/api/_content/query/FLiVxDo2qK.json index 5c31645..9ff1f80 100644 --- a/docs/api/_content/query/FLiVxDo2qK.json +++ b/docs/api/_content/query/FLiVxDo2qK.json @@ -1 +1 @@ -{"_path":"/typescript/add-global-variable-to-window","_dir":"typescript","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Add Global Variable To Window","description":"Sometimes you want to add global variable to your window. That thing's called global module augmentation.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you want to add global variable to your "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window"}]},{"type":"text","value":". That thing's called "},{"type":"element","tag":"a","props":{"href":"https://www.typescriptlang.org/docs/handbook/declaration-merging.html#global-augmentation","rel":["nofollow"]},"children":[{"type":"text","value":"global module augmentation"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say you need to call "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.doFancyThings()"}]},{"type":"text","value":". For that you should augment global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window"}]},{"type":"text","value":" interface in "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"*.d.ts"}]},{"type":"text","value":" file:"}]},{"type":"element","tag":"code","props":{"code":"declare global {\n interface Window {\n doFancyThings: () => void;\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"declare global {\n interface Window {\n doFancyThings: () => void;\n }\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is useful for declaring global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.ethereum"}]},{"type":"text","value":" (or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.web3"}]},{"type":"text","value":") in "},{"type":"element","tag":"a","props":{"href":"/blockchain/Common%20typescript%20examples"},"children":[{"type":"text","value":"blockchain"}]},{"type":"text","value":" projects with typescript, which use wallet browser extensions."}]},{"type":"element","tag":"h2","props":{"id":"augmenting-existing-interface"},"children":[{"type":"text","value":"Augmenting existing interface"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For example, you have class "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Sample"}]},{"type":"text","value":" without any functionality:"}]},{"type":"element","tag":"code","props":{"code":"// Sample.ts\n\nexport class Sample {\n // nothing :-)\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// Sample.ts\n\nexport class Sample {\n // nothing :-)\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then you want extend it with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"doFancyThings()"}]},{"type":"text","value":" method. That can be achieved with said "},{"type":"element","tag":"a","props":{"href":"https://www.typescriptlang.org/docs/handbook/declaration-merging.html#module-augmentation","rel":["nofollow"]},"children":[{"type":"text","value":"module augmentation"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"// fancyThings.ts\nimport { Sample } from \"./Sample\";\n\ndeclare module \"./Sample\" {\n interface Sample {\n doFancyThings: () => void;\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// fancyThings.ts\nimport { Sample } from \"./Sample\";\n\ndeclare module \"./Sample\" {\n interface Sample {\n doFancyThings: () => void;\n }\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Now you can call "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"sample.doFancyThings()"}]},{"type":"text","value":" by importing both "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".ts"}]},{"type":"text","value":" files:"}]},{"type":"element","tag":"code","props":{"code":"import { Sample } from \"./sample\";\nimport \"./fancyThings\";\n\nconst sample = new Sample();\nsample.doFancyThings(); // ok\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { Sample } from \"./sample\";\nimport \"./fancyThings\";\n\nconst sample = new Sample();\nsample.doFancyThings(); // ok\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This example is useful for "},{"type":"element","tag":"a","props":{"href":"./Frontend/Vue/Adding%20global%20properties%20to%20component"},"children":[{"type":"text","value":"adding global properties to component"}]},{"type":"text","value":" in vue.js."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you want to add global variable to your "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window"}]},{"type":"text","value":". That thing's called "},{"type":"element","tag":"a","props":{"href":"https://www.typescriptlang.org/docs/handbook/declaration-merging.html#global-augmentation","rel":["nofollow"]},"children":[{"type":"text","value":"global module augmentation"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say you need to call "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.doFancyThings()"}]},{"type":"text","value":". For that you should augment global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window"}]},{"type":"text","value":" interface in "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"*.d.ts"}]},{"type":"text","value":" file:"}]},{"type":"element","tag":"code","props":{"code":"declare global {\n interface Window {\n doFancyThings: () => void;\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-42c3a1"},"children":[{"type":"text","value":"declare"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fc5904"},"children":[{"type":"text","value":"global"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c3a1"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-909727"},"children":[{"type":"text","value":"Window"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c31fd1"},"children":[{"type":"text","value":"doFancyThings"}]},{"type":"element","tag":"span","props":{"class":"ct-861939"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-42c3a1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b4cda"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is useful for declaring global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.ethereum"}]},{"type":"text","value":" (or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.web3"}]},{"type":"text","value":") in "},{"type":"element","tag":"a","props":{"href":"/blockchain/Common%20typescript%20examples"},"children":[{"type":"text","value":"blockchain"}]},{"type":"text","value":" projects with typescript, which use wallet browser extensions."}]},{"type":"element","tag":"h2","props":{"id":"augmenting-existing-interface"},"children":[{"type":"text","value":"Augmenting existing interface"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For example, you have class "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Sample"}]},{"type":"text","value":" without any functionality:"}]},{"type":"element","tag":"code","props":{"code":"// Sample.ts\n\nexport class Sample {\n // nothing :-)\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-144069"},"children":[{"type":"text","value":"// Sample.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-861939"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c3a1"},"children":[{"type":"text","value":"class"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-909727"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-144069"},"children":[{"type":"text","value":"// nothing :-)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then you want extend it with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"doFancyThings()"}]},{"type":"text","value":" method. That can be achieved with said "},{"type":"element","tag":"a","props":{"href":"https://www.typescriptlang.org/docs/handbook/declaration-merging.html#module-augmentation","rel":["nofollow"]},"children":[{"type":"text","value":"module augmentation"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"// fancyThings.ts\nimport { Sample } from \"./Sample\";\n\ndeclare module \"./Sample\" {\n interface Sample {\n doFancyThings: () => void;\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-144069"},"children":[{"type":"text","value":"// fancyThings.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-861939"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-fc5904"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-861939"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-145926"},"children":[{"type":"text","value":"\"./Sample\""}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-42c3a1"},"children":[{"type":"text","value":"declare"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c3a1"},"children":[{"type":"text","value":"module"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-145926"},"children":[{"type":"text","value":"\"./Sample\""}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-42c3a1"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-909727"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c31fd1"},"children":[{"type":"text","value":"doFancyThings"}]},{"type":"element","tag":"span","props":{"class":"ct-861939"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-42c3a1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b4cda"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Now you can call "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"sample.doFancyThings()"}]},{"type":"text","value":" by importing both "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".ts"}]},{"type":"text","value":" files:"}]},{"type":"element","tag":"code","props":{"code":"import { Sample } from \"./sample\";\nimport \"./fancyThings\";\n\nconst sample = new Sample();\nsample.doFancyThings(); // ok\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-861939"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-fc5904"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-861939"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-145926"},"children":[{"type":"text","value":"\"./sample\""}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-861939"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-145926"},"children":[{"type":"text","value":"\"./fancyThings\""}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-42c3a1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7aa6b6"},"children":[{"type":"text","value":"sample"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-861939"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-861939"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c31fd1"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc5904"},"children":[{"type":"text","value":"sample"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c31fd1"},"children":[{"type":"text","value":"doFancyThings"}]},{"type":"element","tag":"span","props":{"class":"ct-e36519"},"children":[{"type":"text","value":"(); "}]},{"type":"element","tag":"span","props":{"class":"ct-144069"},"children":[{"type":"text","value":"// ok"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This example is useful for "},{"type":"element","tag":"a","props":{"href":"./Frontend/Vue/Adding%20global%20properties%20to%20component"},"children":[{"type":"text","value":"adding global properties to component"}]},{"type":"text","value":" in vue.js."}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-7aa6b6{color:#79C0FF}.ct-145926{color:#A5D6FF}.ct-144069{color:#8B949E}.ct-6b4cda{color:#79C0FF}.ct-861939{color:#FF7B72}.ct-c31fd1{color:#D2A8FF}.ct-909727{color:#FFA657}.ct-fc5904{color:#C9D1D9}.ct-e36519{color:#C9D1D9}.ct-42c3a1{color:#FF7B72}.light .ct-42c3a1{color:#073642}.light .ct-e36519{color:#657B83}.light .ct-fc5904{color:#268BD2}.light .ct-909727{color:#268BD2}.light .ct-c31fd1{color:#268BD2}.light .ct-861939{color:#859900}.light .ct-6b4cda{color:#859900}.light .ct-144069{color:#93A1A1}.light .ct-145926{color:#2AA198}.light .ct-7aa6b6{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"augmenting-existing-interface","depth":2,"text":"Augmenting existing interface"}]}},"_type":"markdown","_id":"content:Typescript:Add global variable to window.md","_source":"content","_file":"Typescript/Add global variable to window.md","_extension":"md"} \ No newline at end of file +{"_path":"/typescript/add-global-variable-to-window","_dir":"typescript","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Add Global Variable To Window","description":"Sometimes you want to add global variable to your window. That thing's called global module augmentation.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you want to add global variable to your "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window"}]},{"type":"text","value":". That thing's called "},{"type":"element","tag":"a","props":{"href":"https://www.typescriptlang.org/docs/handbook/declaration-merging.html#global-augmentation","rel":["nofollow"]},"children":[{"type":"text","value":"global module augmentation"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say you need to call "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.doFancyThings()"}]},{"type":"text","value":". For that you should augment global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window"}]},{"type":"text","value":" interface in "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"*.d.ts"}]},{"type":"text","value":" file:"}]},{"type":"element","tag":"code","props":{"code":"declare global {\n interface Window {\n doFancyThings: () => void;\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"declare global {\n interface Window {\n doFancyThings: () => void;\n }\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is useful for declaring global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.ethereum"}]},{"type":"text","value":" (or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.web3"}]},{"type":"text","value":") in "},{"type":"element","tag":"a","props":{"href":"/blockchain/Common%20typescript%20examples"},"children":[{"type":"text","value":"blockchain"}]},{"type":"text","value":" projects with typescript, which use wallet browser extensions."}]},{"type":"element","tag":"h2","props":{"id":"augmenting-existing-interface"},"children":[{"type":"text","value":"Augmenting existing interface"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For example, you have class "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Sample"}]},{"type":"text","value":" without any functionality:"}]},{"type":"element","tag":"code","props":{"code":"// Sample.ts\n\nexport class Sample {\n // nothing :-)\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// Sample.ts\n\nexport class Sample {\n // nothing :-)\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then you want extend it with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"doFancyThings()"}]},{"type":"text","value":" method. That can be achieved with said "},{"type":"element","tag":"a","props":{"href":"https://www.typescriptlang.org/docs/handbook/declaration-merging.html#module-augmentation","rel":["nofollow"]},"children":[{"type":"text","value":"module augmentation"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"// fancyThings.ts\nimport { Sample } from \"./Sample\";\n\ndeclare module \"./Sample\" {\n interface Sample {\n doFancyThings: () => void;\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// fancyThings.ts\nimport { Sample } from \"./Sample\";\n\ndeclare module \"./Sample\" {\n interface Sample {\n doFancyThings: () => void;\n }\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Now you can call "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"sample.doFancyThings()"}]},{"type":"text","value":" by importing both "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".ts"}]},{"type":"text","value":" files:"}]},{"type":"element","tag":"code","props":{"code":"import { Sample } from \"./sample\";\nimport \"./fancyThings\";\n\nconst sample = new Sample();\nsample.doFancyThings(); // ok\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { Sample } from \"./sample\";\nimport \"./fancyThings\";\n\nconst sample = new Sample();\nsample.doFancyThings(); // ok\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This example is useful for "},{"type":"element","tag":"a","props":{"href":"./Frontend/Vue/Adding%20global%20properties%20to%20component"},"children":[{"type":"text","value":"adding global properties to component"}]},{"type":"text","value":" in vue.js."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you want to add global variable to your "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window"}]},{"type":"text","value":". That thing's called "},{"type":"element","tag":"a","props":{"href":"https://www.typescriptlang.org/docs/handbook/declaration-merging.html#global-augmentation","rel":["nofollow"]},"children":[{"type":"text","value":"global module augmentation"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say you need to call "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.doFancyThings()"}]},{"type":"text","value":". For that you should augment global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window"}]},{"type":"text","value":" interface in "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"*.d.ts"}]},{"type":"text","value":" file:"}]},{"type":"element","tag":"code","props":{"code":"declare global {\n interface Window {\n doFancyThings: () => void;\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ddb5db"},"children":[{"type":"text","value":"declare"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-967933"},"children":[{"type":"text","value":"global"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ddb5db"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-480aec"},"children":[{"type":"text","value":"Window"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1694ff"},"children":[{"type":"text","value":"doFancyThings"}]},{"type":"element","tag":"span","props":{"class":"ct-06c8c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-ddb5db"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56b99e"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is useful for declaring global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.ethereum"}]},{"type":"text","value":" (or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"window.web3"}]},{"type":"text","value":") in "},{"type":"element","tag":"a","props":{"href":"/blockchain/Common%20typescript%20examples"},"children":[{"type":"text","value":"blockchain"}]},{"type":"text","value":" projects with typescript, which use wallet browser extensions."}]},{"type":"element","tag":"h2","props":{"id":"augmenting-existing-interface"},"children":[{"type":"text","value":"Augmenting existing interface"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For example, you have class "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Sample"}]},{"type":"text","value":" without any functionality:"}]},{"type":"element","tag":"code","props":{"code":"// Sample.ts\n\nexport class Sample {\n // nothing :-)\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-24091c"},"children":[{"type":"text","value":"// Sample.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-06c8c8"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ddb5db"},"children":[{"type":"text","value":"class"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-480aec"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-24091c"},"children":[{"type":"text","value":"// nothing :-)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then you want extend it with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"doFancyThings()"}]},{"type":"text","value":" method. That can be achieved with said "},{"type":"element","tag":"a","props":{"href":"https://www.typescriptlang.org/docs/handbook/declaration-merging.html#module-augmentation","rel":["nofollow"]},"children":[{"type":"text","value":"module augmentation"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"// fancyThings.ts\nimport { Sample } from \"./Sample\";\n\ndeclare module \"./Sample\" {\n interface Sample {\n doFancyThings: () => void;\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-24091c"},"children":[{"type":"text","value":"// fancyThings.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-06c8c8"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-967933"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-06c8c8"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-174796"},"children":[{"type":"text","value":"\"./Sample\""}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ddb5db"},"children":[{"type":"text","value":"declare"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ddb5db"},"children":[{"type":"text","value":"module"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-174796"},"children":[{"type":"text","value":"\"./Sample\""}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ddb5db"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-480aec"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1694ff"},"children":[{"type":"text","value":"doFancyThings"}]},{"type":"element","tag":"span","props":{"class":"ct-06c8c8"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-ddb5db"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56b99e"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Now you can call "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"sample.doFancyThings()"}]},{"type":"text","value":" by importing both "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".ts"}]},{"type":"text","value":" files:"}]},{"type":"element","tag":"code","props":{"code":"import { Sample } from \"./sample\";\nimport \"./fancyThings\";\n\nconst sample = new Sample();\nsample.doFancyThings(); // ok\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-06c8c8"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-967933"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-06c8c8"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-174796"},"children":[{"type":"text","value":"\"./sample\""}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-06c8c8"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-174796"},"children":[{"type":"text","value":"\"./fancyThings\""}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ddb5db"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2c62ce"},"children":[{"type":"text","value":"sample"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06c8c8"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06c8c8"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1694ff"},"children":[{"type":"text","value":"Sample"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-967933"},"children":[{"type":"text","value":"sample"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-1694ff"},"children":[{"type":"text","value":"doFancyThings"}]},{"type":"element","tag":"span","props":{"class":"ct-b07aa9"},"children":[{"type":"text","value":"(); "}]},{"type":"element","tag":"span","props":{"class":"ct-24091c"},"children":[{"type":"text","value":"// ok"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This example is useful for "},{"type":"element","tag":"a","props":{"href":"./Frontend/Vue/Adding%20global%20properties%20to%20component"},"children":[{"type":"text","value":"adding global properties to component"}]},{"type":"text","value":" in vue.js."}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-2c62ce{color:#79C0FF}.ct-174796{color:#A5D6FF}.ct-24091c{color:#8B949E}.ct-56b99e{color:#79C0FF}.ct-06c8c8{color:#FF7B72}.ct-1694ff{color:#D2A8FF}.ct-480aec{color:#FFA657}.ct-967933{color:#C9D1D9}.ct-b07aa9{color:#C9D1D9}.ct-ddb5db{color:#FF7B72}.light .ct-ddb5db{color:#073642}.light .ct-b07aa9{color:#657B83}.light .ct-967933{color:#268BD2}.light .ct-480aec{color:#268BD2}.light .ct-1694ff{color:#268BD2}.light .ct-06c8c8{color:#859900}.light .ct-56b99e{color:#859900}.light .ct-24091c{color:#93A1A1}.light .ct-174796{color:#2AA198}.light .ct-2c62ce{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"augmenting-existing-interface","depth":2,"text":"Augmenting existing interface"}]}},"_type":"markdown","_id":"content:Typescript:Add global variable to window.md","_source":"content","_file":"Typescript/Add global variable to window.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/FVXoGazg6u.json b/docs/api/_content/query/FVXoGazg6u.json index 58a670b..04f1990 100644 --- a/docs/api/_content/query/FVXoGazg6u.json +++ b/docs/api/_content/query/FVXoGazg6u.json @@ -1 +1 @@ -{"_path":"/linux/find-out-who-uses-swap","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Find Out Who Uses Swap","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"code","props":{"code":"for file in /proc/*/status ; do awk '/VmSwap|Name/{printf $2 \" \" $3}END{ print \"\"}' $file; done | sort -k 2 -n -r | less\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"for file in /proc/*/status ; do awk '/VmSwap|Name/{printf $2 \" \" $3}END{ print \"\"}' $file; done | sort -k 2 -n -r | less\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"code","props":{"code":"for file in /proc/*/status ; do awk '/VmSwap|Name/{printf $2 \" \" $3}END{ print \"\"}' $file; done | sort -k 2 -n -r | less\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c4cc87"},"children":[{"type":"text","value":"for"}]},{"type":"element","tag":"span","props":{"class":"ct-6e3e30"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d057a0"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-6e3e30"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c4cc87"},"children":[{"type":"text","value":"in"}]},{"type":"element","tag":"span","props":{"class":"ct-6e3e30"},"children":[{"type":"text","value":" /proc/"}]},{"type":"element","tag":"span","props":{"class":"ct-c4cc87"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-6e3e30"},"children":[{"type":"text","value":"/status "}]},{"type":"element","tag":"span","props":{"class":"ct-c4cc87"},"children":[{"type":"text","value":";"}]},{"type":"element","tag":"span","props":{"class":"ct-6e3e30"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c4cc87"},"children":[{"type":"text","value":"do"}]},{"type":"element","tag":"span","props":{"class":"ct-6e3e30"},"children":[{"type":"text","value":" awk "}]},{"type":"element","tag":"span","props":{"class":"ct-bfbbb0"},"children":[{"type":"text","value":"'/VmSwap|Name/{printf $2 \" \" $3}END{ print \"\"}'"}]},{"type":"element","tag":"span","props":{"class":"ct-6e3e30"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c4cc87"},"children":[{"type":"text","value":"done"}]},{"type":"element","tag":"span","props":{"class":"ct-6e3e30"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c4cc87"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-6e3e30"},"children":[{"type":"text","value":" sort -k 2 -n -r "}]},{"type":"element","tag":"span","props":{"class":"ct-c4cc87"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-6e3e30"},"children":[{"type":"text","value":" less"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-bfbbb0{color:#A5D6FF}.ct-d057a0{color:#C9D1D9}.ct-6e3e30{color:#C9D1D9}.ct-c4cc87{color:#FF7B72}.light .ct-c4cc87{color:#859900}.light .ct-6e3e30{color:#657B83}.light .ct-d057a0{color:#268BD2}.light .ct-bfbbb0{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Linux:Find out who uses swap.md","_source":"content","_file":"Linux/Find out who uses swap.md","_extension":"md"} \ No newline at end of file +{"_path":"/linux/find-out-who-uses-swap","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Find Out Who Uses Swap","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"code","props":{"code":"for file in /proc/*/status ; do awk '/VmSwap|Name/{printf $2 \" \" $3}END{ print \"\"}' $file; done | sort -k 2 -n -r | less\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"for file in /proc/*/status ; do awk '/VmSwap|Name/{printf $2 \" \" $3}END{ print \"\"}' $file; done | sort -k 2 -n -r | less\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"code","props":{"code":"for file in /proc/*/status ; do awk '/VmSwap|Name/{printf $2 \" \" $3}END{ print \"\"}' $file; done | sort -k 2 -n -r | less\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-444031"},"children":[{"type":"text","value":"for"}]},{"type":"element","tag":"span","props":{"class":"ct-e0d9a3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-83057a"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-e0d9a3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-444031"},"children":[{"type":"text","value":"in"}]},{"type":"element","tag":"span","props":{"class":"ct-e0d9a3"},"children":[{"type":"text","value":" /proc/"}]},{"type":"element","tag":"span","props":{"class":"ct-444031"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-e0d9a3"},"children":[{"type":"text","value":"/status "}]},{"type":"element","tag":"span","props":{"class":"ct-444031"},"children":[{"type":"text","value":";"}]},{"type":"element","tag":"span","props":{"class":"ct-e0d9a3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-444031"},"children":[{"type":"text","value":"do"}]},{"type":"element","tag":"span","props":{"class":"ct-e0d9a3"},"children":[{"type":"text","value":" awk "}]},{"type":"element","tag":"span","props":{"class":"ct-9a56ef"},"children":[{"type":"text","value":"'/VmSwap|Name/{printf $2 \" \" $3}END{ print \"\"}'"}]},{"type":"element","tag":"span","props":{"class":"ct-e0d9a3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-444031"},"children":[{"type":"text","value":"done"}]},{"type":"element","tag":"span","props":{"class":"ct-e0d9a3"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-444031"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-e0d9a3"},"children":[{"type":"text","value":" sort -k 2 -n -r "}]},{"type":"element","tag":"span","props":{"class":"ct-444031"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-e0d9a3"},"children":[{"type":"text","value":" less"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-9a56ef{color:#A5D6FF}.ct-83057a{color:#C9D1D9}.ct-e0d9a3{color:#C9D1D9}.ct-444031{color:#FF7B72}.light .ct-444031{color:#859900}.light .ct-e0d9a3{color:#657B83}.light .ct-83057a{color:#268BD2}.light .ct-9a56ef{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Linux:Find out who uses swap.md","_source":"content","_file":"Linux/Find out who uses swap.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/KIXVn92YTN.json b/docs/api/_content/query/KIXVn92YTN.json index c2840fd..2b1580b 100644 --- a/docs/api/_content/query/KIXVn92YTN.json +++ b/docs/api/_content/query/KIXVn92YTN.json @@ -1 +1 @@ -{"_path":"/frontend/react/axios-refresh-token-on-react","_dir":"react","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Axios Refresh Token On React","description":" component, that will handle token refresh if needed. Refresh function should, probably, be passed through component props.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":""}]},{"type":"text","value":" component, that will handle token refresh if needed. Refresh function should, probably, be passed through component props."}]},{"type":"element","tag":"code","props":{"code":"import axios from \"axios\";\nimport React, {\n createContext,\n FC,\n PropsWithChildren,\n useCallback,\n useContext,\n useEffect,\n useRef,\n} from \"react\";\n\ninterface APIProviderProps extends PropsWithChildren {\n tokens: {\n access: string;\n refresh: string;\n };\n logout: () => void;\n}\n\nconst APIContext = createContext({\n client: axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n }),\n});\n\nconst APIProvider: FC = ({ \n tokens, \n logout, \n children,\n}) => {\n const client = useRef(\n axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n })\n ).current;\n\n const refreshTokens = useCallback<() => string>(() => {\n // TODO: implement me\n throw new Error(\"not implemented\");\n }, []);\n\n useEffect(() => {\n if (!tokens.access) {\n return;\n }\n\n // append `access` token to all requests\n const req = client.interceptors.request.use(\n async (config) => {\n config.headers = {\n Authorization: `Bearer ${tokens.access}`,\n };\n return config;\n },\n (error) => {\n Promise.reject(error);\n }\n );\n\n // refreshing interceptor\n const resp = client.interceptors.response.use(\n (response) => {\n return response;\n },\n async function (error) {\n const originalRequest = error.config;\n\n if (error.response.status === 401 && !originalRequest._retry) {\n originalRequest._retry = true;\n\n const newToken = refreshTokens;\n\n return axios({\n ...originalRequest,\n headers: {\n ...originalRequest.headers,\n Authorization: \"Bearer \" + newToken,\n },\n });\n }\n\n logout();\n return Promise.reject(error);\n }\n );\n\n return () => {\n axios.interceptors.request.eject(req);\n axios.interceptors.request.eject(resp);\n };\n }, [client, tokens.access, tokens.refresh, refreshTokens, logout]);\n\n return (\n \n {children}\n \n );\n};\n\nexport const useAPI = () => useContext(APIContext).client;\n\nexport { APIProvider };\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import axios from \"axios\";\nimport React, {\n createContext,\n FC,\n PropsWithChildren,\n useCallback,\n useContext,\n useEffect,\n useRef,\n} from \"react\";\n\ninterface APIProviderProps extends PropsWithChildren {\n tokens: {\n access: string;\n refresh: string;\n };\n logout: () => void;\n}\n\nconst APIContext = createContext({\n client: axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n }),\n});\n\nconst APIProvider: FC = ({ \n tokens, \n logout, \n children,\n}) => {\n const client = useRef(\n axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n })\n ).current;\n\n const refreshTokens = useCallback<() => string>(() => {\n // TODO: implement me\n throw new Error(\"not implemented\");\n }, []);\n\n useEffect(() => {\n if (!tokens.access) {\n return;\n }\n\n // append `access` token to all requests\n const req = client.interceptors.request.use(\n async (config) => {\n config.headers = {\n Authorization: `Bearer ${tokens.access}`,\n };\n return config;\n },\n (error) => {\n Promise.reject(error);\n }\n );\n\n // refreshing interceptor\n const resp = client.interceptors.response.use(\n (response) => {\n return response;\n },\n async function (error) {\n const originalRequest = error.config;\n\n if (error.response.status === 401 && !originalRequest._retry) {\n originalRequest._retry = true;\n\n const newToken = refreshTokens;\n\n return axios({\n ...originalRequest,\n headers: {\n ...originalRequest.headers,\n Authorization: \"Bearer \" + newToken,\n },\n });\n }\n\n logout();\n return Promise.reject(error);\n }\n );\n\n return () => {\n axios.interceptors.request.eject(req);\n axios.interceptors.request.eject(resp);\n };\n }, [client, tokens.access, tokens.refresh, refreshTokens, logout]);\n\n return (\n \n {children}\n \n );\n};\n\nexport const useAPI = () => useContext(APIContext).client;\n\nexport { APIProvider };\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":""}]},{"type":"text","value":" component, that will handle token refresh if needed. Refresh function should, probably, be passed through component props."}]},{"type":"element","tag":"code","props":{"code":"import axios from \"axios\";\nimport React, {\n createContext,\n FC,\n PropsWithChildren,\n useCallback,\n useContext,\n useEffect,\n useRef,\n} from \"react\";\n\ninterface APIProviderProps extends PropsWithChildren {\n tokens: {\n access: string;\n refresh: string;\n };\n logout: () => void;\n}\n\nconst APIContext = createContext({\n client: axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n }),\n});\n\nconst APIProvider: FC = ({ \n tokens, \n logout, \n children,\n}) => {\n const client = useRef(\n axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n })\n ).current;\n\n const refreshTokens = useCallback<() => string>(() => {\n // TODO: implement me\n throw new Error(\"not implemented\");\n }, []);\n\n useEffect(() => {\n if (!tokens.access) {\n return;\n }\n\n // append `access` token to all requests\n const req = client.interceptors.request.use(\n async (config) => {\n config.headers = {\n Authorization: `Bearer ${tokens.access}`,\n };\n return config;\n },\n (error) => {\n Promise.reject(error);\n }\n );\n\n // refreshing interceptor\n const resp = client.interceptors.response.use(\n (response) => {\n return response;\n },\n async function (error) {\n const originalRequest = error.config;\n\n if (error.response.status === 401 && !originalRequest._retry) {\n originalRequest._retry = true;\n\n const newToken = refreshTokens;\n\n return axios({\n ...originalRequest,\n headers: {\n ...originalRequest.headers,\n Authorization: \"Bearer \" + newToken,\n },\n });\n }\n\n logout();\n return Promise.reject(error);\n }\n );\n\n return () => {\n axios.interceptors.request.eject(req);\n axios.interceptors.request.eject(resp);\n };\n }, [client, tokens.access, tokens.refresh, refreshTokens, logout]);\n\n return (\n \n {children}\n \n );\n};\n\nexport const useAPI = () => useContext(APIContext).client;\n\nexport { APIProvider };\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7514a2"},"children":[{"type":"text","value":"\"axios\""}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"React"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"createContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"FC"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"PropsWithChildren"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"useContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"} "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7514a2"},"children":[{"type":"text","value":"\"react\""}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-44620b"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e481b8"},"children":[{"type":"text","value":"APIProviderProps"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-44620b"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-780082"},"children":[{"type":"text","value":"PropsWithChildren"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a371f4"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-3caf7d"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a371f4"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-3caf7d"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4aa59b"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a371f4"},"children":[{"type":"text","value":"refresh"}]},{"type":"element","tag":"span","props":{"class":"ct-3caf7d"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4aa59b"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e9f818"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4226d5"},"children":[{"type":"text","value":"APIContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"createContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" client: "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"create"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" baseURL: "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"process"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"env"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-4226d5"},"children":[{"type":"text","value":"NEXT_PUBLIC_API_ENDPOINT"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"});"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"APIProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c99834"},"children":[{"type":"text","value":"FC"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-c99834"},"children":[{"type":"text","value":"APIProviderProps"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" ({ "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"children"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"}) "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4226d5"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"create"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" baseURL: "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"process"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"env"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-4226d5"},"children":[{"type":"text","value":"NEXT_PUBLIC_API_ENDPOINT"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" )."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4226d5"},"children":[{"type":"text","value":"refreshTokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"<() "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e9f818"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":">(() "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5a9ff7"},"children":[{"type":"text","value":"// TODO: implement me"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e9f818"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7514a2"},"children":[{"type":"text","value":"\"not implemented\""}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" }, []);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5a9ff7"},"children":[{"type":"text","value":"// append `access` token to all requests"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4226d5"},"children":[{"type":"text","value":"req"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"use"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-44620b"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-a371f4"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-44620b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" Authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-7514a2"},"children":[{"type":"text","value":"`Bearer ${"}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-4724b7"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-7514a2"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-a371f4"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-44620b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e9f818"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5a9ff7"},"children":[{"type":"text","value":"// refreshing interceptor"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4226d5"},"children":[{"type":"text","value":"resp"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"use"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-a371f4"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-44620b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-44620b"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-44620b"},"children":[{"type":"text","value":"function"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-a371f4"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4226d5"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"status"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf9447"},"children":[{"type":"text","value":"401"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"_retry"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"_retry"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-292051"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4226d5"},"children":[{"type":"text","value":"newToken"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"refreshTokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" Authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-7514a2"},"children":[{"type":"text","value":"\"Bearer \""}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"newToken"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e9f818"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"eject"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"req"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"eject"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"resp"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" }, ["}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"refresh"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"refreshTokens"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"]);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"APIContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"Provider"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"{{ "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" }}"}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":">"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":" {"}]},{"type":"element","tag":"span","props":{"class":"ct-a371f4"},"children":[{"type":"text","value":"children"}]},{"type":"element","tag":"span","props":{"class":"ct-836525"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"useAPI"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-451a9f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d6c589"},"children":[{"type":"text","value":"useContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"APIContext"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d1490f"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-da557f"},"children":[{"type":"text","value":"APIProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-ec59ec"},"children":[{"type":"text","value":" };"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-292051{color:#79C0FF}.ct-cf9447{color:#79C0FF}.ct-4724b7{color:#A5D6FF}.ct-5a9ff7{color:#8B949E}.ct-c99834{color:#FFA657}.ct-4226d5{color:#79C0FF}.ct-e9f818{color:#79C0FF}.ct-451a9f{color:#FF7B72}.ct-d6c589{color:#D2A8FF}.ct-4aa59b{color:#79C0FF}.ct-3caf7d{color:#FF7B72}.ct-a371f4{color:#FFA657}.ct-780082{color:#79C0FF}.ct-e481b8{color:#FFA657}.ct-836525{color:#C9D1D9}.ct-44620b{color:#FF7B72}.ct-7514a2{color:#A5D6FF}.ct-da557f{color:#C9D1D9}.ct-ec59ec{color:#C9D1D9}.ct-d1490f{color:#FF7B72}.light .ct-d1490f{color:#859900}.light .ct-ec59ec{color:#657B83}.light .ct-da557f{color:#268BD2}.light .ct-7514a2{color:#2AA198}.light .ct-44620b{color:#073642}.light .ct-836525{color:#657B83}.light .ct-e481b8{color:#268BD2}.light .ct-780082{color:#657B83}.light .ct-a371f4{color:#657B83}.light .ct-3caf7d{color:#859900}.light .ct-4aa59b{color:#859900}.light .ct-d6c589{color:#268BD2}.light .ct-451a9f{color:#073642}.light .ct-e9f818{color:#859900}.light .ct-4226d5{color:#268BD2}.light .ct-c99834{color:#268BD2}.light .ct-5a9ff7{color:#93A1A1}.light .ct-4724b7{color:#657B83}.light .ct-cf9447{color:#D33682}.light .ct-292051{color:#B58900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:React:Axios refresh token on React.md","_source":"content","_file":"Frontend/React/Axios refresh token on React.md","_extension":"md"} \ No newline at end of file +{"_path":"/frontend/react/axios-refresh-token-on-react","_dir":"react","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Axios Refresh Token On React","description":" component, that will handle token refresh if needed. Refresh function should, probably, be passed through component props.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":""}]},{"type":"text","value":" component, that will handle token refresh if needed. Refresh function should, probably, be passed through component props."}]},{"type":"element","tag":"code","props":{"code":"import axios from \"axios\";\nimport React, {\n createContext,\n FC,\n PropsWithChildren,\n useCallback,\n useContext,\n useEffect,\n useRef,\n} from \"react\";\n\ninterface APIProviderProps extends PropsWithChildren {\n tokens: {\n access: string;\n refresh: string;\n };\n logout: () => void;\n}\n\nconst APIContext = createContext({\n client: axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n }),\n});\n\nconst APIProvider: FC = ({ \n tokens, \n logout, \n children,\n}) => {\n const client = useRef(\n axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n })\n ).current;\n\n const refreshTokens = useCallback<() => string>(() => {\n // TODO: implement me\n throw new Error(\"not implemented\");\n }, []);\n\n useEffect(() => {\n if (!tokens.access) {\n return;\n }\n\n // append `access` token to all requests\n const req = client.interceptors.request.use(\n async (config) => {\n config.headers = {\n Authorization: `Bearer ${tokens.access}`,\n };\n return config;\n },\n (error) => {\n Promise.reject(error);\n }\n );\n\n // refreshing interceptor\n const resp = client.interceptors.response.use(\n (response) => {\n return response;\n },\n async function (error) {\n const originalRequest = error.config;\n\n if (error.response.status === 401 && !originalRequest._retry) {\n originalRequest._retry = true;\n\n const newToken = refreshTokens;\n\n return axios({\n ...originalRequest,\n headers: {\n ...originalRequest.headers,\n Authorization: \"Bearer \" + newToken,\n },\n });\n }\n\n logout();\n return Promise.reject(error);\n }\n );\n\n return () => {\n axios.interceptors.request.eject(req);\n axios.interceptors.request.eject(resp);\n };\n }, [client, tokens.access, tokens.refresh, refreshTokens, logout]);\n\n return (\n \n {children}\n \n );\n};\n\nexport const useAPI = () => useContext(APIContext).client;\n\nexport { APIProvider };\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import axios from \"axios\";\nimport React, {\n createContext,\n FC,\n PropsWithChildren,\n useCallback,\n useContext,\n useEffect,\n useRef,\n} from \"react\";\n\ninterface APIProviderProps extends PropsWithChildren {\n tokens: {\n access: string;\n refresh: string;\n };\n logout: () => void;\n}\n\nconst APIContext = createContext({\n client: axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n }),\n});\n\nconst APIProvider: FC = ({ \n tokens, \n logout, \n children,\n}) => {\n const client = useRef(\n axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n })\n ).current;\n\n const refreshTokens = useCallback<() => string>(() => {\n // TODO: implement me\n throw new Error(\"not implemented\");\n }, []);\n\n useEffect(() => {\n if (!tokens.access) {\n return;\n }\n\n // append `access` token to all requests\n const req = client.interceptors.request.use(\n async (config) => {\n config.headers = {\n Authorization: `Bearer ${tokens.access}`,\n };\n return config;\n },\n (error) => {\n Promise.reject(error);\n }\n );\n\n // refreshing interceptor\n const resp = client.interceptors.response.use(\n (response) => {\n return response;\n },\n async function (error) {\n const originalRequest = error.config;\n\n if (error.response.status === 401 && !originalRequest._retry) {\n originalRequest._retry = true;\n\n const newToken = refreshTokens;\n\n return axios({\n ...originalRequest,\n headers: {\n ...originalRequest.headers,\n Authorization: \"Bearer \" + newToken,\n },\n });\n }\n\n logout();\n return Promise.reject(error);\n }\n );\n\n return () => {\n axios.interceptors.request.eject(req);\n axios.interceptors.request.eject(resp);\n };\n }, [client, tokens.access, tokens.refresh, refreshTokens, logout]);\n\n return (\n \n {children}\n \n );\n};\n\nexport const useAPI = () => useContext(APIContext).client;\n\nexport { APIProvider };\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":""}]},{"type":"text","value":" component, that will handle token refresh if needed. Refresh function should, probably, be passed through component props."}]},{"type":"element","tag":"code","props":{"code":"import axios from \"axios\";\nimport React, {\n createContext,\n FC,\n PropsWithChildren,\n useCallback,\n useContext,\n useEffect,\n useRef,\n} from \"react\";\n\ninterface APIProviderProps extends PropsWithChildren {\n tokens: {\n access: string;\n refresh: string;\n };\n logout: () => void;\n}\n\nconst APIContext = createContext({\n client: axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n }),\n});\n\nconst APIProvider: FC = ({ \n tokens, \n logout, \n children,\n}) => {\n const client = useRef(\n axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n })\n ).current;\n\n const refreshTokens = useCallback<() => string>(() => {\n // TODO: implement me\n throw new Error(\"not implemented\");\n }, []);\n\n useEffect(() => {\n if (!tokens.access) {\n return;\n }\n\n // append `access` token to all requests\n const req = client.interceptors.request.use(\n async (config) => {\n config.headers = {\n Authorization: `Bearer ${tokens.access}`,\n };\n return config;\n },\n (error) => {\n Promise.reject(error);\n }\n );\n\n // refreshing interceptor\n const resp = client.interceptors.response.use(\n (response) => {\n return response;\n },\n async function (error) {\n const originalRequest = error.config;\n\n if (error.response.status === 401 && !originalRequest._retry) {\n originalRequest._retry = true;\n\n const newToken = refreshTokens;\n\n return axios({\n ...originalRequest,\n headers: {\n ...originalRequest.headers,\n Authorization: \"Bearer \" + newToken,\n },\n });\n }\n\n logout();\n return Promise.reject(error);\n }\n );\n\n return () => {\n axios.interceptors.request.eject(req);\n axios.interceptors.request.eject(resp);\n };\n }, [client, tokens.access, tokens.refresh, refreshTokens, logout]);\n\n return (\n \n {children}\n \n );\n};\n\nexport const useAPI = () => useContext(APIContext).client;\n\nexport { APIProvider };\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b5f116"},"children":[{"type":"text","value":"\"axios\""}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"React"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"createContext"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"FC"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"PropsWithChildren"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"useContext"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"} "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b5f116"},"children":[{"type":"text","value":"\"react\""}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-30e61a"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b2c705"},"children":[{"type":"text","value":"APIProviderProps"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-30e61a"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-855152"},"children":[{"type":"text","value":"PropsWithChildren"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9edd0f"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-7ae1e4"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9edd0f"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-7ae1e4"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c11ef6"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9edd0f"},"children":[{"type":"text","value":"refresh"}]},{"type":"element","tag":"span","props":{"class":"ct-7ae1e4"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c11ef6"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a583ad"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-58393f"},"children":[{"type":"text","value":"APIContext"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"createContext"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" client: "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"create"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" baseURL: "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"process"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"env"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-58393f"},"children":[{"type":"text","value":"NEXT_PUBLIC_API_ENDPOINT"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"});"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"APIProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b2d63"},"children":[{"type":"text","value":"FC"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-6b2d63"},"children":[{"type":"text","value":"APIProviderProps"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" ({ "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"children"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"}) "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-58393f"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"create"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" baseURL: "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"process"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"env"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-58393f"},"children":[{"type":"text","value":"NEXT_PUBLIC_API_ENDPOINT"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" )."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-58393f"},"children":[{"type":"text","value":"refreshTokens"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"<() "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a583ad"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":">(() "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-135b0e"},"children":[{"type":"text","value":"// TODO: implement me"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a583ad"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b5f116"},"children":[{"type":"text","value":"\"not implemented\""}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" }, []);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-135b0e"},"children":[{"type":"text","value":"// append `access` token to all requests"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-58393f"},"children":[{"type":"text","value":"req"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"use"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-30e61a"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-9edd0f"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-30e61a"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" Authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-b5f116"},"children":[{"type":"text","value":"`Bearer ${"}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-728c60"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-b5f116"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-9edd0f"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-30e61a"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a583ad"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-135b0e"},"children":[{"type":"text","value":"// refreshing interceptor"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-58393f"},"children":[{"type":"text","value":"resp"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"use"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-9edd0f"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-30e61a"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-30e61a"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-30e61a"},"children":[{"type":"text","value":"function"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-9edd0f"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-58393f"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"config"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"status"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5a5940"},"children":[{"type":"text","value":"401"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"_retry"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"_retry"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-353674"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-58393f"},"children":[{"type":"text","value":"newToken"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"refreshTokens"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"originalRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" Authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-b5f116"},"children":[{"type":"text","value":"\"Bearer \""}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"newToken"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a583ad"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"eject"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"req"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"interceptors"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"eject"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"resp"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" }, ["}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"access"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"refresh"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"refreshTokens"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"]);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"APIContext"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"Provider"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"{{ "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" }}"}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":">"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":" {"}]},{"type":"element","tag":"span","props":{"class":"ct-9edd0f"},"children":[{"type":"text","value":"children"}]},{"type":"element","tag":"span","props":{"class":"ct-50c2af"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"useAPI"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-07feb9"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-21d2db"},"children":[{"type":"text","value":"useContext"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"APIContext"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-65a859"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-90fb8b"},"children":[{"type":"text","value":"APIProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-1c1ddb"},"children":[{"type":"text","value":" };"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-353674{color:#79C0FF}.ct-5a5940{color:#79C0FF}.ct-728c60{color:#A5D6FF}.ct-135b0e{color:#8B949E}.ct-6b2d63{color:#FFA657}.ct-58393f{color:#79C0FF}.ct-a583ad{color:#79C0FF}.ct-07feb9{color:#FF7B72}.ct-21d2db{color:#D2A8FF}.ct-c11ef6{color:#79C0FF}.ct-7ae1e4{color:#FF7B72}.ct-9edd0f{color:#FFA657}.ct-855152{color:#79C0FF}.ct-b2c705{color:#FFA657}.ct-50c2af{color:#C9D1D9}.ct-30e61a{color:#FF7B72}.ct-b5f116{color:#A5D6FF}.ct-90fb8b{color:#C9D1D9}.ct-1c1ddb{color:#C9D1D9}.ct-65a859{color:#FF7B72}.light .ct-65a859{color:#859900}.light .ct-1c1ddb{color:#657B83}.light .ct-90fb8b{color:#268BD2}.light .ct-b5f116{color:#2AA198}.light .ct-30e61a{color:#073642}.light .ct-50c2af{color:#657B83}.light .ct-b2c705{color:#268BD2}.light .ct-855152{color:#657B83}.light .ct-9edd0f{color:#657B83}.light .ct-7ae1e4{color:#859900}.light .ct-c11ef6{color:#859900}.light .ct-21d2db{color:#268BD2}.light .ct-07feb9{color:#073642}.light .ct-a583ad{color:#859900}.light .ct-58393f{color:#268BD2}.light .ct-6b2d63{color:#268BD2}.light .ct-135b0e{color:#93A1A1}.light .ct-728c60{color:#657B83}.light .ct-5a5940{color:#D33682}.light .ct-353674{color:#B58900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:React:Axios refresh token on React.md","_source":"content","_file":"Frontend/React/Axios refresh token on React.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/LKdFxpydAG.json b/docs/api/_content/query/LKdFxpydAG.json index 9e1c4f8..33ff2d9 100644 --- a/docs/api/_content/query/LKdFxpydAG.json +++ b/docs/api/_content/query/LKdFxpydAG.json @@ -1 +1 @@ -{"_path":"/sql/postgress-setup","_dir":"sql","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Postgress Setup","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"install-postgresql-12-on-ubuntu-2004-lts"},"children":[{"type":"text","value":"Install PostgreSQL 12 on Ubuntu 20.04 LTS"}]},{"type":"element","tag":"code","props":{"code":"sudo apt update\nsudo apt install -y postgresql postgresql-contrib postgresql-client\nsudo systemctl status postgresql.service\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"sudo apt update\nsudo apt install -y postgresql postgresql-contrib postgresql-client\nsudo systemctl status postgresql.service\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"initial-database-connection"},"children":[{"type":"text","value":"Initial database connection"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A local connection (from the database server) can be done by the following command:"}]},{"type":"element","tag":"code","props":{"code":"sudo -u postgres psql\n\npsql (12.12 (Ubuntu 12.12-0ubuntu0.20.04.1))\nType \"help\" for help.\n\npostgres=#\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"sudo -u postgres psql\n\npsql (12.12 (Ubuntu 12.12-0ubuntu0.20.04.1))\nType \"help\" for help.\n\npostgres=#\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"set-password-for-postgres-database-user"},"children":[{"type":"text","value":"Set password for postgres database user"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The password for the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" database user can be set the the quick command "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"\\password"}]},{"type":"text","value":"\nor by "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"alter user postgres password 'Supersecret'"}]},{"type":"text","value":". A connection using the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" user\nis still not possible from the \"outside\" hence to the default settings in the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"pg_hba.conf"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h3","props":{"id":"update-pg_hbaconf-to-allow-postgres-user-connections-with-password"},"children":[{"type":"text","value":"Update pg_hba.conf to allow postgres user connections with password"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"In order to allow connections of the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" database user not using OS user\nauthentication, you have to update the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"pg_hba.conf"}]},{"type":"text","value":" which can be found under\n"},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/postgresql/12/main/pg_hba.conf"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"sudo vi /etc/postgresql/12/main/pg_hba.conf\n\n...\nlocal all postgres peer\n...\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"sudo vi /etc/postgresql/12/main/pg_hba.conf\n\n...\nlocal all postgres peer\n...\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change the last section of the above line to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"md5"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"local all postgres md5\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"local all postgres md5\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A restart is required in order to apply the new configuration:"}]},{"type":"element","tag":"code","props":{"code":"sudo systemctl restart postgresql\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"sudo systemctl restart postgresql\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Now a connection from outside the database host is possible e.g."}]},{"type":"element","tag":"code","props":{"code":"psql -U postgres -d postgres -h databasehostname\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"psql -U postgres -d postgres -h databasehostname\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"creation-of-additional-database-users"},"children":[{"type":"text","value":"Creation of additional database users"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A database user can be created by the following command:"}]},{"type":"element","tag":"code","props":{"code":"create user myuser with encrypted password 'Supersecret';\nCREATE ROLE\n\npostgres=# \\du\n List of roles\n Role name | Attributes | Member of\n-----------+------------------------------------------------------------+-----------\n myuser | | {}\n postgres | Superuser, Create role, Create DB, Replication, Bypass RLS | {}\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"create user myuser with encrypted password 'Supersecret';\nCREATE ROLE\n\npostgres=# \\du\n List of roles\n Role name | Attributes | Member of\n-----------+------------------------------------------------------------+-----------\n myuser | | {}\n postgres | Superuser, Create role, Create DB, Replication, Bypass RLS | {}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"creation-of-additional-databases"},"children":[{"type":"text","value":"Creation of additional databases"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"One can create new Postgres databases within an instance. Therefore you can use the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"psql"}]},{"type":"text","value":"\ncommand to login (see above)."}]},{"type":"element","tag":"code","props":{"code":"CREATE DATABASE dbname OWNER myuser;\nCREATE DATABASE\n\npostgres=# \\l\n List of databases\n Name | Owner | Encoding | Collate | Ctype | Access privileges\n-----------+----------+----------+-------------+-------------+-----------------------\n dbname | myuser | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n postgres | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n template0 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n template1 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"CREATE DATABASE dbname OWNER myuser;\nCREATE DATABASE\n\npostgres=# \\l\n List of databases\n Name | Owner | Encoding | Collate | Ctype | Access privileges\n-----------+----------+----------+-------------+-------------+-----------------------\n dbname | myuser | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n postgres | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n template0 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n template1 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You can leave the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"OWNER"}]},{"type":"text","value":" section of the command, when doing so, the current user will become\nowner of the newly created database."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To change the owner of an existing database later, you can use the following command:"}]},{"type":"element","tag":"code","props":{"code":"postgres=# alter database dbname owner to myuser;\nALTER DATABASE\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"postgres=# alter database dbname owner to myuser;\nALTER DATABASE\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"install-postgresql-12-on-ubuntu-2004-lts"},"children":[{"type":"text","value":"Install PostgreSQL 12 on Ubuntu 20.04 LTS"}]},{"type":"element","tag":"code","props":{"code":"sudo apt update\nsudo apt install -y postgresql postgresql-contrib postgresql-client\nsudo systemctl status postgresql.service\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"sudo apt update"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"sudo apt install -y postgresql postgresql-contrib postgresql-client"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"sudo systemctl status postgresql.service"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"initial-database-connection"},"children":[{"type":"text","value":"Initial database connection"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A local connection (from the database server) can be done by the following command:"}]},{"type":"element","tag":"code","props":{"code":"sudo -u postgres psql\n\npsql (12.12 (Ubuntu 12.12-0ubuntu0.20.04.1))\nType \"help\" for help.\n\npostgres=#\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"sudo -u postgres psql"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"psql (12.12 (Ubuntu 12.12-0ubuntu0.20.04.1))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"Type "}]},{"type":"element","tag":"span","props":{"class":"ct-807f38"},"children":[{"type":"text","value":"\"help\""}]},{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3a57b7"},"children":[{"type":"text","value":"for"}]},{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":" help."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"postgres="}]},{"type":"element","tag":"span","props":{"class":"ct-ba601c"},"children":[{"type":"text","value":"#"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"set-password-for-postgres-database-user"},"children":[{"type":"text","value":"Set password for postgres database user"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The password for the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" database user can be set the the quick command "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"\\password"}]},{"type":"text","value":"\nor by "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"alter user postgres password 'Supersecret'"}]},{"type":"text","value":". A connection using the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" user\nis still not possible from the \"outside\" hence to the default settings in the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"pg_hba.conf"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h3","props":{"id":"update-pg_hbaconf-to-allow-postgres-user-connections-with-password"},"children":[{"type":"text","value":"Update pg_hba.conf to allow postgres user connections with password"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"In order to allow connections of the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" database user not using OS user\nauthentication, you have to update the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"pg_hba.conf"}]},{"type":"text","value":" which can be found under\n"},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/postgresql/12/main/pg_hba.conf"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"sudo vi /etc/postgresql/12/main/pg_hba.conf\n\n...\nlocal all postgres peer\n...\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"sudo vi /etc/postgresql/12/main/pg_hba.conf"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3ccee5"},"children":[{"type":"text","value":"local"}]},{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":" all postgres peer"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"..."}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change the last section of the above line to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"md5"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"local all postgres md5\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"local all postgres md5"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A restart is required in order to apply the new configuration:"}]},{"type":"element","tag":"code","props":{"code":"sudo systemctl restart postgresql\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"sudo systemctl restart postgresql"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Now a connection from outside the database host is possible e.g."}]},{"type":"element","tag":"code","props":{"code":"psql -U postgres -d postgres -h databasehostname\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-662fdc"},"children":[{"type":"text","value":"psql -U postgres -d postgres -h databasehostname"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"creation-of-additional-database-users"},"children":[{"type":"text","value":"Creation of additional database users"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A database user can be created by the following command:"}]},{"type":"element","tag":"code","props":{"code":"create user myuser with encrypted password 'Supersecret';\nCREATE ROLE\n\npostgres=# \\du\n List of roles\n Role name | Attributes | Member of\n-----------+------------------------------------------------------------+-----------\n myuser | | {}\n postgres | Superuser, Create role, Create DB, Replication, Bypass RLS | {}\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"create user myuser with encrypted password 'Supersecret';\nCREATE ROLE\n\npostgres=# \\du\n List of roles\n Role name | Attributes | Member of\n-----------+------------------------------------------------------------+-----------\n myuser | | {}\n postgres | Superuser, Create role, Create DB, Replication, Bypass RLS | {}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"creation-of-additional-databases"},"children":[{"type":"text","value":"Creation of additional databases"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"One can create new Postgres databases within an instance. Therefore you can use the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"psql"}]},{"type":"text","value":"\ncommand to login (see above)."}]},{"type":"element","tag":"code","props":{"code":"CREATE DATABASE dbname OWNER myuser;\nCREATE DATABASE\n\npostgres=# \\l\n List of databases\n Name | Owner | Encoding | Collate | Ctype | Access privileges\n-----------+----------+----------+-------------+-------------+-----------------------\n dbname | myuser | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n postgres | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n template0 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n template1 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"CREATE DATABASE dbname OWNER myuser;\nCREATE DATABASE\n\npostgres=# \\l\n List of databases\n Name | Owner | Encoding | Collate | Ctype | Access privileges\n-----------+----------+----------+-------------+-------------+-----------------------\n dbname | myuser | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n postgres | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n template0 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n template1 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You can leave the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"OWNER"}]},{"type":"text","value":" section of the command, when doing so, the current user will become\nowner of the newly created database."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To change the owner of an existing database later, you can use the following command:"}]},{"type":"element","tag":"code","props":{"code":"postgres=# alter database dbname owner to myuser;\nALTER DATABASE\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"postgres=# alter database dbname owner to myuser;\nALTER DATABASE"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-3ccee5{color:#FF7B72}.ct-ba601c{color:#8B949E}.ct-3a57b7{color:#FF7B72}.ct-807f38{color:#A5D6FF}.ct-662fdc{color:#C9D1D9}.light .ct-662fdc{color:#657B83}.light .ct-807f38{color:#2AA198}.light .ct-3a57b7{color:#859900}.light .ct-ba601c{color:#93A1A1}.light .ct-3ccee5{color:#073642}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"install-postgresql-12-on-ubuntu-2004-lts","depth":2,"text":"Install PostgreSQL 12 on Ubuntu 20.04 LTS"},{"id":"initial-database-connection","depth":2,"text":"Initial database connection"},{"id":"set-password-for-postgres-database-user","depth":2,"text":"Set password for postgres database user","children":[{"id":"update-pg_hbaconf-to-allow-postgres-user-connections-with-password","depth":3,"text":"Update pg_hba.conf to allow postgres user connections with password"}]},{"id":"creation-of-additional-database-users","depth":2,"text":"Creation of additional database users"},{"id":"creation-of-additional-databases","depth":2,"text":"Creation of additional databases"}]}},"_type":"markdown","_id":"content:SQL:Postgress setup.md","_source":"content","_file":"SQL/Postgress setup.md","_extension":"md"} \ No newline at end of file +{"_path":"/sql/postgress-setup","_dir":"sql","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Postgress Setup","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"install-postgresql-12-on-ubuntu-2004-lts"},"children":[{"type":"text","value":"Install PostgreSQL 12 on Ubuntu 20.04 LTS"}]},{"type":"element","tag":"code","props":{"code":"sudo apt update\nsudo apt install -y postgresql postgresql-contrib postgresql-client\nsudo systemctl status postgresql.service\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"sudo apt update\nsudo apt install -y postgresql postgresql-contrib postgresql-client\nsudo systemctl status postgresql.service\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"initial-database-connection"},"children":[{"type":"text","value":"Initial database connection"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A local connection (from the database server) can be done by the following command:"}]},{"type":"element","tag":"code","props":{"code":"sudo -u postgres psql\n\npsql (12.12 (Ubuntu 12.12-0ubuntu0.20.04.1))\nType \"help\" for help.\n\npostgres=#\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"sudo -u postgres psql\n\npsql (12.12 (Ubuntu 12.12-0ubuntu0.20.04.1))\nType \"help\" for help.\n\npostgres=#\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"set-password-for-postgres-database-user"},"children":[{"type":"text","value":"Set password for postgres database user"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The password for the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" database user can be set the the quick command "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"\\password"}]},{"type":"text","value":"\nor by "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"alter user postgres password 'Supersecret'"}]},{"type":"text","value":". A connection using the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" user\nis still not possible from the \"outside\" hence to the default settings in the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"pg_hba.conf"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h3","props":{"id":"update-pg_hbaconf-to-allow-postgres-user-connections-with-password"},"children":[{"type":"text","value":"Update pg_hba.conf to allow postgres user connections with password"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"In order to allow connections of the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" database user not using OS user\nauthentication, you have to update the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"pg_hba.conf"}]},{"type":"text","value":" which can be found under\n"},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/postgresql/12/main/pg_hba.conf"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"sudo vi /etc/postgresql/12/main/pg_hba.conf\n\n...\nlocal all postgres peer\n...\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"sudo vi /etc/postgresql/12/main/pg_hba.conf\n\n...\nlocal all postgres peer\n...\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change the last section of the above line to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"md5"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"local all postgres md5\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"local all postgres md5\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A restart is required in order to apply the new configuration:"}]},{"type":"element","tag":"code","props":{"code":"sudo systemctl restart postgresql\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"sudo systemctl restart postgresql\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Now a connection from outside the database host is possible e.g."}]},{"type":"element","tag":"code","props":{"code":"psql -U postgres -d postgres -h databasehostname\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"psql -U postgres -d postgres -h databasehostname\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"creation-of-additional-database-users"},"children":[{"type":"text","value":"Creation of additional database users"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A database user can be created by the following command:"}]},{"type":"element","tag":"code","props":{"code":"create user myuser with encrypted password 'Supersecret';\nCREATE ROLE\n\npostgres=# \\du\n List of roles\n Role name | Attributes | Member of\n-----------+------------------------------------------------------------+-----------\n myuser | | {}\n postgres | Superuser, Create role, Create DB, Replication, Bypass RLS | {}\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"create user myuser with encrypted password 'Supersecret';\nCREATE ROLE\n\npostgres=# \\du\n List of roles\n Role name | Attributes | Member of\n-----------+------------------------------------------------------------+-----------\n myuser | | {}\n postgres | Superuser, Create role, Create DB, Replication, Bypass RLS | {}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"creation-of-additional-databases"},"children":[{"type":"text","value":"Creation of additional databases"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"One can create new Postgres databases within an instance. Therefore you can use the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"psql"}]},{"type":"text","value":"\ncommand to login (see above)."}]},{"type":"element","tag":"code","props":{"code":"CREATE DATABASE dbname OWNER myuser;\nCREATE DATABASE\n\npostgres=# \\l\n List of databases\n Name | Owner | Encoding | Collate | Ctype | Access privileges\n-----------+----------+----------+-------------+-------------+-----------------------\n dbname | myuser | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n postgres | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n template0 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n template1 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"CREATE DATABASE dbname OWNER myuser;\nCREATE DATABASE\n\npostgres=# \\l\n List of databases\n Name | Owner | Encoding | Collate | Ctype | Access privileges\n-----------+----------+----------+-------------+-------------+-----------------------\n dbname | myuser | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n postgres | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n template0 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n template1 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You can leave the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"OWNER"}]},{"type":"text","value":" section of the command, when doing so, the current user will become\nowner of the newly created database."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To change the owner of an existing database later, you can use the following command:"}]},{"type":"element","tag":"code","props":{"code":"postgres=# alter database dbname owner to myuser;\nALTER DATABASE\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"postgres=# alter database dbname owner to myuser;\nALTER DATABASE\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"install-postgresql-12-on-ubuntu-2004-lts"},"children":[{"type":"text","value":"Install PostgreSQL 12 on Ubuntu 20.04 LTS"}]},{"type":"element","tag":"code","props":{"code":"sudo apt update\nsudo apt install -y postgresql postgresql-contrib postgresql-client\nsudo systemctl status postgresql.service\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"sudo apt update"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"sudo apt install -y postgresql postgresql-contrib postgresql-client"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"sudo systemctl status postgresql.service"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"initial-database-connection"},"children":[{"type":"text","value":"Initial database connection"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A local connection (from the database server) can be done by the following command:"}]},{"type":"element","tag":"code","props":{"code":"sudo -u postgres psql\n\npsql (12.12 (Ubuntu 12.12-0ubuntu0.20.04.1))\nType \"help\" for help.\n\npostgres=#\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"sudo -u postgres psql"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"psql (12.12 (Ubuntu 12.12-0ubuntu0.20.04.1))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"Type "}]},{"type":"element","tag":"span","props":{"class":"ct-2ca8ba"},"children":[{"type":"text","value":"\"help\""}]},{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-11c2dc"},"children":[{"type":"text","value":"for"}]},{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":" help."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"postgres="}]},{"type":"element","tag":"span","props":{"class":"ct-b954cf"},"children":[{"type":"text","value":"#"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"set-password-for-postgres-database-user"},"children":[{"type":"text","value":"Set password for postgres database user"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The password for the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" database user can be set the the quick command "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"\\password"}]},{"type":"text","value":"\nor by "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"alter user postgres password 'Supersecret'"}]},{"type":"text","value":". A connection using the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" user\nis still not possible from the \"outside\" hence to the default settings in the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"pg_hba.conf"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h3","props":{"id":"update-pg_hbaconf-to-allow-postgres-user-connections-with-password"},"children":[{"type":"text","value":"Update pg_hba.conf to allow postgres user connections with password"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"In order to allow connections of the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"postgres"}]},{"type":"text","value":" database user not using OS user\nauthentication, you have to update the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"pg_hba.conf"}]},{"type":"text","value":" which can be found under\n"},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/postgresql/12/main/pg_hba.conf"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"sudo vi /etc/postgresql/12/main/pg_hba.conf\n\n...\nlocal all postgres peer\n...\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"sudo vi /etc/postgresql/12/main/pg_hba.conf"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ecfcaa"},"children":[{"type":"text","value":"local"}]},{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":" all postgres peer"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"..."}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change the last section of the above line to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"md5"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"local all postgres md5\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"local all postgres md5"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A restart is required in order to apply the new configuration:"}]},{"type":"element","tag":"code","props":{"code":"sudo systemctl restart postgresql\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"sudo systemctl restart postgresql"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Now a connection from outside the database host is possible e.g."}]},{"type":"element","tag":"code","props":{"code":"psql -U postgres -d postgres -h databasehostname\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-230b36"},"children":[{"type":"text","value":"psql -U postgres -d postgres -h databasehostname"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"creation-of-additional-database-users"},"children":[{"type":"text","value":"Creation of additional database users"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A database user can be created by the following command:"}]},{"type":"element","tag":"code","props":{"code":"create user myuser with encrypted password 'Supersecret';\nCREATE ROLE\n\npostgres=# \\du\n List of roles\n Role name | Attributes | Member of\n-----------+------------------------------------------------------------+-----------\n myuser | | {}\n postgres | Superuser, Create role, Create DB, Replication, Bypass RLS | {}\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"create user myuser with encrypted password 'Supersecret';\nCREATE ROLE\n\npostgres=# \\du\n List of roles\n Role name | Attributes | Member of\n-----------+------------------------------------------------------------+-----------\n myuser | | {}\n postgres | Superuser, Create role, Create DB, Replication, Bypass RLS | {}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"creation-of-additional-databases"},"children":[{"type":"text","value":"Creation of additional databases"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"One can create new Postgres databases within an instance. Therefore you can use the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"psql"}]},{"type":"text","value":"\ncommand to login (see above)."}]},{"type":"element","tag":"code","props":{"code":"CREATE DATABASE dbname OWNER myuser;\nCREATE DATABASE\n\npostgres=# \\l\n List of databases\n Name | Owner | Encoding | Collate | Ctype | Access privileges\n-----------+----------+----------+-------------+-------------+-----------------------\n dbname | myuser | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n postgres | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n template0 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n template1 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"CREATE DATABASE dbname OWNER myuser;\nCREATE DATABASE\n\npostgres=# \\l\n List of databases\n Name | Owner | Encoding | Collate | Ctype | Access privileges\n-----------+----------+----------+-------------+-------------+-----------------------\n dbname | myuser | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n postgres | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n template0 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres\n template1 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c/postgres +\n | | | | | postgres=CTc/postgres"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You can leave the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"OWNER"}]},{"type":"text","value":" section of the command, when doing so, the current user will become\nowner of the newly created database."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To change the owner of an existing database later, you can use the following command:"}]},{"type":"element","tag":"code","props":{"code":"postgres=# alter database dbname owner to myuser;\nALTER DATABASE\n","language":"sql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"postgres=# alter database dbname owner to myuser;\nALTER DATABASE"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-ecfcaa{color:#FF7B72}.ct-b954cf{color:#8B949E}.ct-11c2dc{color:#FF7B72}.ct-2ca8ba{color:#A5D6FF}.ct-230b36{color:#C9D1D9}.light .ct-230b36{color:#657B83}.light .ct-2ca8ba{color:#2AA198}.light .ct-11c2dc{color:#859900}.light .ct-b954cf{color:#93A1A1}.light .ct-ecfcaa{color:#073642}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"install-postgresql-12-on-ubuntu-2004-lts","depth":2,"text":"Install PostgreSQL 12 on Ubuntu 20.04 LTS"},{"id":"initial-database-connection","depth":2,"text":"Initial database connection"},{"id":"set-password-for-postgres-database-user","depth":2,"text":"Set password for postgres database user","children":[{"id":"update-pg_hbaconf-to-allow-postgres-user-connections-with-password","depth":3,"text":"Update pg_hba.conf to allow postgres user connections with password"}]},{"id":"creation-of-additional-database-users","depth":2,"text":"Creation of additional database users"},{"id":"creation-of-additional-databases","depth":2,"text":"Creation of additional databases"}]}},"_type":"markdown","_id":"content:SQL:Postgress setup.md","_source":"content","_file":"SQL/Postgress setup.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/Llpj9LBd4i.json b/docs/api/_content/query/Llpj9LBd4i.json index 7d4fad3..3abbfaa 100644 --- a/docs/api/_content/query/Llpj9LBd4i.json +++ b/docs/api/_content/query/Llpj9LBd4i.json @@ -1 +1 @@ -{"_path":"/frontend/vue/adding-global-properties-to-component","_dir":"vue","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Adding Global Properties To Component","description":"The topic's fully covered in the official documentation and in Add global variable to window.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The topic's fully covered in the "},{"type":"element","tag":"a","props":{"href":"https://vuejs.org/guide/typescript/options-api.html#augmenting-global-properties","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]},{"type":"text","value":" and in "},{"type":"element","tag":"a","props":{"href":"Add%20global%20variable%20to%20window"},"children":[{"type":"text","value":"Add global variable to window"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For example, you want to add global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$http"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$translate"}]},{"type":"text","value":" services to all of project's components:"}]},{"type":"element","tag":"code","props":{"code":"// ~/index.d.ts or ~/custom.d.ts\n\nimport axios from 'axios'\n\ndeclare module 'vue' {\n interface ComponentCustomProperties {\n $http: typeof axios\n $translate: (key: string) => string\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// ~/index.d.ts or ~/custom.d.ts\n\nimport axios from 'axios'\n\ndeclare module 'vue' {\n interface ComponentCustomProperties {\n $http: typeof axios\n $translate: (key: string) => string\n }\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The topic's fully covered in the "},{"type":"element","tag":"a","props":{"href":"https://vuejs.org/guide/typescript/options-api.html#augmenting-global-properties","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]},{"type":"text","value":" and in "},{"type":"element","tag":"a","props":{"href":"Add%20global%20variable%20to%20window"},"children":[{"type":"text","value":"Add global variable to window"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For example, you want to add global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$http"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$translate"}]},{"type":"text","value":" services to all of project's components:"}]},{"type":"element","tag":"code","props":{"code":"// ~/index.d.ts or ~/custom.d.ts\n\nimport axios from 'axios'\n\ndeclare module 'vue' {\n interface ComponentCustomProperties {\n $http: typeof axios\n $translate: (key: string) => string\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-026e23"},"children":[{"type":"text","value":"// ~/index.d.ts or ~/custom.d.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3204ed"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7bada2"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3204ed"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-318f96"},"children":[{"type":"text","value":"'axios'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1a2afa"},"children":[{"type":"text","value":"declare"}]},{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1a2afa"},"children":[{"type":"text","value":"module"}]},{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-318f96"},"children":[{"type":"text","value":"'vue'"}]},{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1a2afa"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-772f4e"},"children":[{"type":"text","value":"ComponentCustomProperties"}]},{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-07f096"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b5f651"},"children":[{"type":"text","value":"$translate"}]},{"type":"element","tag":"span","props":{"class":"ct-4eb8ad"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-07f096"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-3f2b67"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-4eb8ad"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-07f096"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-41a6a6"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-07f096"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-cd10b7"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-07f096"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-41a6a6"},"children":[{"type":"text","value":"string"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-720b32"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-cd10b7{color:#FF7B72}.ct-41a6a6{color:#79C0FF}.ct-3f2b67{color:#FFA657}.ct-4eb8ad{color:#FF7B72}.ct-b5f651{color:#D2A8FF}.ct-07f096{color:#C9D1D9}.ct-772f4e{color:#FFA657}.ct-1a2afa{color:#FF7B72}.ct-318f96{color:#A5D6FF}.ct-7bada2{color:#C9D1D9}.ct-720b32{color:#C9D1D9}.ct-3204ed{color:#FF7B72}.ct-026e23{color:#8B949E}.light .ct-026e23{color:#93A1A1}.light .ct-3204ed{color:#859900}.light .ct-720b32{color:#657B83}.light .ct-7bada2{color:#268BD2}.light .ct-318f96{color:#2AA198}.light .ct-1a2afa{color:#073642}.light .ct-772f4e{color:#268BD2}.light .ct-07f096{color:#657B83}.light .ct-b5f651{color:#268BD2}.light .ct-4eb8ad{color:#859900}.light .ct-3f2b67{color:#657B83}.light .ct-41a6a6{color:#859900}.light .ct-cd10b7{color:#073642}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:Vue:Adding global properties to component.md","_source":"content","_file":"Frontend/Vue/Adding global properties to component.md","_extension":"md"} \ No newline at end of file +{"_path":"/frontend/vue/adding-global-properties-to-component","_dir":"vue","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Adding Global Properties To Component","description":"The topic's fully covered in the official documentation and in Add global variable to window.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The topic's fully covered in the "},{"type":"element","tag":"a","props":{"href":"https://vuejs.org/guide/typescript/options-api.html#augmenting-global-properties","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]},{"type":"text","value":" and in "},{"type":"element","tag":"a","props":{"href":"Add%20global%20variable%20to%20window"},"children":[{"type":"text","value":"Add global variable to window"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For example, you want to add global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$http"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$translate"}]},{"type":"text","value":" services to all of project's components:"}]},{"type":"element","tag":"code","props":{"code":"// ~/index.d.ts or ~/custom.d.ts\n\nimport axios from 'axios'\n\ndeclare module 'vue' {\n interface ComponentCustomProperties {\n $http: typeof axios\n $translate: (key: string) => string\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// ~/index.d.ts or ~/custom.d.ts\n\nimport axios from 'axios'\n\ndeclare module 'vue' {\n interface ComponentCustomProperties {\n $http: typeof axios\n $translate: (key: string) => string\n }\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The topic's fully covered in the "},{"type":"element","tag":"a","props":{"href":"https://vuejs.org/guide/typescript/options-api.html#augmenting-global-properties","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]},{"type":"text","value":" and in "},{"type":"element","tag":"a","props":{"href":"Add%20global%20variable%20to%20window"},"children":[{"type":"text","value":"Add global variable to window"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For example, you want to add global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$http"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$translate"}]},{"type":"text","value":" services to all of project's components:"}]},{"type":"element","tag":"code","props":{"code":"// ~/index.d.ts or ~/custom.d.ts\n\nimport axios from 'axios'\n\ndeclare module 'vue' {\n interface ComponentCustomProperties {\n $http: typeof axios\n $translate: (key: string) => string\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b7b0cd"},"children":[{"type":"text","value":"// ~/index.d.ts or ~/custom.d.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e981e0"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f07ca9"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e981e0"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61f814"},"children":[{"type":"text","value":"'axios'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-537f3d"},"children":[{"type":"text","value":"declare"}]},{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-537f3d"},"children":[{"type":"text","value":"module"}]},{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61f814"},"children":[{"type":"text","value":"'vue'"}]},{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-537f3d"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5c625"},"children":[{"type":"text","value":"ComponentCustomProperties"}]},{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-86544a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-33e5c2"},"children":[{"type":"text","value":"$translate"}]},{"type":"element","tag":"span","props":{"class":"ct-d5befa"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-86544a"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-d8377e"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-d5befa"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-86544a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d4f523"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-86544a"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-f0c8cd"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-86544a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d4f523"},"children":[{"type":"text","value":"string"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a07843"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-f0c8cd{color:#FF7B72}.ct-d4f523{color:#79C0FF}.ct-d8377e{color:#FFA657}.ct-d5befa{color:#FF7B72}.ct-33e5c2{color:#D2A8FF}.ct-86544a{color:#C9D1D9}.ct-d5c625{color:#FFA657}.ct-537f3d{color:#FF7B72}.ct-61f814{color:#A5D6FF}.ct-f07ca9{color:#C9D1D9}.ct-a07843{color:#C9D1D9}.ct-e981e0{color:#FF7B72}.ct-b7b0cd{color:#8B949E}.light .ct-b7b0cd{color:#93A1A1}.light .ct-e981e0{color:#859900}.light .ct-a07843{color:#657B83}.light .ct-f07ca9{color:#268BD2}.light .ct-61f814{color:#2AA198}.light .ct-537f3d{color:#073642}.light .ct-d5c625{color:#268BD2}.light .ct-86544a{color:#657B83}.light .ct-33e5c2{color:#268BD2}.light .ct-d5befa{color:#859900}.light .ct-d8377e{color:#657B83}.light .ct-d4f523{color:#859900}.light .ct-f0c8cd{color:#073642}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:Vue:Adding global properties to component.md","_source":"content","_file":"Frontend/Vue/Adding global properties to component.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/O9PBAkuWXG.json b/docs/api/_content/query/O9PBAkuWXG.json index 20d271a..c75a77d 100644 --- a/docs/api/_content/query/O9PBAkuWXG.json +++ b/docs/api/_content/query/O9PBAkuWXG.json @@ -1 +1 @@ -{"_path":"/graphql/refresh-token-in-apollo-client","_dir":"graphql","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Refresh Token In Apollo Client","description":"If your GraphQL api needs token refresh option, you can pass custom fetch function for Apollo Client.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If your GraphQL api needs token refresh option, you can pass custom fetch function for Apollo Client."}]},{"type":"element","tag":"code","props":{"code":"export const createApolloClient = (\n url: string,\n logout: () => void,\n getAuthorizationData: () => { authorization: string },\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n) =>\n new ApolloClientBase({\n // ...other options\n link: ApolloLink.from([\n // ...other options\n setContext(async (_, { headers }) => {\n return {\n headers: {\n ...headers,\n ...getAuthorizationData(),\n },\n };\n }),\n new HttpLink({\n uri: url,\n fetch: fetchWithTokenRefresh(logout, refreshToken),\n }),\n ]),\n });\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"export const createApolloClient = (\n url: string,\n logout: () => void,\n getAuthorizationData: () => { authorization: string },\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n) =>\n new ApolloClientBase({\n // ...other options\n link: ApolloLink.from([\n // ...other options\n setContext(async (_, { headers }) => {\n return {\n headers: {\n ...headers,\n ...getAuthorizationData(),\n },\n };\n }),\n new HttpLink({\n uri: url,\n fetch: fetchWithTokenRefresh(logout, refreshToken),\n }),\n ]),\n });\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Custom fetch function for this request. You should tune "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"hasUnauthorizedError"}]},{"type":"text","value":" and\n"},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"text","value":" to match your api."}]},{"type":"element","tag":"code","props":{"code":"/** Global singleton for refreshing promise */\nlet refreshingPromise: Promise | null = null;\n\n/** Checks if GraphQl errors has unauthenticated error */\nconst hasUnauthorizedError = (errors: Array<{ code?: ErrorCode }>): boolean =>\n Array.isArray(errors) &&\n errors.some(error => {\n return error.status === 401; // Distinguish unauthorized error here\n });\n\n/** Detects if customFetch is sending refresh request */\nconst isRefreshRequestOptions = (options: RequestInit) => {\n try {\n const body = JSON.parse(options?.body as string);\n return body.operationName === 'RefreshToken';\n } catch (e) {\n return false;\n }\n};\n\n/** fetchWithTokenRefresh is a custom fetch function with token refresh for apollo */\nexport const fetchWithTokenRefresh =\n (\n logout: () => void,\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n ) =>\n async (uri: string, options: RequestInit): Promise => {\n // already refreshing token, wait for it and then use refreshed token\n // or use empty authorization if refreshing failed\n if (\n !isRefreshRequestOptions(options) &&\n refreshingPromise &&\n (options.headers as Record)?.authorization\n ) {\n const newAccessToken = await refreshingPromise\n .catch(() => {\n // refreshing token from other request failed, retry without authorization\n return '';\n });\n \n options.headers = {\n ...(options.headers || {}),\n authorization: newAccessToken,\n };\n }\n\n return fetch(uri, options).then(async response => {\n const text = await response.text();\n const json = JSON.parse(text);\n\n // check for unauthorized errors, if not present, just return result\n if (\n isRefreshRequestOptions(options) ||\n !json?.errors ||\n !Array.isArray(json.errors) ||\n !hasUnauthorizedError(json.errors)\n ) {\n return {\n ...response,\n ok: true,\n json: async () =>\n new Promise(resolve => {\n resolve(json);\n }),\n text: async () =>\n new Promise(resolve => {\n resolve(text);\n }),\n };\n }\n\n // If unauthorized, refresh token and try again\n if (!refreshingPromise) {\n refreshingPromise = refreshToken()\n .then(async (tokens): Promise => {\n refreshingPromise = null;\n\n if (!tokens?.accessToken) {\n throw new Error('Session expired');\n }\n\n return tokens?.accessToken;\n })\n .catch(() => {\n refreshingPromise = null;\n\n // can't refresh token. logging out\n logout();\n throw new Error('Session expired');\n });\n }\n\n // success or any non-auth error\n return refreshingPromise\n .then(async (newAccessToken: string) => {\n // wait for other request's refreshing query to finish, when retry\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: newAccessToken,\n },\n });\n })\n .catch(async () => {\n // refreshing token from other request failed, retry without authorization\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: '',\n },\n });\n });\n });\n };\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"/** Global singleton for refreshing promise */\nlet refreshingPromise: Promise | null = null;\n\n/** Checks if GraphQl errors has unauthenticated error */\nconst hasUnauthorizedError = (errors: Array<{ code?: ErrorCode }>): boolean =>\n Array.isArray(errors) &&\n errors.some(error => {\n return error.status === 401; // Distinguish unauthorized error here\n });\n\n/** Detects if customFetch is sending refresh request */\nconst isRefreshRequestOptions = (options: RequestInit) => {\n try {\n const body = JSON.parse(options?.body as string);\n return body.operationName === 'RefreshToken';\n } catch (e) {\n return false;\n }\n};\n\n/** fetchWithTokenRefresh is a custom fetch function with token refresh for apollo */\nexport const fetchWithTokenRefresh =\n (\n logout: () => void,\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n ) =>\n async (uri: string, options: RequestInit): Promise => {\n // already refreshing token, wait for it and then use refreshed token\n // or use empty authorization if refreshing failed\n if (\n !isRefreshRequestOptions(options) &&\n refreshingPromise &&\n (options.headers as Record)?.authorization\n ) {\n const newAccessToken = await refreshingPromise\n .catch(() => {\n // refreshing token from other request failed, retry without authorization\n return '';\n });\n \n options.headers = {\n ...(options.headers || {}),\n authorization: newAccessToken,\n };\n }\n\n return fetch(uri, options).then(async response => {\n const text = await response.text();\n const json = JSON.parse(text);\n\n // check for unauthorized errors, if not present, just return result\n if (\n isRefreshRequestOptions(options) ||\n !json?.errors ||\n !Array.isArray(json.errors) ||\n !hasUnauthorizedError(json.errors)\n ) {\n return {\n ...response,\n ok: true,\n json: async () =>\n new Promise(resolve => {\n resolve(json);\n }),\n text: async () =>\n new Promise(resolve => {\n resolve(text);\n }),\n };\n }\n\n // If unauthorized, refresh token and try again\n if (!refreshingPromise) {\n refreshingPromise = refreshToken()\n .then(async (tokens): Promise => {\n refreshingPromise = null;\n\n if (!tokens?.accessToken) {\n throw new Error('Session expired');\n }\n\n return tokens?.accessToken;\n })\n .catch(() => {\n refreshingPromise = null;\n\n // can't refresh token. logging out\n logout();\n throw new Error('Session expired');\n });\n }\n\n // success or any non-auth error\n return refreshingPromise\n .then(async (newAccessToken: string) => {\n // wait for other request's refreshing query to finish, when retry\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: newAccessToken,\n },\n });\n })\n .catch(async () => {\n // refreshing token from other request failed, retry without authorization\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: '',\n },\n });\n });\n });\n };\n\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If your GraphQL api needs token refresh option, you can pass custom fetch function for Apollo Client."}]},{"type":"element","tag":"code","props":{"code":"export const createApolloClient = (\n url: string,\n logout: () => void,\n getAuthorizationData: () => { authorization: string },\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n) =>\n new ApolloClientBase({\n // ...other options\n link: ApolloLink.from([\n // ...other options\n setContext(async (_, { headers }) => {\n return {\n headers: {\n ...headers,\n ...getAuthorizationData(),\n },\n };\n }),\n new HttpLink({\n uri: url,\n fetch: fetchWithTokenRefresh(logout, refreshToken),\n }),\n ]),\n });\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"createApolloClient"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"url"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7a154e"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-950598"},"children":[{"type":"text","value":"getAuthorizationData"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"authorization"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-474837"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"<"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"undefined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" >,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"ApolloClientBase"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// ...other options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" link: "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"ApolloLink"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"(["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// ...other options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-950598"},"children":[{"type":"text","value":"setContext"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"_"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":", { "}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"getAuthorizationData"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"(),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"HttpLink"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" uri: "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"url"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" fetch: "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"fetchWithTokenRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ]),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" });"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Custom fetch function for this request. You should tune "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"hasUnauthorizedError"}]},{"type":"text","value":" and\n"},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"text","value":" to match your api."}]},{"type":"element","tag":"code","props":{"code":"/** Global singleton for refreshing promise */\nlet refreshingPromise: Promise | null = null;\n\n/** Checks if GraphQl errors has unauthenticated error */\nconst hasUnauthorizedError = (errors: Array<{ code?: ErrorCode }>): boolean =>\n Array.isArray(errors) &&\n errors.some(error => {\n return error.status === 401; // Distinguish unauthorized error here\n });\n\n/** Detects if customFetch is sending refresh request */\nconst isRefreshRequestOptions = (options: RequestInit) => {\n try {\n const body = JSON.parse(options?.body as string);\n return body.operationName === 'RefreshToken';\n } catch (e) {\n return false;\n }\n};\n\n/** fetchWithTokenRefresh is a custom fetch function with token refresh for apollo */\nexport const fetchWithTokenRefresh =\n (\n logout: () => void,\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n ) =>\n async (uri: string, options: RequestInit): Promise => {\n // already refreshing token, wait for it and then use refreshed token\n // or use empty authorization if refreshing failed\n if (\n !isRefreshRequestOptions(options) &&\n refreshingPromise &&\n (options.headers as Record)?.authorization\n ) {\n const newAccessToken = await refreshingPromise\n .catch(() => {\n // refreshing token from other request failed, retry without authorization\n return '';\n });\n \n options.headers = {\n ...(options.headers || {}),\n authorization: newAccessToken,\n };\n }\n\n return fetch(uri, options).then(async response => {\n const text = await response.text();\n const json = JSON.parse(text);\n\n // check for unauthorized errors, if not present, just return result\n if (\n isRefreshRequestOptions(options) ||\n !json?.errors ||\n !Array.isArray(json.errors) ||\n !hasUnauthorizedError(json.errors)\n ) {\n return {\n ...response,\n ok: true,\n json: async () =>\n new Promise(resolve => {\n resolve(json);\n }),\n text: async () =>\n new Promise(resolve => {\n resolve(text);\n }),\n };\n }\n\n // If unauthorized, refresh token and try again\n if (!refreshingPromise) {\n refreshingPromise = refreshToken()\n .then(async (tokens): Promise => {\n refreshingPromise = null;\n\n if (!tokens?.accessToken) {\n throw new Error('Session expired');\n }\n\n return tokens?.accessToken;\n })\n .catch(() => {\n refreshingPromise = null;\n\n // can't refresh token. logging out\n logout();\n throw new Error('Session expired');\n });\n }\n\n // success or any non-auth error\n return refreshingPromise\n .then(async (newAccessToken: string) => {\n // wait for other request's refreshing query to finish, when retry\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: newAccessToken,\n },\n });\n })\n .catch(async () => {\n // refreshing token from other request failed, retry without authorization\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: '',\n },\n });\n });\n });\n };\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"/** Global singleton for refreshing promise */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-474837"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-7a154e"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7a154e"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f6b4b1"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"/** Checks if GraphQl errors has unauthenticated error */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-950598"},"children":[{"type":"text","value":"hasUnauthorizedError"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9161f"},"children":[{"type":"text","value":"Array"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":"<{ "}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"code"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":"?:"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9161f"},"children":[{"type":"text","value":"ErrorCode"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" }>)"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7a154e"},"children":[{"type":"text","value":"Array"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"isArray"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"&&"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"some"}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"status"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03d8ec"},"children":[{"type":"text","value":"401"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// Distinguish unauthorized error here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"/** Detects if customFetch is sending refresh request */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-950598"},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9161f"},"children":[{"type":"text","value":"RequestInit"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa659e"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7a154e"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"operationName"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e3a64a"},"children":[{"type":"text","value":"'RefreshToken'"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f6b4b1"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"/** fetchWithTokenRefresh is a custom fetch function with token refresh for apollo */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa659e"},"children":[{"type":"text","value":"fetchWithTokenRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"="}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":": () "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":": () "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" { accessToken: "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f6b4b1"},"children":[{"type":"text","value":"undefined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ) "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9161f"},"children":[{"type":"text","value":"RequestInit"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9161f"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-b9161f"},"children":[{"type":"text","value":"Response"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// already refreshing token, wait for it and then use refreshed token"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// or use empty authorization if refreshing failed"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"&&"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"&&"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"as"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-474837"},"children":[{"type":"text","value":"Record"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-7a154e"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-7a154e"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":">)?."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"authorization"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa659e"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"refreshingPromise"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// refreshing token from other request failed, retry without authorization"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e3a64a"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" {}),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"fetch"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"async"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa659e"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa659e"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"="}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// check for unauthorized errors, if not present, just return result"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"||"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"||"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"hasUnauthorizedError"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ok: "}]},{"type":"element","tag":"span","props":{"class":"ct-f6b4b1"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"unknown"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":">("}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":">("}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// If unauthorized, refresh token and try again"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"()"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-950598"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b9161f"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f6b4b1"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7a154e"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e3a64a"},"children":[{"type":"text","value":"'Session expired'"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f6b4b1"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// can't refresh token. logging out"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7a154e"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e3a64a"},"children":[{"type":"text","value":"'Session expired'"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// success or any non-auth error"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"refreshingPromise"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-950598"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-130286"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-fea699"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8cd428"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-74cbcf"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5c3e14"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// wait for other request's refreshing query to finish, when retry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"fetch"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" {}),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-47017b"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c46233"},"children":[{"type":"text","value":"// refreshing token from other request failed, retry without authorization"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6ce606"},"children":[{"type":"text","value":"fetch"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e13940"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e8f4d5"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" {}),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-e3a64a"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5af85c"},"children":[{"type":"text","value":" };"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-e3a64a{color:#A5D6FF}.ct-fa659e{color:#79C0FF}.ct-03d8ec{color:#79C0FF}.ct-b9161f{color:#FFA657}.ct-f6b4b1{color:#79C0FF}.ct-e13940{color:#C9D1D9}.ct-c46233{color:#8B949E}.ct-474837{color:#FFA657}.ct-74cbcf{color:#FF7B72}.ct-950598{color:#D2A8FF}.ct-7a154e{color:#79C0FF}.ct-8cd428{color:#79C0FF}.ct-fea699{color:#FF7B72}.ct-130286{color:#FFA657}.ct-5c3e14{color:#C9D1D9}.ct-6ce606{color:#D2A8FF}.ct-47017b{color:#FF7B72}.ct-5af85c{color:#C9D1D9}.ct-e8f4d5{color:#FF7B72}.light .ct-e8f4d5{color:#859900}.light .ct-5af85c{color:#657B83}.light .ct-47017b{color:#073642}.light .ct-6ce606{color:#268BD2}.light .ct-5c3e14{color:#657B83}.light .ct-130286{color:#657B83}.light .ct-fea699{color:#859900}.light .ct-8cd428{color:#859900}.light .ct-7a154e{color:#859900}.light .ct-950598{color:#268BD2}.light .ct-74cbcf{color:#073642}.light .ct-474837{color:#268BD2}.light .ct-c46233{color:#93A1A1}.light .ct-e13940{color:#268BD2}.light .ct-f6b4b1{color:#B58900}.light .ct-b9161f{color:#268BD2}.light .ct-03d8ec{color:#D33682}.light .ct-fa659e{color:#268BD2}.light .ct-e3a64a{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:GraphQL:Refresh token in Apollo client.md","_source":"content","_file":"GraphQL/Refresh token in Apollo client.md","_extension":"md"} \ No newline at end of file +{"_path":"/graphql/refresh-token-in-apollo-client","_dir":"graphql","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Refresh Token In Apollo Client","description":"If your GraphQL api needs token refresh option, you can pass custom fetch function for Apollo Client.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If your GraphQL api needs token refresh option, you can pass custom fetch function for Apollo Client."}]},{"type":"element","tag":"code","props":{"code":"export const createApolloClient = (\n url: string,\n logout: () => void,\n getAuthorizationData: () => { authorization: string },\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n) =>\n new ApolloClientBase({\n // ...other options\n link: ApolloLink.from([\n // ...other options\n setContext(async (_, { headers }) => {\n return {\n headers: {\n ...headers,\n ...getAuthorizationData(),\n },\n };\n }),\n new HttpLink({\n uri: url,\n fetch: fetchWithTokenRefresh(logout, refreshToken),\n }),\n ]),\n });\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"export const createApolloClient = (\n url: string,\n logout: () => void,\n getAuthorizationData: () => { authorization: string },\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n) =>\n new ApolloClientBase({\n // ...other options\n link: ApolloLink.from([\n // ...other options\n setContext(async (_, { headers }) => {\n return {\n headers: {\n ...headers,\n ...getAuthorizationData(),\n },\n };\n }),\n new HttpLink({\n uri: url,\n fetch: fetchWithTokenRefresh(logout, refreshToken),\n }),\n ]),\n });\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Custom fetch function for this request. You should tune "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"hasUnauthorizedError"}]},{"type":"text","value":" and\n"},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"text","value":" to match your api."}]},{"type":"element","tag":"code","props":{"code":"/** Global singleton for refreshing promise */\nlet refreshingPromise: Promise | null = null;\n\n/** Checks if GraphQl errors has unauthenticated error */\nconst hasUnauthorizedError = (errors: Array<{ code?: ErrorCode }>): boolean =>\n Array.isArray(errors) &&\n errors.some(error => {\n return error.status === 401; // Distinguish unauthorized error here\n });\n\n/** Detects if customFetch is sending refresh request */\nconst isRefreshRequestOptions = (options: RequestInit) => {\n try {\n const body = JSON.parse(options?.body as string);\n return body.operationName === 'RefreshToken';\n } catch (e) {\n return false;\n }\n};\n\n/** fetchWithTokenRefresh is a custom fetch function with token refresh for apollo */\nexport const fetchWithTokenRefresh =\n (\n logout: () => void,\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n ) =>\n async (uri: string, options: RequestInit): Promise => {\n // already refreshing token, wait for it and then use refreshed token\n // or use empty authorization if refreshing failed\n if (\n !isRefreshRequestOptions(options) &&\n refreshingPromise &&\n (options.headers as Record)?.authorization\n ) {\n const newAccessToken = await refreshingPromise\n .catch(() => {\n // refreshing token from other request failed, retry without authorization\n return '';\n });\n \n options.headers = {\n ...(options.headers || {}),\n authorization: newAccessToken,\n };\n }\n\n return fetch(uri, options).then(async response => {\n const text = await response.text();\n const json = JSON.parse(text);\n\n // check for unauthorized errors, if not present, just return result\n if (\n isRefreshRequestOptions(options) ||\n !json?.errors ||\n !Array.isArray(json.errors) ||\n !hasUnauthorizedError(json.errors)\n ) {\n return {\n ...response,\n ok: true,\n json: async () =>\n new Promise(resolve => {\n resolve(json);\n }),\n text: async () =>\n new Promise(resolve => {\n resolve(text);\n }),\n };\n }\n\n // If unauthorized, refresh token and try again\n if (!refreshingPromise) {\n refreshingPromise = refreshToken()\n .then(async (tokens): Promise => {\n refreshingPromise = null;\n\n if (!tokens?.accessToken) {\n throw new Error('Session expired');\n }\n\n return tokens?.accessToken;\n })\n .catch(() => {\n refreshingPromise = null;\n\n // can't refresh token. logging out\n logout();\n throw new Error('Session expired');\n });\n }\n\n // success or any non-auth error\n return refreshingPromise\n .then(async (newAccessToken: string) => {\n // wait for other request's refreshing query to finish, when retry\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: newAccessToken,\n },\n });\n })\n .catch(async () => {\n // refreshing token from other request failed, retry without authorization\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: '',\n },\n });\n });\n });\n };\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"/** Global singleton for refreshing promise */\nlet refreshingPromise: Promise | null = null;\n\n/** Checks if GraphQl errors has unauthenticated error */\nconst hasUnauthorizedError = (errors: Array<{ code?: ErrorCode }>): boolean =>\n Array.isArray(errors) &&\n errors.some(error => {\n return error.status === 401; // Distinguish unauthorized error here\n });\n\n/** Detects if customFetch is sending refresh request */\nconst isRefreshRequestOptions = (options: RequestInit) => {\n try {\n const body = JSON.parse(options?.body as string);\n return body.operationName === 'RefreshToken';\n } catch (e) {\n return false;\n }\n};\n\n/** fetchWithTokenRefresh is a custom fetch function with token refresh for apollo */\nexport const fetchWithTokenRefresh =\n (\n logout: () => void,\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n ) =>\n async (uri: string, options: RequestInit): Promise => {\n // already refreshing token, wait for it and then use refreshed token\n // or use empty authorization if refreshing failed\n if (\n !isRefreshRequestOptions(options) &&\n refreshingPromise &&\n (options.headers as Record)?.authorization\n ) {\n const newAccessToken = await refreshingPromise\n .catch(() => {\n // refreshing token from other request failed, retry without authorization\n return '';\n });\n \n options.headers = {\n ...(options.headers || {}),\n authorization: newAccessToken,\n };\n }\n\n return fetch(uri, options).then(async response => {\n const text = await response.text();\n const json = JSON.parse(text);\n\n // check for unauthorized errors, if not present, just return result\n if (\n isRefreshRequestOptions(options) ||\n !json?.errors ||\n !Array.isArray(json.errors) ||\n !hasUnauthorizedError(json.errors)\n ) {\n return {\n ...response,\n ok: true,\n json: async () =>\n new Promise(resolve => {\n resolve(json);\n }),\n text: async () =>\n new Promise(resolve => {\n resolve(text);\n }),\n };\n }\n\n // If unauthorized, refresh token and try again\n if (!refreshingPromise) {\n refreshingPromise = refreshToken()\n .then(async (tokens): Promise => {\n refreshingPromise = null;\n\n if (!tokens?.accessToken) {\n throw new Error('Session expired');\n }\n\n return tokens?.accessToken;\n })\n .catch(() => {\n refreshingPromise = null;\n\n // can't refresh token. logging out\n logout();\n throw new Error('Session expired');\n });\n }\n\n // success or any non-auth error\n return refreshingPromise\n .then(async (newAccessToken: string) => {\n // wait for other request's refreshing query to finish, when retry\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: newAccessToken,\n },\n });\n })\n .catch(async () => {\n // refreshing token from other request failed, retry without authorization\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: '',\n },\n });\n });\n });\n };\n\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If your GraphQL api needs token refresh option, you can pass custom fetch function for Apollo Client."}]},{"type":"element","tag":"code","props":{"code":"export const createApolloClient = (\n url: string,\n logout: () => void,\n getAuthorizationData: () => { authorization: string },\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n) =>\n new ApolloClientBase({\n // ...other options\n link: ApolloLink.from([\n // ...other options\n setContext(async (_, { headers }) => {\n return {\n headers: {\n ...headers,\n ...getAuthorizationData(),\n },\n };\n }),\n new HttpLink({\n uri: url,\n fetch: fetchWithTokenRefresh(logout, refreshToken),\n }),\n ]),\n });\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"createApolloClient"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"url"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ad18b4"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2c2f82"},"children":[{"type":"text","value":"getAuthorizationData"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"authorization"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90393e"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"<"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"undefined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" >,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"ApolloClientBase"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// ...other options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" link: "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"ApolloLink"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"(["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// ...other options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2c2f82"},"children":[{"type":"text","value":"setContext"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"_"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":", { "}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"getAuthorizationData"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"(),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"HttpLink"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" uri: "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"url"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" fetch: "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"fetchWithTokenRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ]),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" });"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Custom fetch function for this request. You should tune "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"hasUnauthorizedError"}]},{"type":"text","value":" and\n"},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"text","value":" to match your api."}]},{"type":"element","tag":"code","props":{"code":"/** Global singleton for refreshing promise */\nlet refreshingPromise: Promise | null = null;\n\n/** Checks if GraphQl errors has unauthenticated error */\nconst hasUnauthorizedError = (errors: Array<{ code?: ErrorCode }>): boolean =>\n Array.isArray(errors) &&\n errors.some(error => {\n return error.status === 401; // Distinguish unauthorized error here\n });\n\n/** Detects if customFetch is sending refresh request */\nconst isRefreshRequestOptions = (options: RequestInit) => {\n try {\n const body = JSON.parse(options?.body as string);\n return body.operationName === 'RefreshToken';\n } catch (e) {\n return false;\n }\n};\n\n/** fetchWithTokenRefresh is a custom fetch function with token refresh for apollo */\nexport const fetchWithTokenRefresh =\n (\n logout: () => void,\n refreshToken: () => Promise<\n { accessToken: string; refreshToken: string } | undefined\n >,\n ) =>\n async (uri: string, options: RequestInit): Promise => {\n // already refreshing token, wait for it and then use refreshed token\n // or use empty authorization if refreshing failed\n if (\n !isRefreshRequestOptions(options) &&\n refreshingPromise &&\n (options.headers as Record)?.authorization\n ) {\n const newAccessToken = await refreshingPromise\n .catch(() => {\n // refreshing token from other request failed, retry without authorization\n return '';\n });\n \n options.headers = {\n ...(options.headers || {}),\n authorization: newAccessToken,\n };\n }\n\n return fetch(uri, options).then(async response => {\n const text = await response.text();\n const json = JSON.parse(text);\n\n // check for unauthorized errors, if not present, just return result\n if (\n isRefreshRequestOptions(options) ||\n !json?.errors ||\n !Array.isArray(json.errors) ||\n !hasUnauthorizedError(json.errors)\n ) {\n return {\n ...response,\n ok: true,\n json: async () =>\n new Promise(resolve => {\n resolve(json);\n }),\n text: async () =>\n new Promise(resolve => {\n resolve(text);\n }),\n };\n }\n\n // If unauthorized, refresh token and try again\n if (!refreshingPromise) {\n refreshingPromise = refreshToken()\n .then(async (tokens): Promise => {\n refreshingPromise = null;\n\n if (!tokens?.accessToken) {\n throw new Error('Session expired');\n }\n\n return tokens?.accessToken;\n })\n .catch(() => {\n refreshingPromise = null;\n\n // can't refresh token. logging out\n logout();\n throw new Error('Session expired');\n });\n }\n\n // success or any non-auth error\n return refreshingPromise\n .then(async (newAccessToken: string) => {\n // wait for other request's refreshing query to finish, when retry\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: newAccessToken,\n },\n });\n })\n .catch(async () => {\n // refreshing token from other request failed, retry without authorization\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: '',\n },\n });\n });\n });\n };\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"/** Global singleton for refreshing promise */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90393e"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-ad18b4"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ad18b4"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa24e7"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"/** Checks if GraphQl errors has unauthenticated error */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2c2f82"},"children":[{"type":"text","value":"hasUnauthorizedError"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b67ae4"},"children":[{"type":"text","value":"Array"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":"<{ "}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"code"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":"?:"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b67ae4"},"children":[{"type":"text","value":"ErrorCode"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" }>)"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ad18b4"},"children":[{"type":"text","value":"Array"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"isArray"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"&&"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"some"}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"status"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-afc81b"},"children":[{"type":"text","value":"401"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// Distinguish unauthorized error here"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"/** Detects if customFetch is sending refresh request */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2c2f82"},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b67ae4"},"children":[{"type":"text","value":"RequestInit"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-73c394"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ad18b4"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"operationName"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"==="}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8edec8"},"children":[{"type":"text","value":"'RefreshToken'"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa24e7"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"/** fetchWithTokenRefresh is a custom fetch function with token refresh for apollo */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-73c394"},"children":[{"type":"text","value":"fetchWithTokenRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"="}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":": () "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":": () "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" { accessToken: "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa24e7"},"children":[{"type":"text","value":"undefined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ) "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b67ae4"},"children":[{"type":"text","value":"RequestInit"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b67ae4"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-b67ae4"},"children":[{"type":"text","value":"Response"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// already refreshing token, wait for it and then use refreshed token"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// or use empty authorization if refreshing failed"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"&&"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"&&"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"as"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90393e"},"children":[{"type":"text","value":"Record"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-ad18b4"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-ad18b4"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":">)?."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"authorization"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-73c394"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"refreshingPromise"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// refreshing token from other request failed, retry without authorization"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8edec8"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" {}),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"fetch"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"async"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-73c394"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-73c394"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"="}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// check for unauthorized errors, if not present, just return result"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"isRefreshRequestOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"||"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"||"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"hasUnauthorizedError"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"errors"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ok: "}]},{"type":"element","tag":"span","props":{"class":"ct-fa24e7"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"unknown"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":">("}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":">("}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"text"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// If unauthorized, refresh token and try again"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"refreshToken"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"()"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-2c2f82"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b67ae4"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa24e7"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ad18b4"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-8edec8"},"children":[{"type":"text","value":"'Session expired'"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"tokens"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"refreshingPromise"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fa24e7"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// can't refresh token. logging out"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"logout"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ad18b4"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-8edec8"},"children":[{"type":"text","value":"'Session expired'"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// success or any non-auth error"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"refreshingPromise"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-2c2f82"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-8f51b2"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-67bf9e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f22a4a"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-f419fe"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-9341de"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// wait for other request's refreshing query to finish, when retry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"fetch"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" {}),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"newAccessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-c8d8bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4762e0"},"children":[{"type":"text","value":"// refreshing token from other request failed, retry without authorization"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-701850"},"children":[{"type":"text","value":"fetch"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"uri"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" headers: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6c128f"},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-323b77"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" {}),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" authorization: "}]},{"type":"element","tag":"span","props":{"class":"ct-8edec8"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f6697b"},"children":[{"type":"text","value":" };"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-8edec8{color:#A5D6FF}.ct-73c394{color:#79C0FF}.ct-afc81b{color:#79C0FF}.ct-b67ae4{color:#FFA657}.ct-fa24e7{color:#79C0FF}.ct-6c128f{color:#C9D1D9}.ct-4762e0{color:#8B949E}.ct-90393e{color:#FFA657}.ct-f419fe{color:#FF7B72}.ct-2c2f82{color:#D2A8FF}.ct-ad18b4{color:#79C0FF}.ct-f22a4a{color:#79C0FF}.ct-67bf9e{color:#FF7B72}.ct-8f51b2{color:#FFA657}.ct-9341de{color:#C9D1D9}.ct-701850{color:#D2A8FF}.ct-c8d8bc{color:#FF7B72}.ct-f6697b{color:#C9D1D9}.ct-323b77{color:#FF7B72}.light .ct-323b77{color:#859900}.light .ct-f6697b{color:#657B83}.light .ct-c8d8bc{color:#073642}.light .ct-701850{color:#268BD2}.light .ct-9341de{color:#657B83}.light .ct-8f51b2{color:#657B83}.light .ct-67bf9e{color:#859900}.light .ct-f22a4a{color:#859900}.light .ct-ad18b4{color:#859900}.light .ct-2c2f82{color:#268BD2}.light .ct-f419fe{color:#073642}.light .ct-90393e{color:#268BD2}.light .ct-4762e0{color:#93A1A1}.light .ct-6c128f{color:#268BD2}.light .ct-fa24e7{color:#B58900}.light .ct-b67ae4{color:#268BD2}.light .ct-afc81b{color:#D33682}.light .ct-73c394{color:#268BD2}.light .ct-8edec8{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:GraphQL:Refresh token in Apollo client.md","_source":"content","_file":"GraphQL/Refresh token in Apollo client.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/PwERR4vHv2.json b/docs/api/_content/query/PwERR4vHv2.json index 058dfd6..041375d 100644 --- a/docs/api/_content/query/PwERR4vHv2.json +++ b/docs/api/_content/query/PwERR4vHv2.json @@ -1 +1 @@ -{"_path":"/frontend/react-native/oauth2-login","_dir":"react-native","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"OAuth2 Login","description":"Use #oauth2 login with React-Native","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Use #oauth2 login with React-Native"}]},{"type":"element","tag":"h2","props":{"id":"common-oauth2-providers"},"children":[{"type":"text","value":"Common OAuth2 providers"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Can be handled by "},{"type":"element","tag":"a","props":{"href":"react-native-app-auth"},"children":[{"type":"text","value":"react-native-app-auth"}]},{"type":"text","value":" by redirecting to url "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"com.yourapp://oauth2provider"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h3","props":{"id":"example-for-google"},"children":[{"type":"text","value":"Example for #Google"}]},{"type":"element","tag":"code","props":{"code":"import { authorize } from 'react-native-app-auth';\n\nconst GOOGLE_OAUTH_CLIENT = '...';\n\n// ...\nconst authState = await authorize({\n issuer: 'https://accounts.google.com',\n clientId: `${GOOGLE_OAUTH_CLIENT}.apps.googleusercontent.com`,\n redirectUrl: `com.yourapp:/oauth2redirect/google`,\n scopes: ['openid', 'profile'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { authorize } from 'react-native-app-auth';\n\nconst GOOGLE_OAUTH_CLIENT = '...';\n\n// ...\nconst authState = await authorize({\n issuer: 'https://accounts.google.com',\n clientId: `${GOOGLE_OAUTH_CLIENT}.apps.googleusercontent.com`,\n redirectUrl: `com.yourapp:/oauth2redirect/google`,\n scopes: ['openid', 'profile'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"example-for-yandex"},"children":[{"type":"text","value":"Example for #Yandex"}]},{"type":"element","tag":"code","props":{"code":"const YANDEX_OAUTH_CLIENT = '...';\nconst YANDEX_OAUTH_SECRET = '...'; // better hide it somehow\nconst APP_ID = 'com.yourapp';\n\nconst authState = await authorize({\n serviceConfiguration: {\n authorizationEndpoint: `https://oauth.yandex.ru/authorize?response_type=code&client_id=${YANDEX_OAUTH_CLIENT}&redirect_uri=${APP_ID}:/oauth2redirect`,\n // TODO: replace it with your own backend to secure client_secret:\n tokenEndpoint: `https://oauth.yandex.ru/token?grant_type=authorization_code&client_id=${YANDEX_OAUTH_CLIENT}&client_secret=${YANDEX_OAUTH_SECRET}`,\n },\n clientId: YANDEX_OAUTH_CLIENT,\n redirectUrl: `${APP_ID}:/oauth2redirect`,\n scopes: ['login:info', 'login:avatar'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n\ncallback(authState.accessToken);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const YANDEX_OAUTH_CLIENT = '...';\nconst YANDEX_OAUTH_SECRET = '...'; // better hide it somehow\nconst APP_ID = 'com.yourapp';\n\nconst authState = await authorize({\n serviceConfiguration: {\n authorizationEndpoint: `https://oauth.yandex.ru/authorize?response_type=code&client_id=${YANDEX_OAUTH_CLIENT}&redirect_uri=${APP_ID}:/oauth2redirect`,\n // TODO: replace it with your own backend to secure client_secret:\n tokenEndpoint: `https://oauth.yandex.ru/token?grant_type=authorization_code&client_id=${YANDEX_OAUTH_CLIENT}&client_secret=${YANDEX_OAUTH_SECRET}`,\n },\n clientId: YANDEX_OAUTH_CLIENT,\n redirectUrl: `${APP_ID}:/oauth2redirect`,\n scopes: ['login:info', 'login:avatar'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n\ncallback(authState.accessToken);\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"apple-id-login"},"children":[{"type":"text","value":"Apple ID login"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/invertase/react-native-apple-authentication","rel":["nofollow"]},"children":[{"type":"text","value":"react-native-apple-authentication"}]},{"type":"text","value":" has its own "},{"type":"element","tag":"a","props":{"href":"https://github.com/invertase/react-native-apple-authentication/tree/main/docs","rel":["nofollow"]},"children":[{"type":"text","value":"documentation"}]},{"type":"text","value":" on setting up OAuth using Apple ID."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Use #oauth2 login with React-Native"}]},{"type":"element","tag":"h2","props":{"id":"common-oauth2-providers"},"children":[{"type":"text","value":"Common OAuth2 providers"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Can be handled by "},{"type":"element","tag":"a","props":{"href":"react-native-app-auth"},"children":[{"type":"text","value":"react-native-app-auth"}]},{"type":"text","value":" by redirecting to url "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"com.yourapp://oauth2provider"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h3","props":{"id":"example-for-google"},"children":[{"type":"text","value":"Example for #Google"}]},{"type":"element","tag":"code","props":{"code":"import { authorize } from 'react-native-app-auth';\n\nconst GOOGLE_OAUTH_CLIENT = '...';\n\n// ...\nconst authState = await authorize({\n issuer: 'https://accounts.google.com',\n clientId: `${GOOGLE_OAUTH_CLIENT}.apps.googleusercontent.com`,\n redirectUrl: `com.yourapp:/oauth2redirect/google`,\n scopes: ['openid', 'profile'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-eaff2e"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-868453"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-eaff2e"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"'react-native-app-auth'"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6e5da4"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"GOOGLE_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eaff2e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-719333"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6e5da4"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"authState"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eaff2e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eaff2e"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5d2b2"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" issuer: "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"'https://accounts.google.com'"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" clientId: "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"GOOGLE_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"}.apps.googleusercontent.com`"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" redirectUrl: "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"`com.yourapp:/oauth2redirect/google`"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" scopes: ["}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"'openid'"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"'profile'"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":"],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" dangerouslyAllowInsecureHttpRequests: "}]},{"type":"element","tag":"span","props":{"class":"ct-919484"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":"});"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"example-for-yandex"},"children":[{"type":"text","value":"Example for #Yandex"}]},{"type":"element","tag":"code","props":{"code":"const YANDEX_OAUTH_CLIENT = '...';\nconst YANDEX_OAUTH_SECRET = '...'; // better hide it somehow\nconst APP_ID = 'com.yourapp';\n\nconst authState = await authorize({\n serviceConfiguration: {\n authorizationEndpoint: `https://oauth.yandex.ru/authorize?response_type=code&client_id=${YANDEX_OAUTH_CLIENT}&redirect_uri=${APP_ID}:/oauth2redirect`,\n // TODO: replace it with your own backend to secure client_secret:\n tokenEndpoint: `https://oauth.yandex.ru/token?grant_type=authorization_code&client_id=${YANDEX_OAUTH_CLIENT}&client_secret=${YANDEX_OAUTH_SECRET}`,\n },\n clientId: YANDEX_OAUTH_CLIENT,\n redirectUrl: `${APP_ID}:/oauth2redirect`,\n scopes: ['login:info', 'login:avatar'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n\ncallback(authState.accessToken);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6e5da4"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eaff2e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6e5da4"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"YANDEX_OAUTH_SECRET"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eaff2e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-719333"},"children":[{"type":"text","value":"// better hide it somehow"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6e5da4"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"APP_ID"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eaff2e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"'com.yourapp'"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6e5da4"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"authState"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eaff2e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-eaff2e"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d5d2b2"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" serviceConfiguration: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" authorizationEndpoint: "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"`https://oauth.yandex.ru/authorize?response_type=code&client_id=${"}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"}&redirect_uri=${"}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"APP_ID"}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"}:/oauth2redirect`"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-719333"},"children":[{"type":"text","value":"// TODO: replace it with your own backend to secure client_secret:"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" tokenEndpoint: "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"`https://oauth.yandex.ru/token?grant_type=authorization_code&client_id=${"}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"}&client_secret=${"}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"YANDEX_OAUTH_SECRET"}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" clientId: "}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" redirectUrl: "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-b47256"},"children":[{"type":"text","value":"APP_ID"}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"}:/oauth2redirect`"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" scopes: ["}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"'login:info'"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e50739"},"children":[{"type":"text","value":"'login:avatar'"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":"],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":" dangerouslyAllowInsecureHttpRequests: "}]},{"type":"element","tag":"span","props":{"class":"ct-919484"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":"});"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d5d2b2"},"children":[{"type":"text","value":"callback"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-868453"},"children":[{"type":"text","value":"authState"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-868453"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-f06536"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"apple-id-login"},"children":[{"type":"text","value":"Apple ID login"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/invertase/react-native-apple-authentication","rel":["nofollow"]},"children":[{"type":"text","value":"react-native-apple-authentication"}]},{"type":"text","value":" has its own "},{"type":"element","tag":"a","props":{"href":"https://github.com/invertase/react-native-apple-authentication/tree/main/docs","rel":["nofollow"]},"children":[{"type":"text","value":"documentation"}]},{"type":"text","value":" on setting up OAuth using Apple ID."}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-919484{color:#79C0FF}.ct-d5d2b2{color:#D2A8FF}.ct-719333{color:#8B949E}.ct-b47256{color:#79C0FF}.ct-6e5da4{color:#FF7B72}.ct-e50739{color:#A5D6FF}.ct-868453{color:#C9D1D9}.ct-f06536{color:#C9D1D9}.ct-eaff2e{color:#FF7B72}.light .ct-eaff2e{color:#859900}.light .ct-f06536{color:#657B83}.light .ct-868453{color:#268BD2}.light .ct-e50739{color:#2AA198}.light .ct-6e5da4{color:#073642}.light .ct-b47256{color:#268BD2}.light .ct-719333{color:#93A1A1}.light .ct-d5d2b2{color:#268BD2}.light .ct-919484{color:#B58900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"common-oauth2-providers","depth":2,"text":"Common OAuth2 providers","children":[{"id":"example-for-google","depth":3,"text":"Example for #Google"},{"id":"example-for-yandex","depth":3,"text":"Example for #Yandex"}]},{"id":"apple-id-login","depth":2,"text":"Apple ID login"}]}},"_type":"markdown","_id":"content:Frontend:React Native:OAuth2 login.md","_source":"content","_file":"Frontend/React Native/OAuth2 login.md","_extension":"md"} \ No newline at end of file +{"_path":"/frontend/react-native/oauth2-login","_dir":"react-native","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"OAuth2 Login","description":"Use #oauth2 login with React-Native","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Use #oauth2 login with React-Native"}]},{"type":"element","tag":"h2","props":{"id":"common-oauth2-providers"},"children":[{"type":"text","value":"Common OAuth2 providers"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Can be handled by "},{"type":"element","tag":"a","props":{"href":"react-native-app-auth"},"children":[{"type":"text","value":"react-native-app-auth"}]},{"type":"text","value":" by redirecting to url "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"com.yourapp://oauth2provider"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h3","props":{"id":"example-for-google"},"children":[{"type":"text","value":"Example for #Google"}]},{"type":"element","tag":"code","props":{"code":"import { authorize } from 'react-native-app-auth';\n\nconst GOOGLE_OAUTH_CLIENT = '...';\n\n// ...\nconst authState = await authorize({\n issuer: 'https://accounts.google.com',\n clientId: `${GOOGLE_OAUTH_CLIENT}.apps.googleusercontent.com`,\n redirectUrl: `com.yourapp:/oauth2redirect/google`,\n scopes: ['openid', 'profile'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { authorize } from 'react-native-app-auth';\n\nconst GOOGLE_OAUTH_CLIENT = '...';\n\n// ...\nconst authState = await authorize({\n issuer: 'https://accounts.google.com',\n clientId: `${GOOGLE_OAUTH_CLIENT}.apps.googleusercontent.com`,\n redirectUrl: `com.yourapp:/oauth2redirect/google`,\n scopes: ['openid', 'profile'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"example-for-yandex"},"children":[{"type":"text","value":"Example for #Yandex"}]},{"type":"element","tag":"code","props":{"code":"const YANDEX_OAUTH_CLIENT = '...';\nconst YANDEX_OAUTH_SECRET = '...'; // better hide it somehow\nconst APP_ID = 'com.yourapp';\n\nconst authState = await authorize({\n serviceConfiguration: {\n authorizationEndpoint: `https://oauth.yandex.ru/authorize?response_type=code&client_id=${YANDEX_OAUTH_CLIENT}&redirect_uri=${APP_ID}:/oauth2redirect`,\n // TODO: replace it with your own backend to secure client_secret:\n tokenEndpoint: `https://oauth.yandex.ru/token?grant_type=authorization_code&client_id=${YANDEX_OAUTH_CLIENT}&client_secret=${YANDEX_OAUTH_SECRET}`,\n },\n clientId: YANDEX_OAUTH_CLIENT,\n redirectUrl: `${APP_ID}:/oauth2redirect`,\n scopes: ['login:info', 'login:avatar'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n\ncallback(authState.accessToken);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const YANDEX_OAUTH_CLIENT = '...';\nconst YANDEX_OAUTH_SECRET = '...'; // better hide it somehow\nconst APP_ID = 'com.yourapp';\n\nconst authState = await authorize({\n serviceConfiguration: {\n authorizationEndpoint: `https://oauth.yandex.ru/authorize?response_type=code&client_id=${YANDEX_OAUTH_CLIENT}&redirect_uri=${APP_ID}:/oauth2redirect`,\n // TODO: replace it with your own backend to secure client_secret:\n tokenEndpoint: `https://oauth.yandex.ru/token?grant_type=authorization_code&client_id=${YANDEX_OAUTH_CLIENT}&client_secret=${YANDEX_OAUTH_SECRET}`,\n },\n clientId: YANDEX_OAUTH_CLIENT,\n redirectUrl: `${APP_ID}:/oauth2redirect`,\n scopes: ['login:info', 'login:avatar'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n\ncallback(authState.accessToken);\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"apple-id-login"},"children":[{"type":"text","value":"Apple ID login"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/invertase/react-native-apple-authentication","rel":["nofollow"]},"children":[{"type":"text","value":"react-native-apple-authentication"}]},{"type":"text","value":" has its own "},{"type":"element","tag":"a","props":{"href":"https://github.com/invertase/react-native-apple-authentication/tree/main/docs","rel":["nofollow"]},"children":[{"type":"text","value":"documentation"}]},{"type":"text","value":" on setting up OAuth using Apple ID."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Use #oauth2 login with React-Native"}]},{"type":"element","tag":"h2","props":{"id":"common-oauth2-providers"},"children":[{"type":"text","value":"Common OAuth2 providers"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Can be handled by "},{"type":"element","tag":"a","props":{"href":"react-native-app-auth"},"children":[{"type":"text","value":"react-native-app-auth"}]},{"type":"text","value":" by redirecting to url "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"com.yourapp://oauth2provider"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h3","props":{"id":"example-for-google"},"children":[{"type":"text","value":"Example for #Google"}]},{"type":"element","tag":"code","props":{"code":"import { authorize } from 'react-native-app-auth';\n\nconst GOOGLE_OAUTH_CLIENT = '...';\n\n// ...\nconst authState = await authorize({\n issuer: 'https://accounts.google.com',\n clientId: `${GOOGLE_OAUTH_CLIENT}.apps.googleusercontent.com`,\n redirectUrl: `com.yourapp:/oauth2redirect/google`,\n scopes: ['openid', 'profile'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fcc1c9"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-7e1821"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-fcc1c9"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"'react-native-app-auth'"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-61e140"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"GOOGLE_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcc1c9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-066bc3"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-61e140"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"authState"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcc1c9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcc1c9"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d120b8"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" issuer: "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"'https://accounts.google.com'"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" clientId: "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"GOOGLE_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"}.apps.googleusercontent.com`"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" redirectUrl: "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"`com.yourapp:/oauth2redirect/google`"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" scopes: ["}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"'openid'"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"'profile'"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":"],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" dangerouslyAllowInsecureHttpRequests: "}]},{"type":"element","tag":"span","props":{"class":"ct-d8fab0"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":"});"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"example-for-yandex"},"children":[{"type":"text","value":"Example for #Yandex"}]},{"type":"element","tag":"code","props":{"code":"const YANDEX_OAUTH_CLIENT = '...';\nconst YANDEX_OAUTH_SECRET = '...'; // better hide it somehow\nconst APP_ID = 'com.yourapp';\n\nconst authState = await authorize({\n serviceConfiguration: {\n authorizationEndpoint: `https://oauth.yandex.ru/authorize?response_type=code&client_id=${YANDEX_OAUTH_CLIENT}&redirect_uri=${APP_ID}:/oauth2redirect`,\n // TODO: replace it with your own backend to secure client_secret:\n tokenEndpoint: `https://oauth.yandex.ru/token?grant_type=authorization_code&client_id=${YANDEX_OAUTH_CLIENT}&client_secret=${YANDEX_OAUTH_SECRET}`,\n },\n clientId: YANDEX_OAUTH_CLIENT,\n redirectUrl: `${APP_ID}:/oauth2redirect`,\n scopes: ['login:info', 'login:avatar'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n\ncallback(authState.accessToken);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-61e140"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcc1c9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-61e140"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"YANDEX_OAUTH_SECRET"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcc1c9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":"; "}]},{"type":"element","tag":"span","props":{"class":"ct-066bc3"},"children":[{"type":"text","value":"// better hide it somehow"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-61e140"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"APP_ID"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcc1c9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"'com.yourapp'"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-61e140"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"authState"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcc1c9"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fcc1c9"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d120b8"},"children":[{"type":"text","value":"authorize"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" serviceConfiguration: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" authorizationEndpoint: "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"`https://oauth.yandex.ru/authorize?response_type=code&client_id=${"}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"}&redirect_uri=${"}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"APP_ID"}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"}:/oauth2redirect`"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-066bc3"},"children":[{"type":"text","value":"// TODO: replace it with your own backend to secure client_secret:"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" tokenEndpoint: "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"`https://oauth.yandex.ru/token?grant_type=authorization_code&client_id=${"}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"}&client_secret=${"}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"YANDEX_OAUTH_SECRET"}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" clientId: "}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"YANDEX_OAUTH_CLIENT"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" redirectUrl: "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-9cb20b"},"children":[{"type":"text","value":"APP_ID"}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"}:/oauth2redirect`"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" scopes: ["}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"'login:info'"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-536010"},"children":[{"type":"text","value":"'login:avatar'"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":"],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":" dangerouslyAllowInsecureHttpRequests: "}]},{"type":"element","tag":"span","props":{"class":"ct-d8fab0"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":"});"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d120b8"},"children":[{"type":"text","value":"callback"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7e1821"},"children":[{"type":"text","value":"authState"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7e1821"},"children":[{"type":"text","value":"accessToken"}]},{"type":"element","tag":"span","props":{"class":"ct-43a365"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"apple-id-login"},"children":[{"type":"text","value":"Apple ID login"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/invertase/react-native-apple-authentication","rel":["nofollow"]},"children":[{"type":"text","value":"react-native-apple-authentication"}]},{"type":"text","value":" has its own "},{"type":"element","tag":"a","props":{"href":"https://github.com/invertase/react-native-apple-authentication/tree/main/docs","rel":["nofollow"]},"children":[{"type":"text","value":"documentation"}]},{"type":"text","value":" on setting up OAuth using Apple ID."}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-d8fab0{color:#79C0FF}.ct-d120b8{color:#D2A8FF}.ct-066bc3{color:#8B949E}.ct-9cb20b{color:#79C0FF}.ct-61e140{color:#FF7B72}.ct-536010{color:#A5D6FF}.ct-7e1821{color:#C9D1D9}.ct-43a365{color:#C9D1D9}.ct-fcc1c9{color:#FF7B72}.light .ct-fcc1c9{color:#859900}.light .ct-43a365{color:#657B83}.light .ct-7e1821{color:#268BD2}.light .ct-536010{color:#2AA198}.light .ct-61e140{color:#073642}.light .ct-9cb20b{color:#268BD2}.light .ct-066bc3{color:#93A1A1}.light .ct-d120b8{color:#268BD2}.light .ct-d8fab0{color:#B58900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"common-oauth2-providers","depth":2,"text":"Common OAuth2 providers","children":[{"id":"example-for-google","depth":3,"text":"Example for #Google"},{"id":"example-for-yandex","depth":3,"text":"Example for #Yandex"}]},{"id":"apple-id-login","depth":2,"text":"Apple ID login"}]}},"_type":"markdown","_id":"content:Frontend:React Native:OAuth2 login.md","_source":"content","_file":"Frontend/React Native/OAuth2 login.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/QqziXmSF9l.json b/docs/api/_content/query/QqziXmSF9l.json index 9f47f7f..8708b98 100644 --- a/docs/api/_content/query/QqziXmSF9l.json +++ b/docs/api/_content/query/QqziXmSF9l.json @@ -1 +1 @@ -{"_path":"/frontend/react-native/useful-comands","_dir":"react-native","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Useful Comands","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"show-android-logcat"},"children":[{"type":"text","value":"Show android logcat"}]},{"type":"element","tag":"code","props":{"code":"adb logcat com.application:I \"*:S\"\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"adb logcat com.application:I \"*:S\"\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"get-apks-sha-256"},"children":[{"type":"text","value":"Get .apk's SHA-256"}]},{"type":"element","tag":"code","props":{"code":"keytool -printcert -jarfile \"$1\"\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"keytool -printcert -jarfile \"$1\"\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"assemble-debug-release-on-android"},"children":[{"type":"text","value":"Assemble debug release on Android"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Packages release with bundled resources."}]},{"type":"element","tag":"code","props":{"code":"npx react-native bundle \\\n --platform android \\\n --dev false \\\n --entry-file index.js \\\n --bundle-output android/app/src/main/assets/index.android.bundle \\\n --assets-dest android/app/src/main/res/\n\ncd android && ./gradlew assembleDebug\n\n# do your stuff\n\n./gradlew clean\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"npx react-native bundle \\\n --platform android \\\n --dev false \\\n --entry-file index.js \\\n --bundle-output android/app/src/main/assets/index.android.bundle \\\n --assets-dest android/app/src/main/res/\n\ncd android && ./gradlew assembleDebug\n\n# do your stuff\n\n./gradlew clean\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"send-release-to-android-device"},"children":[{"type":"text","value":"Send release to Android device"}]},{"type":"element","tag":"code","props":{"code":"cd ./android \\\n && ./gradlew assembleRelease \\\n && adb install ./app/build/outputs/apk/release/app-release.apk\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"cd ./android \\\n && ./gradlew assembleRelease \\\n && adb install ./app/build/outputs/apk/release/app-release.apk\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"deep-links"},"children":[{"type":"text","value":"Deep links"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://zarah.dev/2022/02/08/android12-deeplinks.html","rel":["nofollow"]},"children":[{"type":"text","value":"https://zarah.dev/2022/02/08/android12-deeplinks.html"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://developer.android.com/training/app-links/verify-site-associations#invoke-domain-verification","rel":["nofollow"]},"children":[{"type":"text","value":"https://developer.android.com/training/app-links/verify-site-associations#invoke-domain-verification"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://digitalassetlinks.googleapis.com/v1/statements:list?source.web.site=https://miin.ru&relation=delegate_permission/common.handle_all_urls","rel":["nofollow"]},"children":[{"type":"text","value":"https://digitalassetlinks.googleapis.com/v1/statements:list?source.web.site=https://miin.ru&relation=delegate_permission/common.handle_all_urls"}]}]}]},{"type":"element","tag":"h3","props":{"id":"open-deep-links"},"children":[{"type":"text","value":"Open deep links"}]},{"type":"element","tag":"code","props":{"code":"# ios \nxcrun simctl openurl booted $1\n\n# android\nadb shell am start -W -a android.intent.action.VIEW -d $1 \\\ncom.application\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"# ios \nxcrun simctl openurl booted $1\n\n# android\nadb shell am start -W -a android.intent.action.VIEW -d $1 \\\ncom.application\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"reverify-links-on-android"},"children":[{"type":"text","value":"Reverify links on Android"}]},{"type":"element","tag":"code","props":{"code":"PACKAGE=\"com.application\"\n\nadb shell pm set-app-links --package $PACKAGE 0 all && \\\n adb shell pm verify-app-links --re-verify $PACKAGE\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"PACKAGE=\"com.application\"\n\nadb shell pm set-app-links --package $PACKAGE 0 all && \\\n adb shell pm verify-app-links --re-verify $PACKAGE\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"show-android-logcat"},"children":[{"type":"text","value":"Show android logcat"}]},{"type":"element","tag":"code","props":{"code":"adb logcat com.application:I \"*:S\"\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":"adb logcat com.application:I "}]},{"type":"element","tag":"span","props":{"class":"ct-a26332"},"children":[{"type":"text","value":"\"*:S\""}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"get-apks-sha-256"},"children":[{"type":"text","value":"Get .apk's SHA-256"}]},{"type":"element","tag":"code","props":{"code":"keytool -printcert -jarfile \"$1\"\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":"keytool -printcert -jarfile "}]},{"type":"element","tag":"span","props":{"class":"ct-a26332"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-ccecdb"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-152964"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-a26332"},"children":[{"type":"text","value":"\""}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"assemble-debug-release-on-android"},"children":[{"type":"text","value":"Assemble debug release on Android"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Packages release with bundled resources."}]},{"type":"element","tag":"code","props":{"code":"npx react-native bundle \\\n --platform android \\\n --dev false \\\n --entry-file index.js \\\n --bundle-output android/app/src/main/assets/index.android.bundle \\\n --assets-dest android/app/src/main/res/\n\ncd android && ./gradlew assembleDebug\n\n# do your stuff\n\n./gradlew clean\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":"npx react-native bundle \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" --platform android \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" --dev "}]},{"type":"element","tag":"span","props":{"class":"ct-3ec95f"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" --entry-file index.js \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" --bundle-output android/app/src/main/assets/index.android.bundle \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" --assets-dest android/app/src/main/res/"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3ec95f"},"children":[{"type":"text","value":"cd"}]},{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" android "}]},{"type":"element","tag":"span","props":{"class":"ct-7aad02"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" ./gradlew assembleDebug"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-96a46f"},"children":[{"type":"text","value":"# do your stuff"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":"./gradlew clean"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"send-release-to-android-device"},"children":[{"type":"text","value":"Send release to Android device"}]},{"type":"element","tag":"code","props":{"code":"cd ./android \\\n && ./gradlew assembleRelease \\\n && adb install ./app/build/outputs/apk/release/app-release.apk\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3ec95f"},"children":[{"type":"text","value":"cd"}]},{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" ./android \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7aad02"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" ./gradlew assembleRelease \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7aad02"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" adb install ./app/build/outputs/apk/release/app-release.apk"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"deep-links"},"children":[{"type":"text","value":"Deep links"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://zarah.dev/2022/02/08/android12-deeplinks.html","rel":["nofollow"]},"children":[{"type":"text","value":"https://zarah.dev/2022/02/08/android12-deeplinks.html"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://developer.android.com/training/app-links/verify-site-associations#invoke-domain-verification","rel":["nofollow"]},"children":[{"type":"text","value":"https://developer.android.com/training/app-links/verify-site-associations#invoke-domain-verification"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://digitalassetlinks.googleapis.com/v1/statements:list?source.web.site=https://miin.ru&relation=delegate_permission/common.handle_all_urls","rel":["nofollow"]},"children":[{"type":"text","value":"https://digitalassetlinks.googleapis.com/v1/statements:list?source.web.site=https://miin.ru&relation=delegate_permission/common.handle_all_urls"}]}]}]},{"type":"element","tag":"h3","props":{"id":"open-deep-links"},"children":[{"type":"text","value":"Open deep links"}]},{"type":"element","tag":"code","props":{"code":"# ios \nxcrun simctl openurl booted $1\n\n# android\nadb shell am start -W -a android.intent.action.VIEW -d $1 \\\ncom.application\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-96a46f"},"children":[{"type":"text","value":"# ios "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":"xcrun simctl openurl booted "}]},{"type":"element","tag":"span","props":{"class":"ct-ccecdb"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-152964"},"children":[{"type":"text","value":"1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-96a46f"},"children":[{"type":"text","value":"# android"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":"adb shell am start -W -a android.intent.action.VIEW -d "}]},{"type":"element","tag":"span","props":{"class":"ct-ccecdb"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-152964"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":"com.application"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"reverify-links-on-android"},"children":[{"type":"text","value":"Reverify links on Android"}]},{"type":"element","tag":"code","props":{"code":"PACKAGE=\"com.application\"\n\nadb shell pm set-app-links --package $PACKAGE 0 all && \\\n adb shell pm verify-app-links --re-verify $PACKAGE\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":"PACKAGE="}]},{"type":"element","tag":"span","props":{"class":"ct-a26332"},"children":[{"type":"text","value":"\"com.application\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":"adb shell pm set-app-links --package "}]},{"type":"element","tag":"span","props":{"class":"ct-ccecdb"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-152964"},"children":[{"type":"text","value":"PACKAGE"}]},{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" 0 all "}]},{"type":"element","tag":"span","props":{"class":"ct-7aad02"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e9d7d1"},"children":[{"type":"text","value":" adb shell pm verify-app-links --re-verify "}]},{"type":"element","tag":"span","props":{"class":"ct-ccecdb"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-152964"},"children":[{"type":"text","value":"PACKAGE"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-96a46f{color:#8B949E}.ct-7aad02{color:#FF7B72}.ct-3ec95f{color:#79C0FF}.ct-152964{color:#C9D1D9}.ct-ccecdb{color:#C9D1D9}.ct-a26332{color:#A5D6FF}.ct-e9d7d1{color:#C9D1D9}.light .ct-e9d7d1{color:#657B83}.light .ct-a26332{color:#2AA198}.light .ct-ccecdb{color:#859900}.light .ct-152964{color:#268BD2}.light .ct-3ec95f{color:#268BD2}.light .ct-7aad02{color:#859900}.light .ct-96a46f{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"show-android-logcat","depth":2,"text":"Show android logcat"},{"id":"get-apks-sha-256","depth":2,"text":"Get .apk's SHA-256"},{"id":"assemble-debug-release-on-android","depth":2,"text":"Assemble debug release on Android"},{"id":"send-release-to-android-device","depth":2,"text":"Send release to Android device"},{"id":"deep-links","depth":2,"text":"Deep links","children":[{"id":"open-deep-links","depth":3,"text":"Open deep links"},{"id":"reverify-links-on-android","depth":3,"text":"Reverify links on Android"}]}]}},"_type":"markdown","_id":"content:Frontend:React Native:Useful comands.md","_source":"content","_file":"Frontend/React Native/Useful comands.md","_extension":"md"} \ No newline at end of file +{"_path":"/frontend/react-native/useful-comands","_dir":"react-native","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Useful Comands","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"show-android-logcat"},"children":[{"type":"text","value":"Show android logcat"}]},{"type":"element","tag":"code","props":{"code":"adb logcat com.application:I \"*:S\"\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"adb logcat com.application:I \"*:S\"\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"get-apks-sha-256"},"children":[{"type":"text","value":"Get .apk's SHA-256"}]},{"type":"element","tag":"code","props":{"code":"keytool -printcert -jarfile \"$1\"\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"keytool -printcert -jarfile \"$1\"\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"assemble-debug-release-on-android"},"children":[{"type":"text","value":"Assemble debug release on Android"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Packages release with bundled resources."}]},{"type":"element","tag":"code","props":{"code":"npx react-native bundle \\\n --platform android \\\n --dev false \\\n --entry-file index.js \\\n --bundle-output android/app/src/main/assets/index.android.bundle \\\n --assets-dest android/app/src/main/res/\n\ncd android && ./gradlew assembleDebug\n\n# do your stuff\n\n./gradlew clean\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"npx react-native bundle \\\n --platform android \\\n --dev false \\\n --entry-file index.js \\\n --bundle-output android/app/src/main/assets/index.android.bundle \\\n --assets-dest android/app/src/main/res/\n\ncd android && ./gradlew assembleDebug\n\n# do your stuff\n\n./gradlew clean\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"send-release-to-android-device"},"children":[{"type":"text","value":"Send release to Android device"}]},{"type":"element","tag":"code","props":{"code":"cd ./android \\\n && ./gradlew assembleRelease \\\n && adb install ./app/build/outputs/apk/release/app-release.apk\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"cd ./android \\\n && ./gradlew assembleRelease \\\n && adb install ./app/build/outputs/apk/release/app-release.apk\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"deep-links"},"children":[{"type":"text","value":"Deep links"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://zarah.dev/2022/02/08/android12-deeplinks.html","rel":["nofollow"]},"children":[{"type":"text","value":"https://zarah.dev/2022/02/08/android12-deeplinks.html"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://developer.android.com/training/app-links/verify-site-associations#invoke-domain-verification","rel":["nofollow"]},"children":[{"type":"text","value":"https://developer.android.com/training/app-links/verify-site-associations#invoke-domain-verification"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://digitalassetlinks.googleapis.com/v1/statements:list?source.web.site=https://miin.ru&relation=delegate_permission/common.handle_all_urls","rel":["nofollow"]},"children":[{"type":"text","value":"https://digitalassetlinks.googleapis.com/v1/statements:list?source.web.site=https://miin.ru&relation=delegate_permission/common.handle_all_urls"}]}]}]},{"type":"element","tag":"h3","props":{"id":"open-deep-links"},"children":[{"type":"text","value":"Open deep links"}]},{"type":"element","tag":"code","props":{"code":"# ios \nxcrun simctl openurl booted $1\n\n# android\nadb shell am start -W -a android.intent.action.VIEW -d $1 \\\ncom.application\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"# ios \nxcrun simctl openurl booted $1\n\n# android\nadb shell am start -W -a android.intent.action.VIEW -d $1 \\\ncom.application\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"reverify-links-on-android"},"children":[{"type":"text","value":"Reverify links on Android"}]},{"type":"element","tag":"code","props":{"code":"PACKAGE=\"com.application\"\n\nadb shell pm set-app-links --package $PACKAGE 0 all && \\\n adb shell pm verify-app-links --re-verify $PACKAGE\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"PACKAGE=\"com.application\"\n\nadb shell pm set-app-links --package $PACKAGE 0 all && \\\n adb shell pm verify-app-links --re-verify $PACKAGE\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"show-android-logcat"},"children":[{"type":"text","value":"Show android logcat"}]},{"type":"element","tag":"code","props":{"code":"adb logcat com.application:I \"*:S\"\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":"adb logcat com.application:I "}]},{"type":"element","tag":"span","props":{"class":"ct-ff9586"},"children":[{"type":"text","value":"\"*:S\""}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"get-apks-sha-256"},"children":[{"type":"text","value":"Get .apk's SHA-256"}]},{"type":"element","tag":"code","props":{"code":"keytool -printcert -jarfile \"$1\"\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":"keytool -printcert -jarfile "}]},{"type":"element","tag":"span","props":{"class":"ct-ff9586"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-5cb82a"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7e13bb"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-ff9586"},"children":[{"type":"text","value":"\""}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"assemble-debug-release-on-android"},"children":[{"type":"text","value":"Assemble debug release on Android"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Packages release with bundled resources."}]},{"type":"element","tag":"code","props":{"code":"npx react-native bundle \\\n --platform android \\\n --dev false \\\n --entry-file index.js \\\n --bundle-output android/app/src/main/assets/index.android.bundle \\\n --assets-dest android/app/src/main/res/\n\ncd android && ./gradlew assembleDebug\n\n# do your stuff\n\n./gradlew clean\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":"npx react-native bundle \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" --platform android \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" --dev "}]},{"type":"element","tag":"span","props":{"class":"ct-4e0208"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" --entry-file index.js \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" --bundle-output android/app/src/main/assets/index.android.bundle \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" --assets-dest android/app/src/main/res/"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e0208"},"children":[{"type":"text","value":"cd"}]},{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" android "}]},{"type":"element","tag":"span","props":{"class":"ct-1200ba"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" ./gradlew assembleDebug"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25c1b4"},"children":[{"type":"text","value":"# do your stuff"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":"./gradlew clean"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"send-release-to-android-device"},"children":[{"type":"text","value":"Send release to Android device"}]},{"type":"element","tag":"code","props":{"code":"cd ./android \\\n && ./gradlew assembleRelease \\\n && adb install ./app/build/outputs/apk/release/app-release.apk\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e0208"},"children":[{"type":"text","value":"cd"}]},{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" ./android \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1200ba"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" ./gradlew assembleRelease \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1200ba"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" adb install ./app/build/outputs/apk/release/app-release.apk"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"deep-links"},"children":[{"type":"text","value":"Deep links"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://zarah.dev/2022/02/08/android12-deeplinks.html","rel":["nofollow"]},"children":[{"type":"text","value":"https://zarah.dev/2022/02/08/android12-deeplinks.html"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://developer.android.com/training/app-links/verify-site-associations#invoke-domain-verification","rel":["nofollow"]},"children":[{"type":"text","value":"https://developer.android.com/training/app-links/verify-site-associations#invoke-domain-verification"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://digitalassetlinks.googleapis.com/v1/statements:list?source.web.site=https://miin.ru&relation=delegate_permission/common.handle_all_urls","rel":["nofollow"]},"children":[{"type":"text","value":"https://digitalassetlinks.googleapis.com/v1/statements:list?source.web.site=https://miin.ru&relation=delegate_permission/common.handle_all_urls"}]}]}]},{"type":"element","tag":"h3","props":{"id":"open-deep-links"},"children":[{"type":"text","value":"Open deep links"}]},{"type":"element","tag":"code","props":{"code":"# ios \nxcrun simctl openurl booted $1\n\n# android\nadb shell am start -W -a android.intent.action.VIEW -d $1 \\\ncom.application\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25c1b4"},"children":[{"type":"text","value":"# ios "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":"xcrun simctl openurl booted "}]},{"type":"element","tag":"span","props":{"class":"ct-5cb82a"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7e13bb"},"children":[{"type":"text","value":"1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-25c1b4"},"children":[{"type":"text","value":"# android"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":"adb shell am start -W -a android.intent.action.VIEW -d "}]},{"type":"element","tag":"span","props":{"class":"ct-5cb82a"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7e13bb"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":"com.application"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"reverify-links-on-android"},"children":[{"type":"text","value":"Reverify links on Android"}]},{"type":"element","tag":"code","props":{"code":"PACKAGE=\"com.application\"\n\nadb shell pm set-app-links --package $PACKAGE 0 all && \\\n adb shell pm verify-app-links --re-verify $PACKAGE\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":"PACKAGE="}]},{"type":"element","tag":"span","props":{"class":"ct-ff9586"},"children":[{"type":"text","value":"\"com.application\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":"adb shell pm set-app-links --package "}]},{"type":"element","tag":"span","props":{"class":"ct-5cb82a"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7e13bb"},"children":[{"type":"text","value":"PACKAGE"}]},{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" 0 all "}]},{"type":"element","tag":"span","props":{"class":"ct-1200ba"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af80c7"},"children":[{"type":"text","value":" adb shell pm verify-app-links --re-verify "}]},{"type":"element","tag":"span","props":{"class":"ct-5cb82a"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7e13bb"},"children":[{"type":"text","value":"PACKAGE"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-25c1b4{color:#8B949E}.ct-1200ba{color:#FF7B72}.ct-4e0208{color:#79C0FF}.ct-7e13bb{color:#C9D1D9}.ct-5cb82a{color:#C9D1D9}.ct-ff9586{color:#A5D6FF}.ct-af80c7{color:#C9D1D9}.light .ct-af80c7{color:#657B83}.light .ct-ff9586{color:#2AA198}.light .ct-5cb82a{color:#859900}.light .ct-7e13bb{color:#268BD2}.light .ct-4e0208{color:#268BD2}.light .ct-1200ba{color:#859900}.light .ct-25c1b4{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"show-android-logcat","depth":2,"text":"Show android logcat"},{"id":"get-apks-sha-256","depth":2,"text":"Get .apk's SHA-256"},{"id":"assemble-debug-release-on-android","depth":2,"text":"Assemble debug release on Android"},{"id":"send-release-to-android-device","depth":2,"text":"Send release to Android device"},{"id":"deep-links","depth":2,"text":"Deep links","children":[{"id":"open-deep-links","depth":3,"text":"Open deep links"},{"id":"reverify-links-on-android","depth":3,"text":"Reverify links on Android"}]}]}},"_type":"markdown","_id":"content:Frontend:React Native:Useful comands.md","_source":"content","_file":"Frontend/React Native/Useful comands.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/R77EQlrPEJ.json b/docs/api/_content/query/R77EQlrPEJ.json index 0fa137c..9e37009 100644 --- a/docs/api/_content/query/R77EQlrPEJ.json +++ b/docs/api/_content/query/R77EQlrPEJ.json @@ -1 +1 @@ -{"_path":"/frontend/webgl/basics-of-webgl-(drawing-a-cube)","_dir":"webgl","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Basics Of WebGL (Drawing A Cube)","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"helpful-documentation"},"children":[{"type":"text","value":"Helpful documentation"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://open.gl/","rel":["nofollow"]},"children":[{"type":"text","value":"https://open.gl/"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"This youtube series: "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=kB0ZVUrI4Aw","rel":["nofollow"]},"children":[{"type":"text","value":"Basics"}]},{"type":"text","value":", "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=3yLL9ADo-ko","rel":["nofollow"]},"children":[{"type":"text","value":"Making a cube, applying transformations"}]},{"type":"text","value":", "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=hpnd11doMgc&t=52s","rel":["nofollow"]},"children":[{"type":"text","value":"Texturing"}]}]}]},{"type":"element","tag":"h2","props":{"id":"vertices-and-indices"},"children":[{"type":"text","value":"Vertices and Indices"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertices"}]},{"type":"text","value":" are points with specific coordinates "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"{x,y,z}"}]},{"type":"text","value":" in a 3D-space. We can build any figure by connecting "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"vertices"}]},{"type":"text","value":" in triangles with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"indices"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"shaders"},"children":[{"type":"text","value":"Shaders"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shaders are functions, written in C, which describe how to draw and color polygons to Graphic Card."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" describe "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"vertice"}]},{"type":"text","value":" positions, so Graphic Card can position them by connecting with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"indices"}]},{"type":"text","value":" and project to 2D canvas."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" describe the way polygons should be colored by assigning colors to Vertices or by applying textures to polygons."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shaders can have parameters passed from Javascript code ("},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniforms"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"attributes"}]},{"type":"text","value":"). "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" can also access data from "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" (that ones called "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":")."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"img","props":{"alt":"","src":"https://open.gl/media/img/c2_pipeline.png"},"children":[]}]},{"type":"element","tag":"h2","props":{"id":"program"},"children":[{"type":"text","value":"Program"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Program, as far as I understand, is a scene, that's described with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertices"}]},{"type":"text","value":", "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Indices"}]},{"type":"text","value":", specific "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" and "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"applying-transformations"},"children":[{"type":"text","value":"Applying transformations"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The best way to change positions inside "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" or color in "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" is to pass parameters (also called "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniforms"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":")."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read about that at "},{"type":"element","tag":"a","props":{"href":"https://open.gl/transformations","rel":["nofollow"]},"children":[{"type":"text","value":"open.gl"}]},{"type":"text","value":" and at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"source-code-with-explanations"},"children":[{"type":"text","value":"Source code with explanations"}]},{"type":"element","tag":"code","props":{"code":"// render-a-cube.ts\nimport { createShader } from \"./create-shader\";\nimport vxShader from \"./vertex.glsl?raw\";\nimport fgShader from \"./fragment.glsl?raw\";\n\nconst canvas = document.getElementyId('view');\nconst ctx = canvas.getRenderingContext('webgl');\n\n// should be put inside requestAnimationFrame\ndrawCube(ctx)(); \n\nfunction drawCube (\n gl: WebGL2RenderingContext, \n width: number,\n height: number\n) {\n // Initializing viewport\n gl.viewport(0, 0, width, height);\n gl.clearColor(0, 0, 0, 0);\n gl.clear(gl.COLOR_BUFFER_BIT);\n\n const prg = gl.createProgram();\n if (!prg) {\n throw new Error(\"Can't init programm\");\n }\n\n // Setting up VERTEX and FRAGMENT shaders\n const vx = createShader(gl, vxShader, gl.VERTEX_SHADER);\n gl.attachShader(prg, vx);\n const fx = createShader(gl, fgShader, gl.FRAGMENT_SHADER);\n gl.attachShader(prg, fx);\n gl.linkProgram(prg);\n if (!gl.getProgramParameter(prg, gl.LINK_STATUS)) {\n throw new Error(\"Could not initialise shaders\");\n }\n\n // Cube's vertices Array<[x,y,z]>, 8 items\n const vertices = [\n -1, -1, -1, // 0\n 1, -1, -1, // 1\n 1, 1, -1, // 2\n -1, 1, -1, // 3\n -1, -1, 1, // 4\n 1, -1, 1, // 5\n 1, 1, 1, // 6\n -1, 1, 1, // 7\n ];\n\n // indices, that form triangles, that form cube sides\n const indices = [\n 2, 1, 0, // side 0 (first triangle)\n 0, 3, 2, // side 0 (second triangle)\n 0, 4, 7, // side 1 (first triangle)\n 7, 3, 0, // side 1 (second triangle)\n 0, 1, 5, // ...\n 5, 4, 0, \n 1, 2, 6, \n 6, 5, 1, \n 2, 3, 7, \n 7, 6, 2, \n 4, 5, 6, \n 6, 7, 4,\n ];\n\n // createe a vertex buffer and bind vertices to it\n const squareVertexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);\n gl.bindBuffer(gl.ARRAY_BUFFER, null);\n\n // create a vertex buffer and bind indices to it\n const squareIndexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, squareIndexBuffer);\n gl.bufferData(\n gl.ELEMENT_ARRAY_BUFFER,\n new Uint16Array(indices),\n gl.STATIC_DRAW\n );\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, null);\n\n // initial drawing\n gl.clearColor(0.0, 0.0, 0.0, 0.0);\n gl.enable(gl.DEPTH_TEST);\n gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);\n gl.viewport(0, 0, width, height);\n\n // bind squareVertexBuffer as vertex positions buffer\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n \n // send every 3 bytes from squareVertexBuffer as {x,y,z} for each verticle\n gl.vertexAttribPointer(\n gl.getAttribLocation(prg, \"aVertexPosition\"), \n 3, // 3 bytes-long\n gl.FLOAT,\n false, // don't normalize (int to float)\n 0, \n 0\n );\n // send vertice buffer as `aVertexPosition` attribute inside vertex shader\n gl.enableVertexAttribArray(\n gl.getAttribLocation(prg, \"aVertexPosition\")\n );\n\n let i = 0;\n let speed = 0.01;\n\n // that's the main rendering callback\n return () => {\n gl.useProgram(prg);\n\n const scale = i * 0.25 + 0.25;\n\n // used for scaling inside Vertex Shader\n gl.uniform1f(gl.getUniformLocation(prg, \"slide\"), scale);\n // GL Screen is square, so we need to fix it's aspect ration\n gl.uniform1f(gl.getUniformLocation(prg, \"aspect\"), height / width);\n\n gl.bindBuffer(\n gl.ELEMENT_ARRAY_BUFFER, \n squareIndexBuffer\n );\n \n gl.drawElements(\n gl.TRIANGLES, \n indices.length, \n gl.UNSIGNED_SHORT, \n 0,\n );\n\n if (i > 1 || i < 0) {\n speed = -speed;\n }\n\n i += speed;\n };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// render-a-cube.ts\nimport { createShader } from \"./create-shader\";\nimport vxShader from \"./vertex.glsl?raw\";\nimport fgShader from \"./fragment.glsl?raw\";\n\nconst canvas = document.getElementyId('view');\nconst ctx = canvas.getRenderingContext('webgl');\n\n// should be put inside requestAnimationFrame\ndrawCube(ctx)(); \n\nfunction drawCube (\n gl: WebGL2RenderingContext, \n width: number,\n height: number\n) {\n // Initializing viewport\n gl.viewport(0, 0, width, height);\n gl.clearColor(0, 0, 0, 0);\n gl.clear(gl.COLOR_BUFFER_BIT);\n\n const prg = gl.createProgram();\n if (!prg) {\n throw new Error(\"Can't init programm\");\n }\n\n // Setting up VERTEX and FRAGMENT shaders\n const vx = createShader(gl, vxShader, gl.VERTEX_SHADER);\n gl.attachShader(prg, vx);\n const fx = createShader(gl, fgShader, gl.FRAGMENT_SHADER);\n gl.attachShader(prg, fx);\n gl.linkProgram(prg);\n if (!gl.getProgramParameter(prg, gl.LINK_STATUS)) {\n throw new Error(\"Could not initialise shaders\");\n }\n\n // Cube's vertices Array<[x,y,z]>, 8 items\n const vertices = [\n -1, -1, -1, // 0\n 1, -1, -1, // 1\n 1, 1, -1, // 2\n -1, 1, -1, // 3\n -1, -1, 1, // 4\n 1, -1, 1, // 5\n 1, 1, 1, // 6\n -1, 1, 1, // 7\n ];\n\n // indices, that form triangles, that form cube sides\n const indices = [\n 2, 1, 0, // side 0 (first triangle)\n 0, 3, 2, // side 0 (second triangle)\n 0, 4, 7, // side 1 (first triangle)\n 7, 3, 0, // side 1 (second triangle)\n 0, 1, 5, // ...\n 5, 4, 0, \n 1, 2, 6, \n 6, 5, 1, \n 2, 3, 7, \n 7, 6, 2, \n 4, 5, 6, \n 6, 7, 4,\n ];\n\n // createe a vertex buffer and bind vertices to it\n const squareVertexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);\n gl.bindBuffer(gl.ARRAY_BUFFER, null);\n\n // create a vertex buffer and bind indices to it\n const squareIndexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, squareIndexBuffer);\n gl.bufferData(\n gl.ELEMENT_ARRAY_BUFFER,\n new Uint16Array(indices),\n gl.STATIC_DRAW\n );\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, null);\n\n // initial drawing\n gl.clearColor(0.0, 0.0, 0.0, 0.0);\n gl.enable(gl.DEPTH_TEST);\n gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);\n gl.viewport(0, 0, width, height);\n\n // bind squareVertexBuffer as vertex positions buffer\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n \n // send every 3 bytes from squareVertexBuffer as {x,y,z} for each verticle\n gl.vertexAttribPointer(\n gl.getAttribLocation(prg, \"aVertexPosition\"), \n 3, // 3 bytes-long\n gl.FLOAT,\n false, // don't normalize (int to float)\n 0, \n 0\n );\n // send vertice buffer as `aVertexPosition` attribute inside vertex shader\n gl.enableVertexAttribArray(\n gl.getAttribLocation(prg, \"aVertexPosition\")\n );\n\n let i = 0;\n let speed = 0.01;\n\n // that's the main rendering callback\n return () => {\n gl.useProgram(prg);\n\n const scale = i * 0.25 + 0.25;\n\n // used for scaling inside Vertex Shader\n gl.uniform1f(gl.getUniformLocation(prg, \"slide\"), scale);\n // GL Screen is square, so we need to fix it's aspect ration\n gl.uniform1f(gl.getUniformLocation(prg, \"aspect\"), height / width);\n\n gl.bindBuffer(\n gl.ELEMENT_ARRAY_BUFFER, \n squareIndexBuffer\n );\n \n gl.drawElements(\n gl.TRIANGLES, \n indices.length, \n gl.UNSIGNED_SHORT, \n 0,\n );\n\n if (i > 1 || i < 0) {\n speed = -speed;\n }\n\n i += speed;\n };\n};\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"shader-compiler"},"children":[{"type":"text","value":"Shader compiler"}]},{"type":"element","tag":"code","props":{"code":"// create-shader.ts\nexport const createShader = (\n gl: WebGL2RenderingContext,\n sourceCode: string,\n type: number, // gl.VERTEX_SHADER or gl.FRAGMENT_SHADER\n) => {\n const shader = gl.createShader(type);\n if (!shader) {\n throw new Error(`Can't init shader`);\n }\n\n gl.shaderSource(shader, sourceCode);\n gl.compileShader(shader);\n\n if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {\n const info = gl.getShaderInfoLog(shader);\n throw `Could not compile WebGL program. \\n\\n${info}`;\n }\n\n return shader;\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// create-shader.ts\nexport const createShader = (\n gl: WebGL2RenderingContext,\n sourceCode: string,\n type: number, // gl.VERTEX_SHADER or gl.FRAGMENT_SHADER\n) => {\n const shader = gl.createShader(type);\n if (!shader) {\n throw new Error(`Can't init shader`);\n }\n\n gl.shaderSource(shader, sourceCode);\n gl.compileShader(shader);\n\n if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {\n const info = gl.getShaderInfoLog(shader);\n throw `Could not compile WebGL program. \\n\\n${info}`;\n }\n\n return shader;\n};\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"vertex-shader-example"},"children":[{"type":"text","value":"Vertex Shader Example"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read more at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]}]},{"type":"element","tag":"code","props":{"code":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"fragment-shader-example"},"children":[{"type":"text","value":"Fragment Shader Example"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read more at "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"helpful-documentation"},"children":[{"type":"text","value":"Helpful documentation"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://open.gl/","rel":["nofollow"]},"children":[{"type":"text","value":"https://open.gl/"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"This youtube series: "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=kB0ZVUrI4Aw","rel":["nofollow"]},"children":[{"type":"text","value":"Basics"}]},{"type":"text","value":", "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=3yLL9ADo-ko","rel":["nofollow"]},"children":[{"type":"text","value":"Making a cube, applying transformations"}]},{"type":"text","value":", "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=hpnd11doMgc&t=52s","rel":["nofollow"]},"children":[{"type":"text","value":"Texturing"}]}]}]},{"type":"element","tag":"h2","props":{"id":"vertices-and-indices"},"children":[{"type":"text","value":"Vertices and Indices"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertices"}]},{"type":"text","value":" are points with specific coordinates "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"{x,y,z}"}]},{"type":"text","value":" in a 3D-space. We can build any figure by connecting "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"vertices"}]},{"type":"text","value":" in triangles with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"indices"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"shaders"},"children":[{"type":"text","value":"Shaders"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shaders are functions, written in C, which describe how to draw and color polygons to Graphic Card."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" describe "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"vertice"}]},{"type":"text","value":" positions, so Graphic Card can position them by connecting with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"indices"}]},{"type":"text","value":" and project to 2D canvas."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" describe the way polygons should be colored by assigning colors to Vertices or by applying textures to polygons."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shaders can have parameters passed from Javascript code ("},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniforms"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"attributes"}]},{"type":"text","value":"). "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" can also access data from "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" (that ones called "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":")."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"img","props":{"alt":"","src":"https://open.gl/media/img/c2_pipeline.png"},"children":[]}]},{"type":"element","tag":"h2","props":{"id":"program"},"children":[{"type":"text","value":"Program"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Program, as far as I understand, is a scene, that's described with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertices"}]},{"type":"text","value":", "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Indices"}]},{"type":"text","value":", specific "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" and "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"applying-transformations"},"children":[{"type":"text","value":"Applying transformations"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The best way to change positions inside "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" or color in "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" is to pass parameters (also called "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniforms"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":")."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read about that at "},{"type":"element","tag":"a","props":{"href":"https://open.gl/transformations","rel":["nofollow"]},"children":[{"type":"text","value":"open.gl"}]},{"type":"text","value":" and at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"source-code-with-explanations"},"children":[{"type":"text","value":"Source code with explanations"}]},{"type":"element","tag":"code","props":{"code":"// render-a-cube.ts\nimport { createShader } from \"./create-shader\";\nimport vxShader from \"./vertex.glsl?raw\";\nimport fgShader from \"./fragment.glsl?raw\";\n\nconst canvas = document.getElementyId('view');\nconst ctx = canvas.getRenderingContext('webgl');\n\n// should be put inside requestAnimationFrame\ndrawCube(ctx)(); \n\nfunction drawCube (\n gl: WebGL2RenderingContext, \n width: number,\n height: number\n) {\n // Initializing viewport\n gl.viewport(0, 0, width, height);\n gl.clearColor(0, 0, 0, 0);\n gl.clear(gl.COLOR_BUFFER_BIT);\n\n const prg = gl.createProgram();\n if (!prg) {\n throw new Error(\"Can't init programm\");\n }\n\n // Setting up VERTEX and FRAGMENT shaders\n const vx = createShader(gl, vxShader, gl.VERTEX_SHADER);\n gl.attachShader(prg, vx);\n const fx = createShader(gl, fgShader, gl.FRAGMENT_SHADER);\n gl.attachShader(prg, fx);\n gl.linkProgram(prg);\n if (!gl.getProgramParameter(prg, gl.LINK_STATUS)) {\n throw new Error(\"Could not initialise shaders\");\n }\n\n // Cube's vertices Array<[x,y,z]>, 8 items\n const vertices = [\n -1, -1, -1, // 0\n 1, -1, -1, // 1\n 1, 1, -1, // 2\n -1, 1, -1, // 3\n -1, -1, 1, // 4\n 1, -1, 1, // 5\n 1, 1, 1, // 6\n -1, 1, 1, // 7\n ];\n\n // indices, that form triangles, that form cube sides\n const indices = [\n 2, 1, 0, // side 0 (first triangle)\n 0, 3, 2, // side 0 (second triangle)\n 0, 4, 7, // side 1 (first triangle)\n 7, 3, 0, // side 1 (second triangle)\n 0, 1, 5, // ...\n 5, 4, 0, \n 1, 2, 6, \n 6, 5, 1, \n 2, 3, 7, \n 7, 6, 2, \n 4, 5, 6, \n 6, 7, 4,\n ];\n\n // createe a vertex buffer and bind vertices to it\n const squareVertexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);\n gl.bindBuffer(gl.ARRAY_BUFFER, null);\n\n // create a vertex buffer and bind indices to it\n const squareIndexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, squareIndexBuffer);\n gl.bufferData(\n gl.ELEMENT_ARRAY_BUFFER,\n new Uint16Array(indices),\n gl.STATIC_DRAW\n );\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, null);\n\n // initial drawing\n gl.clearColor(0.0, 0.0, 0.0, 0.0);\n gl.enable(gl.DEPTH_TEST);\n gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);\n gl.viewport(0, 0, width, height);\n\n // bind squareVertexBuffer as vertex positions buffer\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n \n // send every 3 bytes from squareVertexBuffer as {x,y,z} for each verticle\n gl.vertexAttribPointer(\n gl.getAttribLocation(prg, \"aVertexPosition\"), \n 3, // 3 bytes-long\n gl.FLOAT,\n false, // don't normalize (int to float)\n 0, \n 0\n );\n // send vertice buffer as `aVertexPosition` attribute inside vertex shader\n gl.enableVertexAttribArray(\n gl.getAttribLocation(prg, \"aVertexPosition\")\n );\n\n let i = 0;\n let speed = 0.01;\n\n // that's the main rendering callback\n return () => {\n gl.useProgram(prg);\n\n const scale = i * 0.25 + 0.25;\n\n // used for scaling inside Vertex Shader\n gl.uniform1f(gl.getUniformLocation(prg, \"slide\"), scale);\n // GL Screen is square, so we need to fix it's aspect ration\n gl.uniform1f(gl.getUniformLocation(prg, \"aspect\"), height / width);\n\n gl.bindBuffer(\n gl.ELEMENT_ARRAY_BUFFER, \n squareIndexBuffer\n );\n \n gl.drawElements(\n gl.TRIANGLES, \n indices.length, \n gl.UNSIGNED_SHORT, \n 0,\n );\n\n if (i > 1 || i < 0) {\n speed = -speed;\n }\n\n i += speed;\n };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// render-a-cube.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"\"./create-shader\""}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"vxShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"\"./vertex.glsl?raw\""}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"fgShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"\"./fragment.glsl?raw\""}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"document"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"getElementyId"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"'view'"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"getRenderingContext"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"'webgl'"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// should be put inside requestAnimationFrame"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"drawCube"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":")(); "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"function"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"drawCube"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3178b0"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-55a926"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e6f7d7"},"children":[{"type":"text","value":"WebGL2RenderingContext"}]},{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3178b0"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-55a926"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0a644"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3178b0"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-55a926"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0a644"},"children":[{"type":"text","value":"number"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// Initializing viewport"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"viewport"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"clearColor"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"clear"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"COLOR_BUFFER_BIT"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"createProgram"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a0f123"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"\"Can't init programm\""}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// Setting up VERTEX and FRAGMENT shaders"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"vx"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"vxShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"VERTEX_SHADER"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"attachShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"vx"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"fx"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"fgShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"FRAGMENT_SHADER"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"attachShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"fx"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"linkProgram"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"getProgramParameter"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"LINK_STATUS"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a0f123"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"\"Could not initialise shaders\""}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// Cube's vertices Array<[x,y,z]>, 8 items"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"vertices"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// 0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// 1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// 2"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// 3"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// 4"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// 5"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// 6"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// 7"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" ];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// indices, that form triangles, that form cube sides"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"indices"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// side 0 (first triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// side 0 (second triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// side 1 (first triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// side 1 (second triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" ];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// createe a vertex buffer and bind vertices to it"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"squareVertexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"createBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"squareVertexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"bufferData"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a0f123"},"children":[{"type":"text","value":"Float32Array"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"vertices"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"), "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"STATIC_DRAW"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-8827e1"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// create a vertex buffer and bind indices to it"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"squareIndexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"createBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"squareIndexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"bufferData"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a0f123"},"children":[{"type":"text","value":"Uint16Array"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"indices"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"STATIC_DRAW"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-8827e1"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// initial drawing"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"clearColor"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0.0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0.0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0.0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"enable"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"DEPTH_TEST"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"clear"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"COLOR_BUFFER_BIT"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"DEPTH_BUFFER_BIT"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"viewport"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// bind squareVertexBuffer as vertex positions buffer"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"squareVertexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// send every 3 bytes from squareVertexBuffer as {x,y,z} for each verticle"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"vertexAttribPointer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"getAttribLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"\"aVertexPosition\""}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"), "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// 3 bytes-long"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"FLOAT"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8827e1"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// don't normalize (int to float)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// send vertice buffer as `aVertexPosition` attribute inside vertex shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"enableVertexAttribArray"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"getAttribLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"\"aVertexPosition\""}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0.01"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// that's the main rendering callback"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"useProgram"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0.25"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// used for scaling inside Vertex Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"uniform1f"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"getUniformLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"\"slide\""}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"), "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// GL Screen is square, so we need to fix it's aspect ration"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"uniform1f"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"getUniformLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"\"aspect\""}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"), "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"squareIndexBuffer"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"drawElements"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"TRIANGLES"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"indices"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"UNSIGNED_SHORT"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"+="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"shader-compiler"},"children":[{"type":"text","value":"Shader compiler"}]},{"type":"element","tag":"code","props":{"code":"// create-shader.ts\nexport const createShader = (\n gl: WebGL2RenderingContext,\n sourceCode: string,\n type: number, // gl.VERTEX_SHADER or gl.FRAGMENT_SHADER\n) => {\n const shader = gl.createShader(type);\n if (!shader) {\n throw new Error(`Can't init shader`);\n }\n\n gl.shaderSource(shader, sourceCode);\n gl.compileShader(shader);\n\n if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {\n const info = gl.getShaderInfoLog(shader);\n throw `Could not compile WebGL program. \\n\\n${info}`;\n }\n\n return shader;\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// create-shader.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3178b0"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-55a926"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e6f7d7"},"children":[{"type":"text","value":"WebGL2RenderingContext"}]},{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3178b0"},"children":[{"type":"text","value":"sourceCode"}]},{"type":"element","tag":"span","props":{"class":"ct-55a926"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0a644"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3178b0"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-55a926"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e0a644"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-56017d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c24349"},"children":[{"type":"text","value":"// gl.VERTEX_SHADER or gl.FRAGMENT_SHADER"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a0f123"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"`Can't init shader`"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"shaderSource"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"sourceCode"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"compileShader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"getShaderParameter"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"COMPILE_STATUS"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e050e1"},"children":[{"type":"text","value":"info"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"getShaderInfoLog"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"`Could not compile WebGL program. "}]},{"type":"element","tag":"span","props":{"class":"ct-be2223"},"children":[{"type":"text","value":"\\n\\n"}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"info"}]},{"type":"element","tag":"span","props":{"class":"ct-c8ad10"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"vertex-shader-example"},"children":[{"type":"text","value":"Vertex Shader Example"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read more at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]}]},{"type":"element","tag":"code","props":{"code":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// current vertice position {x,y,z,w}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"attribute vec4 aVertexPosition;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// final vertice position with all transformations applied,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// that will be passed to Fragment Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"varying vec4 v_positionWithOffset;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// Parameters passed from Javascript loop"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" slide;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" aspect;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"(){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// float array of 4 elements, same as [slide,slide,slide,1]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" vec4 scale"}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"(slide),"}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// float array of 4 elements, same as [aspect,1,1,1]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" vec4 aspectRatioFix"}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"(aspect,"}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// vertice position, multiplied with matrices of scale and aspect ratio"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"aVertexPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"aspectRatioFix,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// vertice offset, that will be passed to fragment shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"fragment-shader-example"},"children":[{"type":"text","value":"Fragment Shader Example"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read more at "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"precision highp "}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// parameter from Vertex Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"varying vec4 v_positionWithOffset;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d20acd"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// color, attached to current verticle {r,g,b,alpha}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// same a["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// v_positionWithOffset.x,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// v_positionWithOffset.y, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// v_positionWithOffset.z, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// 1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f4d62"},"children":[{"type":"text","value":"// ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":" gl_FragColor"}]},{"type":"element","tag":"span","props":{"class":"ct-bc3ef1"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-6a5e5c"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-cc7b48"},"children":[{"type":"text","value":"xyz"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-d569ab"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5f48b1"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-be2223{color:#79C0FF}.ct-c24349{color:#8B949E}.ct-8827e1{color:#79C0FF}.ct-a0f123{color:#79C0FF}.ct-d569ab{color:#79C0FF}.ct-e0a644{color:#79C0FF}.ct-e6f7d7{color:#FFA657}.ct-55a926{color:#FF7B72}.ct-3178b0{color:#FFA657}.ct-56017d{color:#C9D1D9}.ct-6a5e5c{color:#D2A8FF}.ct-e050e1{color:#79C0FF}.ct-d20acd{color:#FF7B72}.ct-c8ad10{color:#A5D6FF}.ct-cc7b48{color:#C9D1D9}.ct-5f48b1{color:#C9D1D9}.ct-bc3ef1{color:#FF7B72}.ct-6f4d62{color:#8B949E}.light .ct-6f4d62{color:#93A1A1}.light .ct-bc3ef1{color:#859900}.light .ct-5f48b1{color:#657B83}.light .ct-cc7b48{color:#268BD2}.light .ct-c8ad10{color:#2AA198}.light .ct-d20acd{color:#073642}.light .ct-e050e1{color:#268BD2}.light .ct-6a5e5c{color:#268BD2}.light .ct-56017d{color:#657B83}.light .ct-3178b0{color:#657B83}.light .ct-55a926{color:#859900}.light .ct-e6f7d7{color:#268BD2}.light .ct-e0a644{color:#859900}.light .ct-d569ab{color:#D33682}.light .ct-a0f123{color:#859900}.light .ct-8827e1{color:#B58900}.light .ct-c24349{color:#93A1A1}.light .ct-be2223{color:#CB4B16}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"helpful-documentation","depth":2,"text":"Helpful documentation"},{"id":"vertices-and-indices","depth":2,"text":"Vertices and Indices"},{"id":"shaders","depth":2,"text":"Shaders"},{"id":"program","depth":2,"text":"Program"},{"id":"applying-transformations","depth":2,"text":"Applying transformations"},{"id":"source-code-with-explanations","depth":2,"text":"Source code with explanations"},{"id":"shader-compiler","depth":2,"text":"Shader compiler"},{"id":"vertex-shader-example","depth":2,"text":"Vertex Shader Example"},{"id":"fragment-shader-example","depth":2,"text":"Fragment Shader Example"}]}},"_type":"markdown","_id":"content:Frontend:WebGL:Basics of WebGL (Drawing a Cube).md","_source":"content","_file":"Frontend/WebGL/Basics of WebGL (Drawing a Cube).md","_extension":"md"} \ No newline at end of file +{"_path":"/frontend/webgl/basics-of-webgl-(drawing-a-cube)","_dir":"webgl","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Basics Of WebGL (Drawing A Cube)","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"helpful-documentation"},"children":[{"type":"text","value":"Helpful documentation"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://open.gl/","rel":["nofollow"]},"children":[{"type":"text","value":"https://open.gl/"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"This youtube series: "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=kB0ZVUrI4Aw","rel":["nofollow"]},"children":[{"type":"text","value":"Basics"}]},{"type":"text","value":", "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=3yLL9ADo-ko","rel":["nofollow"]},"children":[{"type":"text","value":"Making a cube, applying transformations"}]},{"type":"text","value":", "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=hpnd11doMgc&t=52s","rel":["nofollow"]},"children":[{"type":"text","value":"Texturing"}]}]}]},{"type":"element","tag":"h2","props":{"id":"vertices-and-indices"},"children":[{"type":"text","value":"Vertices and Indices"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertices"}]},{"type":"text","value":" are points with specific coordinates "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"{x,y,z}"}]},{"type":"text","value":" in a 3D-space. We can build any figure by connecting "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"vertices"}]},{"type":"text","value":" in triangles with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"indices"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"shaders"},"children":[{"type":"text","value":"Shaders"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shaders are functions, written in C, which describe how to draw and color polygons to Graphic Card."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" describe "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"vertice"}]},{"type":"text","value":" positions, so Graphic Card can position them by connecting with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"indices"}]},{"type":"text","value":" and project to 2D canvas."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" describe the way polygons should be colored by assigning colors to Vertices or by applying textures to polygons."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shaders can have parameters passed from Javascript code ("},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniforms"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"attributes"}]},{"type":"text","value":"). "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" can also access data from "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" (that ones called "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":")."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"img","props":{"alt":"","src":"https://open.gl/media/img/c2_pipeline.png"},"children":[]}]},{"type":"element","tag":"h2","props":{"id":"program"},"children":[{"type":"text","value":"Program"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Program, as far as I understand, is a scene, that's described with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertices"}]},{"type":"text","value":", "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Indices"}]},{"type":"text","value":", specific "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" and "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"applying-transformations"},"children":[{"type":"text","value":"Applying transformations"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The best way to change positions inside "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" or color in "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" is to pass parameters (also called "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniforms"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":")."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read about that at "},{"type":"element","tag":"a","props":{"href":"https://open.gl/transformations","rel":["nofollow"]},"children":[{"type":"text","value":"open.gl"}]},{"type":"text","value":" and at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"source-code-with-explanations"},"children":[{"type":"text","value":"Source code with explanations"}]},{"type":"element","tag":"code","props":{"code":"// render-a-cube.ts\nimport { createShader } from \"./create-shader\";\nimport vxShader from \"./vertex.glsl?raw\";\nimport fgShader from \"./fragment.glsl?raw\";\n\nconst canvas = document.getElementyId('view');\nconst ctx = canvas.getRenderingContext('webgl');\n\n// should be put inside requestAnimationFrame\ndrawCube(ctx)(); \n\nfunction drawCube (\n gl: WebGL2RenderingContext, \n width: number,\n height: number\n) {\n // Initializing viewport\n gl.viewport(0, 0, width, height);\n gl.clearColor(0, 0, 0, 0);\n gl.clear(gl.COLOR_BUFFER_BIT);\n\n const prg = gl.createProgram();\n if (!prg) {\n throw new Error(\"Can't init programm\");\n }\n\n // Setting up VERTEX and FRAGMENT shaders\n const vx = createShader(gl, vxShader, gl.VERTEX_SHADER);\n gl.attachShader(prg, vx);\n const fx = createShader(gl, fgShader, gl.FRAGMENT_SHADER);\n gl.attachShader(prg, fx);\n gl.linkProgram(prg);\n if (!gl.getProgramParameter(prg, gl.LINK_STATUS)) {\n throw new Error(\"Could not initialise shaders\");\n }\n\n // Cube's vertices Array<[x,y,z]>, 8 items\n const vertices = [\n -1, -1, -1, // 0\n 1, -1, -1, // 1\n 1, 1, -1, // 2\n -1, 1, -1, // 3\n -1, -1, 1, // 4\n 1, -1, 1, // 5\n 1, 1, 1, // 6\n -1, 1, 1, // 7\n ];\n\n // indices, that form triangles, that form cube sides\n const indices = [\n 2, 1, 0, // side 0 (first triangle)\n 0, 3, 2, // side 0 (second triangle)\n 0, 4, 7, // side 1 (first triangle)\n 7, 3, 0, // side 1 (second triangle)\n 0, 1, 5, // ...\n 5, 4, 0, \n 1, 2, 6, \n 6, 5, 1, \n 2, 3, 7, \n 7, 6, 2, \n 4, 5, 6, \n 6, 7, 4,\n ];\n\n // createe a vertex buffer and bind vertices to it\n const squareVertexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);\n gl.bindBuffer(gl.ARRAY_BUFFER, null);\n\n // create a vertex buffer and bind indices to it\n const squareIndexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, squareIndexBuffer);\n gl.bufferData(\n gl.ELEMENT_ARRAY_BUFFER,\n new Uint16Array(indices),\n gl.STATIC_DRAW\n );\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, null);\n\n // initial drawing\n gl.clearColor(0.0, 0.0, 0.0, 0.0);\n gl.enable(gl.DEPTH_TEST);\n gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);\n gl.viewport(0, 0, width, height);\n\n // bind squareVertexBuffer as vertex positions buffer\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n \n // send every 3 bytes from squareVertexBuffer as {x,y,z} for each verticle\n gl.vertexAttribPointer(\n gl.getAttribLocation(prg, \"aVertexPosition\"), \n 3, // 3 bytes-long\n gl.FLOAT,\n false, // don't normalize (int to float)\n 0, \n 0\n );\n // send vertice buffer as `aVertexPosition` attribute inside vertex shader\n gl.enableVertexAttribArray(\n gl.getAttribLocation(prg, \"aVertexPosition\")\n );\n\n let i = 0;\n let speed = 0.01;\n\n // that's the main rendering callback\n return () => {\n gl.useProgram(prg);\n\n const scale = i * 0.25 + 0.25;\n\n // used for scaling inside Vertex Shader\n gl.uniform1f(gl.getUniformLocation(prg, \"slide\"), scale);\n // GL Screen is square, so we need to fix it's aspect ration\n gl.uniform1f(gl.getUniformLocation(prg, \"aspect\"), height / width);\n\n gl.bindBuffer(\n gl.ELEMENT_ARRAY_BUFFER, \n squareIndexBuffer\n );\n \n gl.drawElements(\n gl.TRIANGLES, \n indices.length, \n gl.UNSIGNED_SHORT, \n 0,\n );\n\n if (i > 1 || i < 0) {\n speed = -speed;\n }\n\n i += speed;\n };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// render-a-cube.ts\nimport { createShader } from \"./create-shader\";\nimport vxShader from \"./vertex.glsl?raw\";\nimport fgShader from \"./fragment.glsl?raw\";\n\nconst canvas = document.getElementyId('view');\nconst ctx = canvas.getRenderingContext('webgl');\n\n// should be put inside requestAnimationFrame\ndrawCube(ctx)(); \n\nfunction drawCube (\n gl: WebGL2RenderingContext, \n width: number,\n height: number\n) {\n // Initializing viewport\n gl.viewport(0, 0, width, height);\n gl.clearColor(0, 0, 0, 0);\n gl.clear(gl.COLOR_BUFFER_BIT);\n\n const prg = gl.createProgram();\n if (!prg) {\n throw new Error(\"Can't init programm\");\n }\n\n // Setting up VERTEX and FRAGMENT shaders\n const vx = createShader(gl, vxShader, gl.VERTEX_SHADER);\n gl.attachShader(prg, vx);\n const fx = createShader(gl, fgShader, gl.FRAGMENT_SHADER);\n gl.attachShader(prg, fx);\n gl.linkProgram(prg);\n if (!gl.getProgramParameter(prg, gl.LINK_STATUS)) {\n throw new Error(\"Could not initialise shaders\");\n }\n\n // Cube's vertices Array<[x,y,z]>, 8 items\n const vertices = [\n -1, -1, -1, // 0\n 1, -1, -1, // 1\n 1, 1, -1, // 2\n -1, 1, -1, // 3\n -1, -1, 1, // 4\n 1, -1, 1, // 5\n 1, 1, 1, // 6\n -1, 1, 1, // 7\n ];\n\n // indices, that form triangles, that form cube sides\n const indices = [\n 2, 1, 0, // side 0 (first triangle)\n 0, 3, 2, // side 0 (second triangle)\n 0, 4, 7, // side 1 (first triangle)\n 7, 3, 0, // side 1 (second triangle)\n 0, 1, 5, // ...\n 5, 4, 0, \n 1, 2, 6, \n 6, 5, 1, \n 2, 3, 7, \n 7, 6, 2, \n 4, 5, 6, \n 6, 7, 4,\n ];\n\n // createe a vertex buffer and bind vertices to it\n const squareVertexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);\n gl.bindBuffer(gl.ARRAY_BUFFER, null);\n\n // create a vertex buffer and bind indices to it\n const squareIndexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, squareIndexBuffer);\n gl.bufferData(\n gl.ELEMENT_ARRAY_BUFFER,\n new Uint16Array(indices),\n gl.STATIC_DRAW\n );\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, null);\n\n // initial drawing\n gl.clearColor(0.0, 0.0, 0.0, 0.0);\n gl.enable(gl.DEPTH_TEST);\n gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);\n gl.viewport(0, 0, width, height);\n\n // bind squareVertexBuffer as vertex positions buffer\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n \n // send every 3 bytes from squareVertexBuffer as {x,y,z} for each verticle\n gl.vertexAttribPointer(\n gl.getAttribLocation(prg, \"aVertexPosition\"), \n 3, // 3 bytes-long\n gl.FLOAT,\n false, // don't normalize (int to float)\n 0, \n 0\n );\n // send vertice buffer as `aVertexPosition` attribute inside vertex shader\n gl.enableVertexAttribArray(\n gl.getAttribLocation(prg, \"aVertexPosition\")\n );\n\n let i = 0;\n let speed = 0.01;\n\n // that's the main rendering callback\n return () => {\n gl.useProgram(prg);\n\n const scale = i * 0.25 + 0.25;\n\n // used for scaling inside Vertex Shader\n gl.uniform1f(gl.getUniformLocation(prg, \"slide\"), scale);\n // GL Screen is square, so we need to fix it's aspect ration\n gl.uniform1f(gl.getUniformLocation(prg, \"aspect\"), height / width);\n\n gl.bindBuffer(\n gl.ELEMENT_ARRAY_BUFFER, \n squareIndexBuffer\n );\n \n gl.drawElements(\n gl.TRIANGLES, \n indices.length, \n gl.UNSIGNED_SHORT, \n 0,\n );\n\n if (i > 1 || i < 0) {\n speed = -speed;\n }\n\n i += speed;\n };\n};\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"shader-compiler"},"children":[{"type":"text","value":"Shader compiler"}]},{"type":"element","tag":"code","props":{"code":"// create-shader.ts\nexport const createShader = (\n gl: WebGL2RenderingContext,\n sourceCode: string,\n type: number, // gl.VERTEX_SHADER or gl.FRAGMENT_SHADER\n) => {\n const shader = gl.createShader(type);\n if (!shader) {\n throw new Error(`Can't init shader`);\n }\n\n gl.shaderSource(shader, sourceCode);\n gl.compileShader(shader);\n\n if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {\n const info = gl.getShaderInfoLog(shader);\n throw `Could not compile WebGL program. \\n\\n${info}`;\n }\n\n return shader;\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// create-shader.ts\nexport const createShader = (\n gl: WebGL2RenderingContext,\n sourceCode: string,\n type: number, // gl.VERTEX_SHADER or gl.FRAGMENT_SHADER\n) => {\n const shader = gl.createShader(type);\n if (!shader) {\n throw new Error(`Can't init shader`);\n }\n\n gl.shaderSource(shader, sourceCode);\n gl.compileShader(shader);\n\n if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {\n const info = gl.getShaderInfoLog(shader);\n throw `Could not compile WebGL program. \\n\\n${info}`;\n }\n\n return shader;\n};\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"vertex-shader-example"},"children":[{"type":"text","value":"Vertex Shader Example"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read more at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]}]},{"type":"element","tag":"code","props":{"code":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"fragment-shader-example"},"children":[{"type":"text","value":"Fragment Shader Example"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read more at "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"helpful-documentation"},"children":[{"type":"text","value":"Helpful documentation"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://open.gl/","rel":["nofollow"]},"children":[{"type":"text","value":"https://open.gl/"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"This youtube series: "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=kB0ZVUrI4Aw","rel":["nofollow"]},"children":[{"type":"text","value":"Basics"}]},{"type":"text","value":", "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=3yLL9ADo-ko","rel":["nofollow"]},"children":[{"type":"text","value":"Making a cube, applying transformations"}]},{"type":"text","value":", "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=hpnd11doMgc&t=52s","rel":["nofollow"]},"children":[{"type":"text","value":"Texturing"}]}]}]},{"type":"element","tag":"h2","props":{"id":"vertices-and-indices"},"children":[{"type":"text","value":"Vertices and Indices"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertices"}]},{"type":"text","value":" are points with specific coordinates "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"{x,y,z}"}]},{"type":"text","value":" in a 3D-space. We can build any figure by connecting "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"vertices"}]},{"type":"text","value":" in triangles with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"indices"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"shaders"},"children":[{"type":"text","value":"Shaders"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shaders are functions, written in C, which describe how to draw and color polygons to Graphic Card."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" describe "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"vertice"}]},{"type":"text","value":" positions, so Graphic Card can position them by connecting with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"indices"}]},{"type":"text","value":" and project to 2D canvas."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" describe the way polygons should be colored by assigning colors to Vertices or by applying textures to polygons."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shaders can have parameters passed from Javascript code ("},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniforms"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"attributes"}]},{"type":"text","value":"). "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" can also access data from "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" (that ones called "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":")."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"img","props":{"alt":"","src":"https://open.gl/media/img/c2_pipeline.png"},"children":[]}]},{"type":"element","tag":"h2","props":{"id":"program"},"children":[{"type":"text","value":"Program"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Program, as far as I understand, is a scene, that's described with "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertices"}]},{"type":"text","value":", "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Indices"}]},{"type":"text","value":", specific "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" and "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"applying-transformations"},"children":[{"type":"text","value":"Applying transformations"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The best way to change positions inside "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" or color in "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":" is to pass parameters (also called "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniforms"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varyings"}]},{"type":"text","value":")."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read about that at "},{"type":"element","tag":"a","props":{"href":"https://open.gl/transformations","rel":["nofollow"]},"children":[{"type":"text","value":"open.gl"}]},{"type":"text","value":" and at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"source-code-with-explanations"},"children":[{"type":"text","value":"Source code with explanations"}]},{"type":"element","tag":"code","props":{"code":"// render-a-cube.ts\nimport { createShader } from \"./create-shader\";\nimport vxShader from \"./vertex.glsl?raw\";\nimport fgShader from \"./fragment.glsl?raw\";\n\nconst canvas = document.getElementyId('view');\nconst ctx = canvas.getRenderingContext('webgl');\n\n// should be put inside requestAnimationFrame\ndrawCube(ctx)(); \n\nfunction drawCube (\n gl: WebGL2RenderingContext, \n width: number,\n height: number\n) {\n // Initializing viewport\n gl.viewport(0, 0, width, height);\n gl.clearColor(0, 0, 0, 0);\n gl.clear(gl.COLOR_BUFFER_BIT);\n\n const prg = gl.createProgram();\n if (!prg) {\n throw new Error(\"Can't init programm\");\n }\n\n // Setting up VERTEX and FRAGMENT shaders\n const vx = createShader(gl, vxShader, gl.VERTEX_SHADER);\n gl.attachShader(prg, vx);\n const fx = createShader(gl, fgShader, gl.FRAGMENT_SHADER);\n gl.attachShader(prg, fx);\n gl.linkProgram(prg);\n if (!gl.getProgramParameter(prg, gl.LINK_STATUS)) {\n throw new Error(\"Could not initialise shaders\");\n }\n\n // Cube's vertices Array<[x,y,z]>, 8 items\n const vertices = [\n -1, -1, -1, // 0\n 1, -1, -1, // 1\n 1, 1, -1, // 2\n -1, 1, -1, // 3\n -1, -1, 1, // 4\n 1, -1, 1, // 5\n 1, 1, 1, // 6\n -1, 1, 1, // 7\n ];\n\n // indices, that form triangles, that form cube sides\n const indices = [\n 2, 1, 0, // side 0 (first triangle)\n 0, 3, 2, // side 0 (second triangle)\n 0, 4, 7, // side 1 (first triangle)\n 7, 3, 0, // side 1 (second triangle)\n 0, 1, 5, // ...\n 5, 4, 0, \n 1, 2, 6, \n 6, 5, 1, \n 2, 3, 7, \n 7, 6, 2, \n 4, 5, 6, \n 6, 7, 4,\n ];\n\n // createe a vertex buffer and bind vertices to it\n const squareVertexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);\n gl.bindBuffer(gl.ARRAY_BUFFER, null);\n\n // create a vertex buffer and bind indices to it\n const squareIndexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, squareIndexBuffer);\n gl.bufferData(\n gl.ELEMENT_ARRAY_BUFFER,\n new Uint16Array(indices),\n gl.STATIC_DRAW\n );\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, null);\n\n // initial drawing\n gl.clearColor(0.0, 0.0, 0.0, 0.0);\n gl.enable(gl.DEPTH_TEST);\n gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);\n gl.viewport(0, 0, width, height);\n\n // bind squareVertexBuffer as vertex positions buffer\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n \n // send every 3 bytes from squareVertexBuffer as {x,y,z} for each verticle\n gl.vertexAttribPointer(\n gl.getAttribLocation(prg, \"aVertexPosition\"), \n 3, // 3 bytes-long\n gl.FLOAT,\n false, // don't normalize (int to float)\n 0, \n 0\n );\n // send vertice buffer as `aVertexPosition` attribute inside vertex shader\n gl.enableVertexAttribArray(\n gl.getAttribLocation(prg, \"aVertexPosition\")\n );\n\n let i = 0;\n let speed = 0.01;\n\n // that's the main rendering callback\n return () => {\n gl.useProgram(prg);\n\n const scale = i * 0.25 + 0.25;\n\n // used for scaling inside Vertex Shader\n gl.uniform1f(gl.getUniformLocation(prg, \"slide\"), scale);\n // GL Screen is square, so we need to fix it's aspect ration\n gl.uniform1f(gl.getUniformLocation(prg, \"aspect\"), height / width);\n\n gl.bindBuffer(\n gl.ELEMENT_ARRAY_BUFFER, \n squareIndexBuffer\n );\n \n gl.drawElements(\n gl.TRIANGLES, \n indices.length, \n gl.UNSIGNED_SHORT, \n 0,\n );\n\n if (i > 1 || i < 0) {\n speed = -speed;\n }\n\n i += speed;\n };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// render-a-cube.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"\"./create-shader\""}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"vxShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"\"./vertex.glsl?raw\""}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"fgShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"\"./fragment.glsl?raw\""}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"document"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"getElementyId"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"'view'"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"getRenderingContext"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"'webgl'"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// should be put inside requestAnimationFrame"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"drawCube"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":")(); "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"function"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"drawCube"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7cd29f"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-8977a7"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a32dc8"},"children":[{"type":"text","value":"WebGL2RenderingContext"}]},{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7cd29f"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-8977a7"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d183b6"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7cd29f"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-8977a7"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d183b6"},"children":[{"type":"text","value":"number"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// Initializing viewport"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"viewport"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"clearColor"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"clear"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"COLOR_BUFFER_BIT"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"createProgram"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f060f"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"\"Can't init programm\""}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// Setting up VERTEX and FRAGMENT shaders"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"vx"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"vxShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"VERTEX_SHADER"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"attachShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"vx"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"fx"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"fgShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"FRAGMENT_SHADER"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"attachShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"fx"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"linkProgram"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"getProgramParameter"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"LINK_STATUS"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f060f"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"\"Could not initialise shaders\""}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// Cube's vertices Array<[x,y,z]>, 8 items"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"vertices"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// 0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// 1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// 2"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// 3"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// 4"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// 5"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// 6"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// 7"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" ];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// indices, that form triangles, that form cube sides"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"indices"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// side 0 (first triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// side 0 (second triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// side 1 (first triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// side 1 (second triangle)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"6"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"7"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" ];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// createe a vertex buffer and bind vertices to it"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"squareVertexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"createBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"squareVertexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"bufferData"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f060f"},"children":[{"type":"text","value":"Float32Array"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"vertices"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"), "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"STATIC_DRAW"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f236f7"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// create a vertex buffer and bind indices to it"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"squareIndexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"createBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"squareIndexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"bufferData"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f060f"},"children":[{"type":"text","value":"Uint16Array"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"indices"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"STATIC_DRAW"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f236f7"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// initial drawing"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"clearColor"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0.0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0.0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0.0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"enable"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"DEPTH_TEST"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"clear"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"COLOR_BUFFER_BIT"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"DEPTH_BUFFER_BIT"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"viewport"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// bind squareVertexBuffer as vertex positions buffer"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"squareVertexBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// send every 3 bytes from squareVertexBuffer as {x,y,z} for each verticle"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"vertexAttribPointer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"getAttribLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"\"aVertexPosition\""}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"), "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// 3 bytes-long"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"FLOAT"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f236f7"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// don't normalize (int to float)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// send vertice buffer as `aVertexPosition` attribute inside vertex shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"enableVertexAttribArray"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"getAttribLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"\"aVertexPosition\""}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0.01"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// that's the main rendering callback"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"useProgram"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0.25"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// used for scaling inside Vertex Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"uniform1f"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"getUniformLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"\"slide\""}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"), "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// GL Screen is square, so we need to fix it's aspect ration"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"uniform1f"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"getUniformLocation"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"prg"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"\"aspect\""}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"), "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"bindBuffer"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"ELEMENT_ARRAY_BUFFER"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"squareIndexBuffer"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"drawElements"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"TRIANGLES"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"indices"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"UNSIGNED_SHORT"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":">"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"+="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"speed"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"shader-compiler"},"children":[{"type":"text","value":"Shader compiler"}]},{"type":"element","tag":"code","props":{"code":"// create-shader.ts\nexport const createShader = (\n gl: WebGL2RenderingContext,\n sourceCode: string,\n type: number, // gl.VERTEX_SHADER or gl.FRAGMENT_SHADER\n) => {\n const shader = gl.createShader(type);\n if (!shader) {\n throw new Error(`Can't init shader`);\n }\n\n gl.shaderSource(shader, sourceCode);\n gl.compileShader(shader);\n\n if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {\n const info = gl.getShaderInfoLog(shader);\n throw `Could not compile WebGL program. \\n\\n${info}`;\n }\n\n return shader;\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// create-shader.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7cd29f"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-8977a7"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a32dc8"},"children":[{"type":"text","value":"WebGL2RenderingContext"}]},{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7cd29f"},"children":[{"type":"text","value":"sourceCode"}]},{"type":"element","tag":"span","props":{"class":"ct-8977a7"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d183b6"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7cd29f"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-8977a7"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d183b6"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-7f4c7e"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-93980e"},"children":[{"type":"text","value":"// gl.VERTEX_SHADER or gl.FRAGMENT_SHADER"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"createShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f060f"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"`Can't init shader`"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"shaderSource"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"sourceCode"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"compileShader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"getShaderParameter"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"COMPILE_STATUS"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c51f3e"},"children":[{"type":"text","value":"info"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"gl"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"getShaderInfoLog"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"`Could not compile WebGL program. "}]},{"type":"element","tag":"span","props":{"class":"ct-5dbe56"},"children":[{"type":"text","value":"\\n\\n"}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"info"}]},{"type":"element","tag":"span","props":{"class":"ct-534aac"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"shader"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"vertex-shader-example"},"children":[{"type":"text","value":"Vertex Shader Example"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read more at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]}]},{"type":"element","tag":"code","props":{"code":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// current vertice position {x,y,z,w}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"attribute vec4 aVertexPosition;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// final vertice position with all transformations applied,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// that will be passed to Fragment Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"varying vec4 v_positionWithOffset;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// Parameters passed from Javascript loop"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" slide;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" aspect;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"(){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// float array of 4 elements, same as [slide,slide,slide,1]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" vec4 scale"}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"(slide),"}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// float array of 4 elements, same as [aspect,1,1,1]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" vec4 aspectRatioFix"}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"(aspect,"}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// vertice position, multiplied with matrices of scale and aspect ratio"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"aVertexPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"aspectRatioFix,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// vertice offset, that will be passed to fragment shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"fragment-shader-example"},"children":[{"type":"text","value":"Fragment Shader Example"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read more at "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"precision highp "}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// parameter from Vertex Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"varying vec4 v_positionWithOffset;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ef809f"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// color, attached to current verticle {r,g,b,alpha}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// same a["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// v_positionWithOffset.x,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// v_positionWithOffset.y, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// v_positionWithOffset.z, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// 1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27c1e8"},"children":[{"type":"text","value":"// ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":" gl_FragColor"}]},{"type":"element","tag":"span","props":{"class":"ct-64cc74"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-a1f1df"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-535538"},"children":[{"type":"text","value":"xyz"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-3f41dc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-60d196"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-5dbe56{color:#79C0FF}.ct-93980e{color:#8B949E}.ct-f236f7{color:#79C0FF}.ct-7f060f{color:#79C0FF}.ct-3f41dc{color:#79C0FF}.ct-d183b6{color:#79C0FF}.ct-a32dc8{color:#FFA657}.ct-8977a7{color:#FF7B72}.ct-7cd29f{color:#FFA657}.ct-7f4c7e{color:#C9D1D9}.ct-a1f1df{color:#D2A8FF}.ct-c51f3e{color:#79C0FF}.ct-ef809f{color:#FF7B72}.ct-534aac{color:#A5D6FF}.ct-535538{color:#C9D1D9}.ct-60d196{color:#C9D1D9}.ct-64cc74{color:#FF7B72}.ct-27c1e8{color:#8B949E}.light .ct-27c1e8{color:#93A1A1}.light .ct-64cc74{color:#859900}.light .ct-60d196{color:#657B83}.light .ct-535538{color:#268BD2}.light .ct-534aac{color:#2AA198}.light .ct-ef809f{color:#073642}.light .ct-c51f3e{color:#268BD2}.light .ct-a1f1df{color:#268BD2}.light .ct-7f4c7e{color:#657B83}.light .ct-7cd29f{color:#657B83}.light .ct-8977a7{color:#859900}.light .ct-a32dc8{color:#268BD2}.light .ct-d183b6{color:#859900}.light .ct-3f41dc{color:#D33682}.light .ct-7f060f{color:#859900}.light .ct-f236f7{color:#B58900}.light .ct-93980e{color:#93A1A1}.light .ct-5dbe56{color:#CB4B16}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"helpful-documentation","depth":2,"text":"Helpful documentation"},{"id":"vertices-and-indices","depth":2,"text":"Vertices and Indices"},{"id":"shaders","depth":2,"text":"Shaders"},{"id":"program","depth":2,"text":"Program"},{"id":"applying-transformations","depth":2,"text":"Applying transformations"},{"id":"source-code-with-explanations","depth":2,"text":"Source code with explanations"},{"id":"shader-compiler","depth":2,"text":"Shader compiler"},{"id":"vertex-shader-example","depth":2,"text":"Vertex Shader Example"},{"id":"fragment-shader-example","depth":2,"text":"Fragment Shader Example"}]}},"_type":"markdown","_id":"content:Frontend:WebGL:Basics of WebGL (Drawing a Cube).md","_source":"content","_file":"Frontend/WebGL/Basics of WebGL (Drawing a Cube).md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/S7L9CBleOj.json b/docs/api/_content/query/S7L9CBleOj.json index 8cf3af8..e777092 100644 --- a/docs/api/_content/query/S7L9CBleOj.json +++ b/docs/api/_content/query/S7L9CBleOj.json @@ -1 +1 @@ -{"_path":"/frontend/vue/make-nuxt-handle-obsidian-highlights","_dir":"vue","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Make Nuxt Handle Obsidian Highlights","description":"By default Nuxt Content Plugin not handling highlight links. To fix that we will create Nitro plugin:","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"By default "},{"type":"element","tag":"a","props":{"href":"https://content.nuxtjs.org","rel":["nofollow"]},"children":[{"type":"text","value":"Nuxt Content Plugin"}]},{"type":"text","value":" not handling "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"highlight"}]},{"type":"text","value":" links. To fix that we will create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Nitro"}]},{"type":"text","value":" plugin:"}]},{"type":"element","tag":"code","props":{"code":"// ~/server/plugins/highlight.ts\nexport default defineNitroPlugin((nitroApp) => {\n nitroApp.hooks.hook(\"content:file:beforeParse\", (file) => {\n if (file._id.endsWith(\".md\")) {\n file.body = file.body.replace(\n /==([^=]+)==/gs,\n `$1`\n );\n }\n });\n});\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// ~/server/plugins/highlight.ts\nexport default defineNitroPlugin((nitroApp) => {\n nitroApp.hooks.hook(\"content:file:beforeParse\", (file) => {\n if (file._id.endsWith(\".md\")) {\n file.body = file.body.replace(\n /==([^=]+)==/gs,\n `$1`\n );\n }\n });\n});\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"By default "},{"type":"element","tag":"a","props":{"href":"https://content.nuxtjs.org","rel":["nofollow"]},"children":[{"type":"text","value":"Nuxt Content Plugin"}]},{"type":"text","value":" not handling "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"highlight"}]},{"type":"text","value":" links. To fix that we will create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Nitro"}]},{"type":"text","value":" plugin:"}]},{"type":"element","tag":"code","props":{"code":"// ~/server/plugins/highlight.ts\nexport default defineNitroPlugin((nitroApp) => {\n nitroApp.hooks.hook(\"content:file:beforeParse\", (file) => {\n if (file._id.endsWith(\".md\")) {\n file.body = file.body.replace(\n /==([^=]+)==/gs,\n `$1`\n );\n }\n });\n});\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2ddfc7"},"children":[{"type":"text","value":"// ~/server/plugins/highlight.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-69d133"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-56b7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-69d133"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-56b7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-de9555"},"children":[{"type":"text","value":"defineNitroPlugin"}]},{"type":"element","tag":"span","props":{"class":"ct-56b7c0"},"children":[{"type":"text","value":"((nitroApp) "}]},{"type":"element","tag":"span","props":{"class":"ct-a255e4"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-56b7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4e7048"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86abab"},"children":[{"type":"text","value":"nitroApp"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-86abab"},"children":[{"type":"text","value":"hooks"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-1a3ebb"},"children":[{"type":"text","value":"hook"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-382167"},"children":[{"type":"text","value":"\"content:file:beforeParse\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f787a"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-86abab"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-86abab"},"children":[{"type":"text","value":"_id"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-1a3ebb"},"children":[{"type":"text","value":"endsWith"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-382167"},"children":[{"type":"text","value":"\".md\""}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86abab"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-86abab"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f787a"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86abab"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-86abab"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-1a3ebb"},"children":[{"type":"text","value":"replace"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6a4f28"},"children":[{"type":"text","value":"/==("}]},{"type":"element","tag":"span","props":{"class":"ct-0a6144"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-0f787a"},"children":[{"type":"text","value":"^"}]},{"type":"element","tag":"span","props":{"class":"ct-0a6144"},"children":[{"type":"text","value":"=]"}]},{"type":"element","tag":"span","props":{"class":"ct-0f787a"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-6a4f28"},"children":[{"type":"text","value":")==/"}]},{"type":"element","tag":"span","props":{"class":"ct-0f787a"},"children":[{"type":"text","value":"gs"}]},{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-382167"},"children":[{"type":"text","value":"`$1`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7ad72d"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e7048"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-56b7c0"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-4e7048"},"children":[{"type":"text","value":";"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-0a6144{color:#79C0FF}.ct-6a4f28{color:#A5D6FF}.ct-0f787a{color:#FF7B72}.ct-382167{color:#A5D6FF}.ct-1a3ebb{color:#D2A8FF}.ct-86abab{color:#C9D1D9}.ct-7ad72d{color:#C9D1D9}.ct-4e7048{color:#C9D1D9}.ct-a255e4{color:#FF7B72}.ct-de9555{color:#D2A8FF}.ct-56b7c0{color:#FFA657}.ct-69d133{color:#FF7B72}.ct-2ddfc7{color:#8B949E}.light .ct-2ddfc7{color:#93A1A1}.light .ct-69d133{color:#859900}.light .ct-56b7c0{color:#657B83}.light .ct-de9555{color:#268BD2}.light .ct-a255e4{color:#073642}.light .ct-4e7048{color:#657B83}.light .ct-7ad72d{color:#657B83}.light .ct-86abab{color:#268BD2}.light .ct-1a3ebb{color:#268BD2}.light .ct-382167{color:#2AA198}.light .ct-0f787a{color:#859900}.light .ct-6a4f28{color:#D30102}.light .ct-0a6144{color:#CB4B16}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:Vue:Make Nuxt handle Obsidian highlights.md","_source":"content","_file":"Frontend/Vue/Make Nuxt handle Obsidian highlights.md","_extension":"md"} \ No newline at end of file +{"_path":"/frontend/vue/make-nuxt-handle-obsidian-highlights","_dir":"vue","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Make Nuxt Handle Obsidian Highlights","description":"By default Nuxt Content Plugin not handling highlight links. To fix that we will create Nitro plugin:","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"By default "},{"type":"element","tag":"a","props":{"href":"https://content.nuxtjs.org","rel":["nofollow"]},"children":[{"type":"text","value":"Nuxt Content Plugin"}]},{"type":"text","value":" not handling "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"highlight"}]},{"type":"text","value":" links. To fix that we will create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Nitro"}]},{"type":"text","value":" plugin:"}]},{"type":"element","tag":"code","props":{"code":"// ~/server/plugins/highlight.ts\nexport default defineNitroPlugin((nitroApp) => {\n nitroApp.hooks.hook(\"content:file:beforeParse\", (file) => {\n if (file._id.endsWith(\".md\")) {\n file.body = file.body.replace(\n /==([^=]+)==/gs,\n `$1`\n );\n }\n });\n});\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// ~/server/plugins/highlight.ts\nexport default defineNitroPlugin((nitroApp) => {\n nitroApp.hooks.hook(\"content:file:beforeParse\", (file) => {\n if (file._id.endsWith(\".md\")) {\n file.body = file.body.replace(\n /==([^=]+)==/gs,\n `$1`\n );\n }\n });\n});\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"By default "},{"type":"element","tag":"a","props":{"href":"https://content.nuxtjs.org","rel":["nofollow"]},"children":[{"type":"text","value":"Nuxt Content Plugin"}]},{"type":"text","value":" not handling "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"highlight"}]},{"type":"text","value":" links. To fix that we will create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Nitro"}]},{"type":"text","value":" plugin:"}]},{"type":"element","tag":"code","props":{"code":"// ~/server/plugins/highlight.ts\nexport default defineNitroPlugin((nitroApp) => {\n nitroApp.hooks.hook(\"content:file:beforeParse\", (file) => {\n if (file._id.endsWith(\".md\")) {\n file.body = file.body.replace(\n /==([^=]+)==/gs,\n `$1`\n );\n }\n });\n});\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-04ca08"},"children":[{"type":"text","value":"// ~/server/plugins/highlight.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bbd172"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-0a5bed"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bbd172"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-0a5bed"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3ce9f3"},"children":[{"type":"text","value":"defineNitroPlugin"}]},{"type":"element","tag":"span","props":{"class":"ct-0a5bed"},"children":[{"type":"text","value":"((nitroApp) "}]},{"type":"element","tag":"span","props":{"class":"ct-441e0e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-0a5bed"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06a11a"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0942f1"},"children":[{"type":"text","value":"nitroApp"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-0942f1"},"children":[{"type":"text","value":"hooks"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2a60cf"},"children":[{"type":"text","value":"hook"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-206e54"},"children":[{"type":"text","value":"\"content:file:beforeParse\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c10891"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-0942f1"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-0942f1"},"children":[{"type":"text","value":"_id"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2a60cf"},"children":[{"type":"text","value":"endsWith"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-206e54"},"children":[{"type":"text","value":"\".md\""}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0942f1"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-0942f1"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c10891"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0942f1"},"children":[{"type":"text","value":"file"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-0942f1"},"children":[{"type":"text","value":"body"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2a60cf"},"children":[{"type":"text","value":"replace"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6dc7d7"},"children":[{"type":"text","value":"/==("}]},{"type":"element","tag":"span","props":{"class":"ct-58c87b"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-c10891"},"children":[{"type":"text","value":"^"}]},{"type":"element","tag":"span","props":{"class":"ct-58c87b"},"children":[{"type":"text","value":"=]"}]},{"type":"element","tag":"span","props":{"class":"ct-c10891"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-6dc7d7"},"children":[{"type":"text","value":")==/"}]},{"type":"element","tag":"span","props":{"class":"ct-c10891"},"children":[{"type":"text","value":"gs"}]},{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-206e54"},"children":[{"type":"text","value":"`$1`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e30717"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-06a11a"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-0a5bed"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-06a11a"},"children":[{"type":"text","value":";"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-58c87b{color:#79C0FF}.ct-6dc7d7{color:#A5D6FF}.ct-c10891{color:#FF7B72}.ct-206e54{color:#A5D6FF}.ct-2a60cf{color:#D2A8FF}.ct-0942f1{color:#C9D1D9}.ct-e30717{color:#C9D1D9}.ct-06a11a{color:#C9D1D9}.ct-441e0e{color:#FF7B72}.ct-3ce9f3{color:#D2A8FF}.ct-0a5bed{color:#FFA657}.ct-bbd172{color:#FF7B72}.ct-04ca08{color:#8B949E}.light .ct-04ca08{color:#93A1A1}.light .ct-bbd172{color:#859900}.light .ct-0a5bed{color:#657B83}.light .ct-3ce9f3{color:#268BD2}.light .ct-441e0e{color:#073642}.light .ct-06a11a{color:#657B83}.light .ct-e30717{color:#657B83}.light .ct-0942f1{color:#268BD2}.light .ct-2a60cf{color:#268BD2}.light .ct-206e54{color:#2AA198}.light .ct-c10891{color:#859900}.light .ct-6dc7d7{color:#D30102}.light .ct-58c87b{color:#CB4B16}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:Vue:Make Nuxt handle Obsidian highlights.md","_source":"content","_file":"Frontend/Vue/Make Nuxt handle Obsidian highlights.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/SEkBVlx0jP.json b/docs/api/_content/query/SEkBVlx0jP.json index 0cf64bc..e7f6dcd 100644 --- a/docs/api/_content/query/SEkBVlx0jP.json +++ b/docs/api/_content/query/SEkBVlx0jP.json @@ -1 +1 @@ -{"_path":"/frontend/react/detect-hook-deps-changes-with-usewhatschanged","_dir":"react","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Detect Hook Deps Changes With UseWhatsChanged","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"code","props":{"code":"import { useEffect, useRef } from 'react';\n\n/** Pass dictionary of `props` as argument and it will\n * tell you, which one changed after rerender.\n * Use `prefix` to distinguish props of different components.\n */\nexport const useWhatsChanged = (\n props: Record,\n prefix = '',\n) => {\n const prevProps = useRef(props);\n\n useEffect(() => {\n Object.entries(props).forEach(([key, value]) => {\n if (\n !Object.prototype.hasOwnProperty.call(prevProps.current, key) ||\n prevProps.current[key] !== value\n ) {\n console.log(`${prefix} ${key} has changed`);\n }\n });\n\n prevProps.current = props;\n }, [props, prefix]);\n};\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { useEffect, useRef } from 'react';\n\n/** Pass dictionary of `props` as argument and it will\n * tell you, which one changed after rerender.\n * Use `prefix` to distinguish props of different components.\n */\nexport const useWhatsChanged = (\n props: Record,\n prefix = '',\n) => {\n const prevProps = useRef(props);\n\n useEffect(() => {\n Object.entries(props).forEach(([key, value]) => {\n if (\n !Object.prototype.hasOwnProperty.call(prevProps.current, key) ||\n prevProps.current[key] !== value\n ) {\n console.log(`${prefix} ${key} has changed`);\n }\n });\n\n prevProps.current = props;\n }, [props, prefix]);\n};\n\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"code","props":{"code":"import { useEffect, useRef } from 'react';\n\n/** Pass dictionary of `props` as argument and it will\n * tell you, which one changed after rerender.\n * Use `prefix` to distinguish props of different components.\n */\nexport const useWhatsChanged = (\n props: Record,\n prefix = '',\n) => {\n const prevProps = useRef(props);\n\n useEffect(() => {\n Object.entries(props).forEach(([key, value]) => {\n if (\n !Object.prototype.hasOwnProperty.call(prevProps.current, key) ||\n prevProps.current[key] !== value\n ) {\n console.log(`${prefix} ${key} has changed`);\n }\n });\n\n prevProps.current = props;\n }, [props, prefix]);\n};\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ca2f8e"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-ca2f8e"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-34dada"},"children":[{"type":"text","value":"'react'"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b09843"},"children":[{"type":"text","value":"/** Pass dictionary of `props` as argument and it will"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b09843"},"children":[{"type":"text","value":" * tell you, which one changed after rerender."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b09843"},"children":[{"type":"text","value":" * Use `prefix` to distinguish props of different components."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b09843"},"children":[{"type":"text","value":" */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ca2f8e"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a12dc4"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6e8da2"},"children":[{"type":"text","value":"useWhatsChanged"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ca2f8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e7e798"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2785b1"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-d5ec24"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-e7e798"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-520617"},"children":[{"type":"text","value":"Record"}]},{"type":"element","tag":"span","props":{"class":"ct-e7e798"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-ed0b46"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-e7e798"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-ed0b46"},"children":[{"type":"text","value":"unknown"}]},{"type":"element","tag":"span","props":{"class":"ct-e7e798"},"children":[{"type":"text","value":">,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"prefix"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ca2f8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-34dada"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-a12dc4"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a12dc4"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-692261"},"children":[{"type":"text","value":"prevProps"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ca2f8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6e8da2"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6e8da2"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-a12dc4"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e7e798"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ed0b46"},"children":[{"type":"text","value":"Object"}]},{"type":"element","tag":"span","props":{"class":"ct-e7e798"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2412ed"},"children":[{"type":"text","value":"entries"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ca2f8e"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"prevProps"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":"] "}]},{"type":"element","tag":"span","props":{"class":"ct-ca2f8e"},"children":[{"type":"text","value":"!=="}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"value"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-6e8da2"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-34dada"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"prefix"}]},{"type":"element","tag":"span","props":{"class":"ct-34dada"},"children":[{"type":"text","value":"} ${"}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-34dada"},"children":[{"type":"text","value":"} has changed`"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"prevProps"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ca2f8e"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":" }, ["}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-4d5aa5"},"children":[{"type":"text","value":"prefix"}]},{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":"]);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-20cbd5"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-2412ed{color:#D2A8FF}.ct-692261{color:#79C0FF}.ct-ed0b46{color:#79C0FF}.ct-520617{color:#FFA657}.ct-d5ec24{color:#FF7B72}.ct-2785b1{color:#FFA657}.ct-e7e798{color:#C9D1D9}.ct-6e8da2{color:#D2A8FF}.ct-a12dc4{color:#FF7B72}.ct-b09843{color:#8B949E}.ct-34dada{color:#A5D6FF}.ct-4d5aa5{color:#C9D1D9}.ct-20cbd5{color:#C9D1D9}.ct-ca2f8e{color:#FF7B72}.light .ct-ca2f8e{color:#859900}.light .ct-20cbd5{color:#657B83}.light .ct-4d5aa5{color:#268BD2}.light .ct-34dada{color:#2AA198}.light .ct-b09843{color:#93A1A1}.light .ct-a12dc4{color:#073642}.light .ct-6e8da2{color:#268BD2}.light .ct-e7e798{color:#657B83}.light .ct-2785b1{color:#657B83}.light .ct-d5ec24{color:#859900}.light .ct-520617{color:#268BD2}.light .ct-ed0b46{color:#859900}.light .ct-692261{color:#268BD2}.light .ct-2412ed{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:React:Detect hook deps changes with useWhatsChanged.md","_source":"content","_file":"Frontend/React/Detect hook deps changes with useWhatsChanged.md","_extension":"md"} \ No newline at end of file +{"_path":"/frontend/react/detect-hook-deps-changes-with-usewhatschanged","_dir":"react","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Detect Hook Deps Changes With UseWhatsChanged","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"code","props":{"code":"import { useEffect, useRef } from 'react';\n\n/** Pass dictionary of `props` as argument and it will\n * tell you, which one changed after rerender.\n * Use `prefix` to distinguish props of different components.\n */\nexport const useWhatsChanged = (\n props: Record,\n prefix = '',\n) => {\n const prevProps = useRef(props);\n\n useEffect(() => {\n Object.entries(props).forEach(([key, value]) => {\n if (\n !Object.prototype.hasOwnProperty.call(prevProps.current, key) ||\n prevProps.current[key] !== value\n ) {\n console.log(`${prefix} ${key} has changed`);\n }\n });\n\n prevProps.current = props;\n }, [props, prefix]);\n};\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { useEffect, useRef } from 'react';\n\n/** Pass dictionary of `props` as argument and it will\n * tell you, which one changed after rerender.\n * Use `prefix` to distinguish props of different components.\n */\nexport const useWhatsChanged = (\n props: Record,\n prefix = '',\n) => {\n const prevProps = useRef(props);\n\n useEffect(() => {\n Object.entries(props).forEach(([key, value]) => {\n if (\n !Object.prototype.hasOwnProperty.call(prevProps.current, key) ||\n prevProps.current[key] !== value\n ) {\n console.log(`${prefix} ${key} has changed`);\n }\n });\n\n prevProps.current = props;\n }, [props, prefix]);\n};\n\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"code","props":{"code":"import { useEffect, useRef } from 'react';\n\n/** Pass dictionary of `props` as argument and it will\n * tell you, which one changed after rerender.\n * Use `prefix` to distinguish props of different components.\n */\nexport const useWhatsChanged = (\n props: Record,\n prefix = '',\n) => {\n const prevProps = useRef(props);\n\n useEffect(() => {\n Object.entries(props).forEach(([key, value]) => {\n if (\n !Object.prototype.hasOwnProperty.call(prevProps.current, key) ||\n prevProps.current[key] !== value\n ) {\n console.log(`${prefix} ${key} has changed`);\n }\n });\n\n prevProps.current = props;\n }, [props, prefix]);\n};\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b27501"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-b27501"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-851537"},"children":[{"type":"text","value":"'react'"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e9884"},"children":[{"type":"text","value":"/** Pass dictionary of `props` as argument and it will"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e9884"},"children":[{"type":"text","value":" * tell you, which one changed after rerender."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e9884"},"children":[{"type":"text","value":" * Use `prefix` to distinguish props of different components."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e9884"},"children":[{"type":"text","value":" */"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b27501"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b5989a"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3b4b35"},"children":[{"type":"text","value":"useWhatsChanged"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b27501"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d4c992"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ab123e"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-0a753e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-d4c992"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b30c00"},"children":[{"type":"text","value":"Record"}]},{"type":"element","tag":"span","props":{"class":"ct-d4c992"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-989f48"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-d4c992"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-989f48"},"children":[{"type":"text","value":"unknown"}]},{"type":"element","tag":"span","props":{"class":"ct-d4c992"},"children":[{"type":"text","value":">,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"prefix"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b27501"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-851537"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-b5989a"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b5989a"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0c4f6c"},"children":[{"type":"text","value":"prevProps"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b27501"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3b4b35"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3b4b35"},"children":[{"type":"text","value":"useEffect"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-b5989a"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d4c992"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-989f48"},"children":[{"type":"text","value":"Object"}]},{"type":"element","tag":"span","props":{"class":"ct-d4c992"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-641741"},"children":[{"type":"text","value":"entries"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b27501"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"prevProps"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":"] "}]},{"type":"element","tag":"span","props":{"class":"ct-b27501"},"children":[{"type":"text","value":"!=="}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"value"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-3b4b35"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-851537"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"prefix"}]},{"type":"element","tag":"span","props":{"class":"ct-851537"},"children":[{"type":"text","value":"} ${"}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-851537"},"children":[{"type":"text","value":"} has changed`"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"prevProps"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b27501"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":" }, ["}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"props"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-e40149"},"children":[{"type":"text","value":"prefix"}]},{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":"]);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1d28d"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-641741{color:#D2A8FF}.ct-0c4f6c{color:#79C0FF}.ct-989f48{color:#79C0FF}.ct-b30c00{color:#FFA657}.ct-0a753e{color:#FF7B72}.ct-ab123e{color:#FFA657}.ct-d4c992{color:#C9D1D9}.ct-3b4b35{color:#D2A8FF}.ct-b5989a{color:#FF7B72}.ct-1e9884{color:#8B949E}.ct-851537{color:#A5D6FF}.ct-e40149{color:#C9D1D9}.ct-b1d28d{color:#C9D1D9}.ct-b27501{color:#FF7B72}.light .ct-b27501{color:#859900}.light .ct-b1d28d{color:#657B83}.light .ct-e40149{color:#268BD2}.light .ct-851537{color:#2AA198}.light .ct-1e9884{color:#93A1A1}.light .ct-b5989a{color:#073642}.light .ct-3b4b35{color:#268BD2}.light .ct-d4c992{color:#657B83}.light .ct-ab123e{color:#657B83}.light .ct-0a753e{color:#859900}.light .ct-b30c00{color:#268BD2}.light .ct-989f48{color:#859900}.light .ct-0c4f6c{color:#268BD2}.light .ct-641741{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:React:Detect hook deps changes with useWhatsChanged.md","_source":"content","_file":"Frontend/React/Detect hook deps changes with useWhatsChanged.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/TvYXYGXdZ0.json b/docs/api/_content/query/TvYXYGXdZ0.json index fc4b3e1..5b0f3f3 100644 --- a/docs/api/_content/query/TvYXYGXdZ0.json +++ b/docs/api/_content/query/TvYXYGXdZ0.json @@ -1 +1 @@ -{"_path":"/sql/mysql-and-mariadb-setup","_dir":"sql","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"MySQL And MariaDB Setup","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"install-mariadb-on-ubuntu-2004-lts"},"children":[{"type":"text","value":"Install MariaDB on Ubuntu 20.04 LTS"}]},{"type":"element","tag":"code","props":{"code":"sudo apt update\nsudo apt install mariadb-server\nsudo mysql_secure_installation\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"sudo apt update\nsudo apt install mariadb-server\nsudo mysql_secure_installation\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"access-database-from-outside"},"children":[{"type":"text","value":"Access Database from outside"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Open "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/mysql/mariadb.conf.d/50-server.cnf"}]},{"type":"text","value":" and change the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"bind-address"}]},{"type":"text","value":" to:"}]},{"type":"element","tag":"code","props":{"code":"...\nbind-address = 0.0.0.0\n...\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"...\nbind-address = 0.0.0.0\n...\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"create-administrative-user"},"children":[{"type":"text","value":"Create Administrative User"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Create a new user "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"newuser"}]},{"type":"text","value":" for the host "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"localhost"}]},{"type":"text","value":" with a new "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"password"}]},{"type":"text","value":":"}]}]},{"type":"element","tag":"code","props":{"code":"CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password';\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password';\n"}]}]}]},{"type":"element","tag":"ol","props":{"start":2},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Grant all permissions to the new user"}]}]},{"type":"element","tag":"code","props":{"code":"GRANT ALL PRIVILEGES ON * . * TO 'newuser'@'localhost';\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"GRANT ALL PRIVILEGES ON * . * TO 'newuser'@'localhost';\n"}]}]}]},{"type":"element","tag":"ol","props":{"start":3},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Update permissions"}]}]},{"type":"element","tag":"code","props":{"code":"FLUSH PRIVILEGES;\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"FLUSH PRIVILEGES;\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"install-mariadb-on-ubuntu-2004-lts"},"children":[{"type":"text","value":"Install MariaDB on Ubuntu 20.04 LTS"}]},{"type":"element","tag":"code","props":{"code":"sudo apt update\nsudo apt install mariadb-server\nsudo mysql_secure_installation\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cf1a8e"},"children":[{"type":"text","value":"sudo apt update"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cf1a8e"},"children":[{"type":"text","value":"sudo apt install mariadb-server"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cf1a8e"},"children":[{"type":"text","value":"sudo mysql_secure_installation"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"access-database-from-outside"},"children":[{"type":"text","value":"Access Database from outside"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Open "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/mysql/mariadb.conf.d/50-server.cnf"}]},{"type":"text","value":" and change the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"bind-address"}]},{"type":"text","value":" to:"}]},{"type":"element","tag":"code","props":{"code":"...\nbind-address = 0.0.0.0\n...\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cf1a8e"},"children":[{"type":"text","value":"..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cf1a8e"},"children":[{"type":"text","value":"bind-"}]},{"type":"element","tag":"span","props":{"class":"ct-a46354"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-cf1a8e"},"children":[{"type":"text","value":" = 0.0.0.0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cf1a8e"},"children":[{"type":"text","value":"..."}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"create-administrative-user"},"children":[{"type":"text","value":"Create Administrative User"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Create a new user "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"newuser"}]},{"type":"text","value":" for the host "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"localhost"}]},{"type":"text","value":" with a new "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"password"}]},{"type":"text","value":":"}]}]},{"type":"element","tag":"code","props":{"code":"CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password';\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password';"}]}]}]}]}]},{"type":"element","tag":"ol","props":{"start":2},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Grant all permissions to the new user"}]}]},{"type":"element","tag":"code","props":{"code":"GRANT ALL PRIVILEGES ON * . * TO 'newuser'@'localhost';\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"GRANT ALL PRIVILEGES ON * . * TO 'newuser'@'localhost';"}]}]}]}]}]},{"type":"element","tag":"ol","props":{"start":3},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Update permissions"}]}]},{"type":"element","tag":"code","props":{"code":"FLUSH PRIVILEGES;\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"FLUSH PRIVILEGES;"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-a46354{color:#FF7B72}.ct-cf1a8e{color:#C9D1D9}.light .ct-cf1a8e{color:#657B83}.light .ct-a46354{color:#859900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"install-mariadb-on-ubuntu-2004-lts","depth":2,"text":"Install MariaDB on Ubuntu 20.04 LTS"},{"id":"access-database-from-outside","depth":2,"text":"Access Database from outside"},{"id":"create-administrative-user","depth":2,"text":"Create Administrative User"}]}},"_type":"markdown","_id":"content:SQL:MySQL and MariaDB setup.md","_source":"content","_file":"SQL/MySQL and MariaDB setup.md","_extension":"md"} \ No newline at end of file +{"_path":"/sql/mysql-and-mariadb-setup","_dir":"sql","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"MySQL And MariaDB Setup","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"install-mariadb-on-ubuntu-2004-lts"},"children":[{"type":"text","value":"Install MariaDB on Ubuntu 20.04 LTS"}]},{"type":"element","tag":"code","props":{"code":"sudo apt update\nsudo apt install mariadb-server\nsudo mysql_secure_installation\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"sudo apt update\nsudo apt install mariadb-server\nsudo mysql_secure_installation\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"access-database-from-outside"},"children":[{"type":"text","value":"Access Database from outside"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Open "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/mysql/mariadb.conf.d/50-server.cnf"}]},{"type":"text","value":" and change the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"bind-address"}]},{"type":"text","value":" to:"}]},{"type":"element","tag":"code","props":{"code":"...\nbind-address = 0.0.0.0\n...\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"...\nbind-address = 0.0.0.0\n...\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"create-administrative-user"},"children":[{"type":"text","value":"Create Administrative User"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Create a new user "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"newuser"}]},{"type":"text","value":" for the host "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"localhost"}]},{"type":"text","value":" with a new "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"password"}]},{"type":"text","value":":"}]}]},{"type":"element","tag":"code","props":{"code":"CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password';\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password';\n"}]}]}]},{"type":"element","tag":"ol","props":{"start":2},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Grant all permissions to the new user"}]}]},{"type":"element","tag":"code","props":{"code":"GRANT ALL PRIVILEGES ON * . * TO 'newuser'@'localhost';\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"GRANT ALL PRIVILEGES ON * . * TO 'newuser'@'localhost';\n"}]}]}]},{"type":"element","tag":"ol","props":{"start":3},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Update permissions"}]}]},{"type":"element","tag":"code","props":{"code":"FLUSH PRIVILEGES;\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"FLUSH PRIVILEGES;\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"install-mariadb-on-ubuntu-2004-lts"},"children":[{"type":"text","value":"Install MariaDB on Ubuntu 20.04 LTS"}]},{"type":"element","tag":"code","props":{"code":"sudo apt update\nsudo apt install mariadb-server\nsudo mysql_secure_installation\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-775f4b"},"children":[{"type":"text","value":"sudo apt update"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-775f4b"},"children":[{"type":"text","value":"sudo apt install mariadb-server"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-775f4b"},"children":[{"type":"text","value":"sudo mysql_secure_installation"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"access-database-from-outside"},"children":[{"type":"text","value":"Access Database from outside"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Open "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/mysql/mariadb.conf.d/50-server.cnf"}]},{"type":"text","value":" and change the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"bind-address"}]},{"type":"text","value":" to:"}]},{"type":"element","tag":"code","props":{"code":"...\nbind-address = 0.0.0.0\n...\n","language":"nginx"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-775f4b"},"children":[{"type":"text","value":"..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-775f4b"},"children":[{"type":"text","value":"bind-"}]},{"type":"element","tag":"span","props":{"class":"ct-409982"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-775f4b"},"children":[{"type":"text","value":" = 0.0.0.0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-775f4b"},"children":[{"type":"text","value":"..."}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"create-administrative-user"},"children":[{"type":"text","value":"Create Administrative User"}]},{"type":"element","tag":"ol","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Create a new user "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"newuser"}]},{"type":"text","value":" for the host "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"localhost"}]},{"type":"text","value":" with a new "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"password"}]},{"type":"text","value":":"}]}]},{"type":"element","tag":"code","props":{"code":"CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password';\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password';"}]}]}]}]}]},{"type":"element","tag":"ol","props":{"start":2},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Grant all permissions to the new user"}]}]},{"type":"element","tag":"code","props":{"code":"GRANT ALL PRIVILEGES ON * . * TO 'newuser'@'localhost';\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"GRANT ALL PRIVILEGES ON * . * TO 'newuser'@'localhost';"}]}]}]}]}]},{"type":"element","tag":"ol","props":{"start":3},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Update permissions"}]}]},{"type":"element","tag":"code","props":{"code":"FLUSH PRIVILEGES;\n","language":"mysql"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"FLUSH PRIVILEGES;"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-409982{color:#FF7B72}.ct-775f4b{color:#C9D1D9}.light .ct-775f4b{color:#657B83}.light .ct-409982{color:#859900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"install-mariadb-on-ubuntu-2004-lts","depth":2,"text":"Install MariaDB on Ubuntu 20.04 LTS"},{"id":"access-database-from-outside","depth":2,"text":"Access Database from outside"},{"id":"create-administrative-user","depth":2,"text":"Create Administrative User"}]}},"_type":"markdown","_id":"content:SQL:MySQL and MariaDB setup.md","_source":"content","_file":"SQL/MySQL and MariaDB setup.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/UBl6xR2vxQ.json b/docs/api/_content/query/UBl6xR2vxQ.json index 93e1d6d..b7abf6b 100644 --- a/docs/api/_content/query/UBl6xR2vxQ.json +++ b/docs/api/_content/query/UBl6xR2vxQ.json @@ -1 +1 @@ -{"_path":"/docker/refresh-containers-on-pull","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Refresh Containers On Pull","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"setting-up-watchtower"},"children":[{"type":"text","value":"Setting up watchtower"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://containrrr.dev/watchtower/","rel":["nofollow"]},"children":[{"type":"text","value":"Watchtower"}]},{"type":"text","value":" will automatically pull updated #docker containers. Can be used with "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"Private docker registry"}]},{"type":"text","value":" and "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nservices:\n watchtower:\n container_name: docker__watchtower\n image: v2tec/watchtower\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n - /home/user/.docker/config.json:/config.json\n command: --interval 60 image_1 image_2\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: \"3\"\n\nservices:\n watchtower:\n container_name: docker__watchtower\n image: v2tec/watchtower\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n - /home/user/.docker/config.json:/config.json\n command: --interval 60 image_1 image_2\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"setting-up-watchtower"},"children":[{"type":"text","value":"Setting up watchtower"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://containrrr.dev/watchtower/","rel":["nofollow"]},"children":[{"type":"text","value":"Watchtower"}]},{"type":"text","value":" will automatically pull updated #docker containers. Can be used with "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"Private docker registry"}]},{"type":"text","value":" and "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nservices:\n watchtower:\n container_name: docker__watchtower\n image: v2tec/watchtower\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n - /home/user/.docker/config.json:/config.json\n command: --interval 60 image_1 image_2\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5e83ab"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8f1978"},"children":[{"type":"text","value":"\"3\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5e83ab"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e83ab"},"children":[{"type":"text","value":"watchtower"}]},{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e83ab"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8f1978"},"children":[{"type":"text","value":"docker__watchtower"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e83ab"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8f1978"},"children":[{"type":"text","value":"v2tec/watchtower"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e83ab"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8f1978"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e83ab"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8f1978"},"children":[{"type":"text","value":"/var/run/docker.sock:/var/run/docker.sock"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-8f1978"},"children":[{"type":"text","value":"/home/user/.docker/config.json:/config.json"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5e83ab"},"children":[{"type":"text","value":"command"}]},{"type":"element","tag":"span","props":{"class":"ct-d50eff"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8f1978"},"children":[{"type":"text","value":"--interval 60 image_1 image_2"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-8f1978{color:#A5D6FF}.ct-d50eff{color:#C9D1D9}.ct-5e83ab{color:#7EE787}.light .ct-5e83ab{color:#268BD2}.light .ct-d50eff{color:#657B83}.light .ct-8f1978{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"setting-up-watchtower","depth":2,"text":"Setting up watchtower"}]}},"_type":"markdown","_id":"content:Docker:Refresh containers on pull.md","_source":"content","_file":"Docker/Refresh containers on pull.md","_extension":"md"} \ No newline at end of file +{"_path":"/docker/refresh-containers-on-pull","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Refresh Containers On Pull","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"setting-up-watchtower"},"children":[{"type":"text","value":"Setting up watchtower"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://containrrr.dev/watchtower/","rel":["nofollow"]},"children":[{"type":"text","value":"Watchtower"}]},{"type":"text","value":" will automatically pull updated #docker containers. Can be used with "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"Private docker registry"}]},{"type":"text","value":" and "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nservices:\n watchtower:\n container_name: docker__watchtower\n image: v2tec/watchtower\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n - /home/user/.docker/config.json:/config.json\n command: --interval 60 image_1 image_2\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: \"3\"\n\nservices:\n watchtower:\n container_name: docker__watchtower\n image: v2tec/watchtower\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n - /home/user/.docker/config.json:/config.json\n command: --interval 60 image_1 image_2\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"setting-up-watchtower"},"children":[{"type":"text","value":"Setting up watchtower"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://containrrr.dev/watchtower/","rel":["nofollow"]},"children":[{"type":"text","value":"Watchtower"}]},{"type":"text","value":" will automatically pull updated #docker containers. Can be used with "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"Private docker registry"}]},{"type":"text","value":" and "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nservices:\n watchtower:\n container_name: docker__watchtower\n image: v2tec/watchtower\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n - /home/user/.docker/config.json:/config.json\n command: --interval 60 image_1 image_2\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1eb56c"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-7a2acd"},"children":[{"type":"text","value":"\"3\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1eb56c"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1eb56c"},"children":[{"type":"text","value":"watchtower"}]},{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1eb56c"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-7a2acd"},"children":[{"type":"text","value":"docker__watchtower"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1eb56c"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-7a2acd"},"children":[{"type":"text","value":"v2tec/watchtower"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1eb56c"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-7a2acd"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1eb56c"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-7a2acd"},"children":[{"type":"text","value":"/var/run/docker.sock:/var/run/docker.sock"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-7a2acd"},"children":[{"type":"text","value":"/home/user/.docker/config.json:/config.json"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1eb56c"},"children":[{"type":"text","value":"command"}]},{"type":"element","tag":"span","props":{"class":"ct-b5287a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-7a2acd"},"children":[{"type":"text","value":"--interval 60 image_1 image_2"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-7a2acd{color:#A5D6FF}.ct-b5287a{color:#C9D1D9}.ct-1eb56c{color:#7EE787}.light .ct-1eb56c{color:#268BD2}.light .ct-b5287a{color:#657B83}.light .ct-7a2acd{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"setting-up-watchtower","depth":2,"text":"Setting up watchtower"}]}},"_type":"markdown","_id":"content:Docker:Refresh containers on pull.md","_source":"content","_file":"Docker/Refresh containers on pull.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/WJQDeZ21lK.json b/docs/api/_content/query/WJQDeZ21lK.json index 36f4eed..c10b3f3 100644 --- a/docs/api/_content/query/WJQDeZ21lK.json +++ b/docs/api/_content/query/WJQDeZ21lK.json @@ -1 +1 @@ -{"_path":"/git/git-aliases-and-useful-commands","_dir":"git","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Git Aliases And Useful Commands","description":"Shorthands for #git commands can be specified. Should be placed at ~/.gitconfig.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shorthands for #git commands can be specified. Should be placed at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"~/.gitconfig"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"[alias]\n flush = git clean-branches branch | grep -v master | xargs git branch -D\n lol = log --oneline --graph\n l = lol\n c = commit -am\n cv = commit --no-verify -am\n p = push\n pf = p --force-with-lease\n ignore-now = update-index --skip-worktree\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"[alias]\n flush = git clean-branches branch | grep -v master | xargs git branch -D\n lol = log --oneline --graph\n l = lol\n c = commit -am\n cv = commit --no-verify -am\n p = push\n pf = p --force-with-lease\n ignore-now = update-index --skip-worktree\n"}]}]}]},{"type":"element","tag":"table","props":{},"children":[{"type":"element","tag":"thead","props":{},"children":[{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"th","props":{"align":null},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"command"}]}]},{"type":"element","tag":"th","props":{"align":null},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"description"}]}]}]}]},{"type":"element","tag":"tbody","props":{},"children":[{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git flush"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"drops all branches, except master"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git lol"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"shows log"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git c"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"commits with message"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git cv"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"commits without hooks"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git p"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"pushes"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git pf"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"push with --force and additional check"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git ignore-now"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"starts ignoring file from now on"}]}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shorthands for #git commands can be specified. Should be placed at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"~/.gitconfig"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"[alias]\n flush = git clean-branches branch | grep -v master | xargs git branch -D\n lol = log --oneline --graph\n l = lol\n c = commit -am\n cv = commit --no-verify -am\n p = push\n pf = p --force-with-lease\n ignore-now = update-index --skip-worktree\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"[alias]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" flush "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" git clean"}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"branches branch "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" grep "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"v master "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" xargs git branch "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"D"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" lol "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" log "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"oneline "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"graph"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" l "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" lol"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" c "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" commit "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"am"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" cv "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" commit "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"no"}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"verify "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"am"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" p "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" push"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" pf "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" p "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"force"}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"with"}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"lease"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" ignore"}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"now "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":" update"}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"index "}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"skip"}]},{"type":"element","tag":"span","props":{"class":"ct-b24a9d"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-29e270"},"children":[{"type":"text","value":"worktree"}]}]}]}]}]},{"type":"element","tag":"table","props":{},"children":[{"type":"element","tag":"thead","props":{},"children":[{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"th","props":{"align":null},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"command"}]}]},{"type":"element","tag":"th","props":{"align":null},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"description"}]}]}]}]},{"type":"element","tag":"tbody","props":{},"children":[{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git flush"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"drops all branches, except master"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git lol"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"shows log"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git c"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"commits with message"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git cv"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"commits without hooks"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git p"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"pushes"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git pf"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"push with --force and additional check"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git ignore-now"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"starts ignoring file from now on"}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-b24a9d{color:#FF7B72}.ct-29e270{color:#C9D1D9}.light .ct-29e270{color:#657B83}.light .ct-b24a9d{color:#859900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Git:Git aliases and useful commands.md","_source":"content","_file":"Git/Git aliases and useful commands.md","_extension":"md"} \ No newline at end of file +{"_path":"/git/git-aliases-and-useful-commands","_dir":"git","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Git Aliases And Useful Commands","description":"Shorthands for #git commands can be specified. Should be placed at ~/.gitconfig.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shorthands for #git commands can be specified. Should be placed at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"~/.gitconfig"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"[alias]\n flush = git clean-branches branch | grep -v master | xargs git branch -D\n lol = log --oneline --graph\n l = lol\n c = commit -am\n cv = commit --no-verify -am\n p = push\n pf = p --force-with-lease\n ignore-now = update-index --skip-worktree\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"[alias]\n flush = git clean-branches branch | grep -v master | xargs git branch -D\n lol = log --oneline --graph\n l = lol\n c = commit -am\n cv = commit --no-verify -am\n p = push\n pf = p --force-with-lease\n ignore-now = update-index --skip-worktree\n"}]}]}]},{"type":"element","tag":"table","props":{},"children":[{"type":"element","tag":"thead","props":{},"children":[{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"th","props":{"align":null},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"command"}]}]},{"type":"element","tag":"th","props":{"align":null},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"description"}]}]}]}]},{"type":"element","tag":"tbody","props":{},"children":[{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git flush"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"drops all branches, except master"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git lol"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"shows log"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git c"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"commits with message"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git cv"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"commits without hooks"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git p"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"pushes"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git pf"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"push with --force and additional check"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git ignore-now"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"starts ignoring file from now on"}]}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Shorthands for #git commands can be specified. Should be placed at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"~/.gitconfig"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"[alias]\n flush = git clean-branches branch | grep -v master | xargs git branch -D\n lol = log --oneline --graph\n l = lol\n c = commit -am\n cv = commit --no-verify -am\n p = push\n pf = p --force-with-lease\n ignore-now = update-index --skip-worktree\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"[alias]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" flush "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" git clean"}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"branches branch "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" grep "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"v master "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" xargs git branch "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"D"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" lol "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" log "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"oneline "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"graph"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" l "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" lol"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" c "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" commit "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"am"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" cv "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" commit "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"no"}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"verify "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"am"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" p "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" push"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" pf "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" p "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"force"}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"with"}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"lease"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" ignore"}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"now "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":" update"}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"index "}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"--"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"skip"}]},{"type":"element","tag":"span","props":{"class":"ct-da3bc5"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-9b16eb"},"children":[{"type":"text","value":"worktree"}]}]}]}]}]},{"type":"element","tag":"table","props":{},"children":[{"type":"element","tag":"thead","props":{},"children":[{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"th","props":{"align":null},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"command"}]}]},{"type":"element","tag":"th","props":{"align":null},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"description"}]}]}]}]},{"type":"element","tag":"tbody","props":{},"children":[{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git flush"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"drops all branches, except master"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git lol"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"shows log"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git c"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"commits with message"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git cv"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"commits without hooks"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git p"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"pushes"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git pf"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"push with --force and additional check"}]}]},{"type":"element","tag":"tr","props":{},"children":[{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"git ignore-now"}]}]},{"type":"element","tag":"td","props":{"align":null},"children":[{"type":"text","value":"starts ignoring file from now on"}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-da3bc5{color:#FF7B72}.ct-9b16eb{color:#C9D1D9}.light .ct-9b16eb{color:#657B83}.light .ct-da3bc5{color:#859900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Git:Git aliases and useful commands.md","_source":"content","_file":"Git/Git aliases and useful commands.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/WO7KYRkFiw.json b/docs/api/_content/query/WO7KYRkFiw.json index f70670d..25b76e6 100644 --- a/docs/api/_content/query/WO7KYRkFiw.json +++ b/docs/api/_content/query/WO7KYRkFiw.json @@ -1 +1 @@ -{"_path":"/blockchain/smart-contracts","_dir":"blockchain","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Smart Contracts","description":"For common functions see Common typescript examples.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For common functions see "},{"type":"element","tag":"a","props":{"href":"Common%20typescript%20examples"},"children":[{"type":"text","value":"Common typescript examples"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"getting-smart-contract-instance"},"children":[{"type":"text","value":"Getting smart contract instance"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful for calling smart contract methods:"}]},{"type":"element","tag":"code","props":{"code":"import { Contract } from 'web3-eth-contract';\nimport { web3 } from '.';\n\nconst getContract = (abi: object, address?: string): Contract => {\n const abiFromJson = JSON.parse(JSON.stringify(abi));\n return new web3.eth.Contract(abiFromJson, address);\n};\n\nexport default getContract;\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { Contract } from 'web3-eth-contract';\nimport { web3 } from '.';\n\nconst getContract = (abi: object, address?: string): Contract => {\n const abiFromJson = JSON.parse(JSON.stringify(abi));\n return new web3.eth.Contract(abiFromJson, address);\n};\n\nexport default getContract;\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"executing-contract-method"},"children":[{"type":"text","value":"Executing contract method"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Contract has "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"read"}]},{"type":"text","value":" and "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"write"}]},{"type":"text","value":" methods. To get a list of methods, you can paste contract address on "},{"type":"element","tag":"a","props":{"href":"https://etherscan.io/token/0xdac17f958d2ee523a2206206994597c13d831ec7#readContract","rel":["nofollow"]},"children":[{"type":"text","value":"https://etherscan.io/ ETH"}]},{"type":"text","value":" or any other service."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Read"}]},{"type":"text","value":" methods doesn't require spending "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"gas"}]},{"type":"text","value":". "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Write"}]},{"type":"text","value":" methods cost some amount of "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"gas"}]},{"type":"text","value":", hence they will be executed with confirmation from user."}]},{"type":"element","tag":"h3","props":{"id":"example-for-metamask-without-private-key"},"children":[{"type":"text","value":"Example for #Metamask without private key"}]},{"type":"element","tag":"code","props":{"code":"// see example below\nimport { getContract } from '.';\n\n// ABI of contract\nconst CONTRACT_ABI = { /* ... */ };\n // address for contract\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n\nexport const executeContractMethod = async ({}) => {\n // getting contract\n const contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n \n // Calling write method\n try {\n // authorizing with Metamask\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n // getting wallet address\n const addressUser = web3.currentProvider.selectedAddress;\n // calling \"store\" store method for contract\n // payload should include `from` address, that matches\n // current user's wallet\n await contract.methods.store(0, 'Parameter').send({\n from: addressUser,\n });\n } catch (e) {\n throw new Error(e);\n }\n \n // calling read method\n try {\n // this method can return data\n const result = await contract.methods.retrieve().call();\n } catch (e) {\n throw new Error(e);\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// see example below\nimport { getContract } from '.';\n\n// ABI of contract\nconst CONTRACT_ABI = { /* ... */ };\n // address for contract\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n\nexport const executeContractMethod = async ({}) => {\n // getting contract\n const contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n \n // Calling write method\n try {\n // authorizing with Metamask\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n // getting wallet address\n const addressUser = web3.currentProvider.selectedAddress;\n // calling \"store\" store method for contract\n // payload should include `from` address, that matches\n // current user's wallet\n await contract.methods.store(0, 'Parameter').send({\n from: addressUser,\n });\n } catch (e) {\n throw new Error(e);\n }\n \n // calling read method\n try {\n // this method can return data\n const result = await contract.methods.retrieve().call();\n } catch (e) {\n throw new Error(e);\n }\n}\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"nodejs-and-react-native-example"},"children":[{"type":"text","value":"Node.js and React Native example"}]},{"type":"element","tag":"code","props":{"code":"// see example below\nimport { getContract } from '.';\n\n// ABI контракта\nconst CONTRACT_ABI = { /* ... */ };\n// contract address\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n// getting contract\nconst contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n// account's private key\nconst privateKey = '...';\n\n// write-methods requires private key\nconst executeContractMethod = async (val: number) => {\n const transaction = contract.methods.store(val);\n const account = web3.eth.accounts.privateKeyToAccount(privateKey);\n const options = {\n to: CONTRACT_ADDRESS,\n data: transaction.encodeABI(),\n gas: await transaction.estimateGas({ from: account.address }),\n gasPrice: await web3.eth.getGasPrice(),\n };\n const signed = await web3.eth.accounts.signTransaction(\n options,\n privateKey,\n );\n await web3.eth.sendSignedTransaction(signed.rawTransaction!);\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// see example below\nimport { getContract } from '.';\n\n// ABI контракта\nconst CONTRACT_ABI = { /* ... */ };\n// contract address\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n// getting contract\nconst contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n// account's private key\nconst privateKey = '...';\n\n// write-methods requires private key\nconst executeContractMethod = async (val: number) => {\n const transaction = contract.methods.store(val);\n const account = web3.eth.accounts.privateKeyToAccount(privateKey);\n const options = {\n to: CONTRACT_ADDRESS,\n data: transaction.encodeABI(),\n gas: await transaction.estimateGas({ from: account.address }),\n gasPrice: await web3.eth.getGasPrice(),\n };\n const signed = await web3.eth.accounts.signTransaction(\n options,\n privateKey,\n );\n await web3.eth.sendSignedTransaction(signed.rawTransaction!);\n};\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"calling-a-batch-of-contracts-methods"},"children":[{"type":"text","value":"Calling a batch of contract's methods"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Function calls batch of requests, returning array of results. For example:"}]},{"type":"element","tag":"code","props":{"code":" const requests = [\n contract.method.balanceOf().call,\n contract.method.getStaked().call\n ]\n\n const result = await makeBatchRequest(request);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" const requests = [\n contract.method.balanceOf().call,\n contract.method.getStaked().call\n ]\n\n const result = await makeBatchRequest(request);\n"}]}]}]},{"type":"element","tag":"code","props":{"code":"const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n\nconst makeBatchRequest = (calls: any[]) => {\n try {\n const web3 = getWeb3NoAccount();\n const batch = new web3.BatchRequest();\n\n const promises = calls.map((call) => {\n return new Promise((resolve, reject) => {\n batch.add(\n call.request({}, (err, result) => {\n if (err) {\n reject(err);\n } else {\n resolve(result);\n }\n })\n );\n });\n });\n\n batch.execute();\n\n return Promise.all(promises);\n } catch {\n return null;\n }\n};\n\nexport default makeBatchRequest;\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n\nconst makeBatchRequest = (calls: any[]) => {\n try {\n const web3 = getWeb3NoAccount();\n const batch = new web3.BatchRequest();\n\n const promises = calls.map((call) => {\n return new Promise((resolve, reject) => {\n batch.add(\n call.request({}, (err, result) => {\n if (err) {\n reject(err);\n } else {\n resolve(result);\n }\n })\n );\n });\n });\n\n batch.execute();\n\n return Promise.all(promises);\n } catch {\n return null;\n }\n};\n\nexport default makeBatchRequest;\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"subscribing-to-smart-contract-events"},"children":[{"type":"text","value":"Subscribing to smart contract events"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There're different ways to subscribe for contract events. For all of them you will need following variables:"}]},{"type":"element","tag":"code","props":{"code":" import Web3 from 'web3';\n const web3 = new Web3('YOUR_RPC_ENDPOINT_HERE');\n const ABI = 'YOUR ABI HERE';\n const CONTRACT_ADDRESS = 'YOUR CONTRACT ADDRESS HERE';\n const myContract = new Web3.Contract(ABI, CONTRACT_ADDRESS);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" import Web3 from 'web3';\n const web3 = new Web3('YOUR_RPC_ENDPOINT_HERE');\n const ABI = 'YOUR ABI HERE';\n const CONTRACT_ADDRESS = 'YOUR CONTRACT ADDRESS HERE';\n const myContract = new Web3.Contract(ABI, CONTRACT_ADDRESS);\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"by-accessing-contractevents"},"children":[{"type":"text","value":"By accessing contract.events"}]},{"type":"element","tag":"code","props":{"code":"referralProgramContract.events\n .RegisterUser()\n .on('connected', (subscriptionId: string) => {\n console.log(`| UserRegistered | events | ${subscriptionId}`);\n })\n .on(\n 'data',\n async (event: {\n removed: boolean;\n returnValues: RegisterUserResponseInterface;\n }) => {\n try {\n if (event.removed) {\n return;\n }\n const { user, referrer } = event.returnValues;\n console.log(user, referrer);\n } catch (e) {\n console.log(`| ONCE | ${e}`);\n }\n },\n )\n .on('error', (error: ErrnoException) => {\n console.log(error);\n });\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"referralProgramContract.events\n .RegisterUser()\n .on('connected', (subscriptionId: string) => {\n console.log(`| UserRegistered | events | ${subscriptionId}`);\n })\n .on(\n 'data',\n async (event: {\n removed: boolean;\n returnValues: RegisterUserResponseInterface;\n }) => {\n try {\n if (event.removed) {\n return;\n }\n const { user, referrer } = event.returnValues;\n console.log(user, referrer);\n } catch (e) {\n console.log(`| ONCE | ${e}`);\n }\n },\n )\n .on('error', (error: ErrnoException) => {\n console.log(error);\n });\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"with-filtering"},"children":[{"type":"text","value":"With filtering"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We're listening to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Transfer"}]},{"type":"text","value":" event here:"}]},{"type":"element","tag":"code","props":{"code":" let options = {\n filter: {\n value: [],\n },\n fromBlock: 0\n };\n\n myContract.events.Transfer(options)\n .on('data', event => console.log(event))\n .on('changed', changed => console.log(changed))\n .on('error', err => throw err)\n .on('connected', str => console.log(str))\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" let options = {\n filter: {\n value: [],\n },\n fromBlock: 0\n };\n\n myContract.events.Transfer(options)\n .on('data', event => console.log(event))\n .on('changed', changed => console.log(changed))\n .on('error', err => throw err)\n .on('connected', str => console.log(str))\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"common-subscribe-method"},"children":[{"type":"text","value":"Common Subscribe method"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Filtering options can also be specified:"}]},{"type":"element","tag":"code","props":{"code":" let options = {\n fromBlock: 0,\n address: ['address-1', 'address-2'], //Only get events from specific addresses\n topics: [] //What topics to subscribe to\n };\n\n let subscription = ('logs', options, (err,event) => {\n if (!err)\n console.log(event)\n });\n\n subscription.on('data', event => console.log(event))\n subscription.on('changed', changed => console.log(changed))\n subscription.on('error', err => { throw err })\n subscription.on('connected', nr => console.log(nr))\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" let options = {\n fromBlock: 0,\n address: ['address-1', 'address-2'], //Only get events from specific addresses\n topics: [] //What topics to subscribe to\n };\n\n let subscription = ('logs', options, (err,event) => {\n if (!err)\n console.log(event)\n });\n\n subscription.on('data', event => console.log(event))\n subscription.on('changed', changed => console.log(changed))\n subscription.on('error', err => { throw err })\n subscription.on('connected', nr => console.log(nr))\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"getting-event-history"},"children":[{"type":"text","value":"Getting event history"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Getting history for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Transfer"}]},{"type":"text","value":" events for specific values. More info can be found "},{"type":"element","tag":"a","props":{"href":"https://web3js.readthedocs.io/en/v1.2.11/web3-eth-subscribe.html#","rel":["nofollow"]},"children":[{"type":"text","value":"here"}]}]},{"type":"element","tag":"code","props":{"code":" //example options(optional)\n let options = {\n filter: {\n // only get events where transfer value was 1000 or 1337\n value: ['1000', '1337'] \n },\n // number | \"earliest\" | \"pending\" | \"latest\"\n fromBlock: 0, \n toBlock: 'latest'\n };\n\n myContract.getPastEvents('Transfer', options)\n .then(results => console.log(results))\n .catch(err => throw err);\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" //example options(optional)\n let options = {\n filter: {\n // only get events where transfer value was 1000 or 1337\n value: ['1000', '1337'] \n },\n // number | \"earliest\" | \"pending\" | \"latest\"\n fromBlock: 0, \n toBlock: 'latest'\n };\n\n myContract.getPastEvents('Transfer', options)\n .then(results => console.log(results))\n .catch(err => throw err);\n\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For common functions see "},{"type":"element","tag":"a","props":{"href":"Common%20typescript%20examples"},"children":[{"type":"text","value":"Common typescript examples"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"getting-smart-contract-instance"},"children":[{"type":"text","value":"Getting smart contract instance"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful for calling smart contract methods:"}]},{"type":"element","tag":"code","props":{"code":"import { Contract } from 'web3-eth-contract';\nimport { web3 } from '.';\n\nconst getContract = (abi: object, address?: string): Contract => {\n const abiFromJson = JSON.parse(JSON.stringify(abi));\n return new web3.eth.Contract(abiFromJson, address);\n};\n\nexport default getContract;\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"Contract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'web3-eth-contract'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0e2e0"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-60ccc9"},"children":[{"type":"text","value":"abi"}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-353508"},"children":[{"type":"text","value":"object"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-60ccc9"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":"?:"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-353508"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7d4034"},"children":[{"type":"text","value":"abiFromJson"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2e4590"},"children":[{"type":"text","value":"JSON"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-7d4034"},"children":[{"type":"text","value":"parse"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"Contract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"abiFromJson"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-680997"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-680997"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"executing-contract-method"},"children":[{"type":"text","value":"Executing contract method"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Contract has "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"read"}]},{"type":"text","value":" and "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"write"}]},{"type":"text","value":" methods. To get a list of methods, you can paste contract address on "},{"type":"element","tag":"a","props":{"href":"https://etherscan.io/token/0xdac17f958d2ee523a2206206994597c13d831ec7#readContract","rel":["nofollow"]},"children":[{"type":"text","value":"https://etherscan.io/ ETH"}]},{"type":"text","value":" or any other service."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Read"}]},{"type":"text","value":" methods doesn't require spending "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"gas"}]},{"type":"text","value":". "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Write"}]},{"type":"text","value":" methods cost some amount of "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"gas"}]},{"type":"text","value":", hence they will be executed with confirmation from user."}]},{"type":"element","tag":"h3","props":{"id":"example-for-metamask-without-private-key"},"children":[{"type":"text","value":"Example for #Metamask without private key"}]},{"type":"element","tag":"code","props":{"code":"// see example below\nimport { getContract } from '.';\n\n// ABI of contract\nconst CONTRACT_ABI = { /* ... */ };\n // address for contract\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n\nexport const executeContractMethod = async ({}) => {\n // getting contract\n const contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n \n // Calling write method\n try {\n // authorizing with Metamask\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n // getting wallet address\n const addressUser = web3.currentProvider.selectedAddress;\n // calling \"store\" store method for contract\n // payload should include `from` address, that matches\n // current user's wallet\n await contract.methods.store(0, 'Parameter').send({\n from: addressUser,\n });\n } catch (e) {\n throw new Error(e);\n }\n \n // calling read method\n try {\n // this method can return data\n const result = await contract.methods.retrieve().call();\n } catch (e) {\n throw new Error(e);\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// see example below"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// ABI of contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"/* ... */"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// address for contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'0xdea164f67df4dbfe675d5271c9d404e0260f33bb'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"executeContractMethod"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ({}) "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// getting contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// Calling write method"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// authorizing with Metamask"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"({ method: "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'eth_requestAccounts'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// getting wallet address"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"addressUser"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"selectedAddress"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// calling \"store\" store method for contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// payload should include `from` address, that matches"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// current user's wallet"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"methods"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"store"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d7c5e5"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'Parameter'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"send"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" from: "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"addressUser"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3a9681"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// calling read method"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// this method can return data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"methods"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"retrieve"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"()."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"call"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3a9681"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"nodejs-and-react-native-example"},"children":[{"type":"text","value":"Node.js and React Native example"}]},{"type":"element","tag":"code","props":{"code":"// see example below\nimport { getContract } from '.';\n\n// ABI контракта\nconst CONTRACT_ABI = { /* ... */ };\n// contract address\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n// getting contract\nconst contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n// account's private key\nconst privateKey = '...';\n\n// write-methods requires private key\nconst executeContractMethod = async (val: number) => {\n const transaction = contract.methods.store(val);\n const account = web3.eth.accounts.privateKeyToAccount(privateKey);\n const options = {\n to: CONTRACT_ADDRESS,\n data: transaction.encodeABI(),\n gas: await transaction.estimateGas({ from: account.address }),\n gasPrice: await web3.eth.getGasPrice(),\n };\n const signed = await web3.eth.accounts.signTransaction(\n options,\n privateKey,\n );\n await web3.eth.sendSignedTransaction(signed.rawTransaction!);\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// see example below"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// ABI контракта"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"/* ... */"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// contract address"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'0xdea164f67df4dbfe675d5271c9d404e0260f33bb'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// getting contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// account's private key"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// write-methods requires private key"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0e2e0"},"children":[{"type":"text","value":"executeContractMethod"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-60ccc9"},"children":[{"type":"text","value":"val"}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-353508"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"methods"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"store"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"val"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"account"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"accounts"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"privateKeyToAccount"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" to: "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" data: "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"encodeABI"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"(),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" gas: "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"estimateGas"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"({ from: "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"account"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" gasPrice: "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"getGasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"(),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"signed"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"accounts"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"signTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"sendSignedTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"signed"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"rawTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"calling-a-batch-of-contracts-methods"},"children":[{"type":"text","value":"Calling a batch of contract's methods"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Function calls batch of requests, returning array of results. For example:"}]},{"type":"element","tag":"code","props":{"code":" const requests = [\n contract.method.balanceOf().call,\n contract.method.getStaked().call\n ]\n\n const result = await makeBatchRequest(request);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"requests"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"method"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"balanceOf"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"()."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"call"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"method"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"getStaked"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"()."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"call"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"makeBatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"code","props":{"code":"const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n\nconst makeBatchRequest = (calls: any[]) => {\n try {\n const web3 = getWeb3NoAccount();\n const batch = new web3.BatchRequest();\n\n const promises = calls.map((call) => {\n return new Promise((resolve, reject) => {\n batch.add(\n call.request({}, (err, result) => {\n if (err) {\n reject(err);\n } else {\n resolve(result);\n }\n })\n );\n });\n });\n\n batch.execute();\n\n return Promise.all(promises);\n } catch {\n return null;\n }\n};\n\nexport default makeBatchRequest;\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"givenProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"PROVIDER_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b0e2e0"},"children":[{"type":"text","value":"makeBatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-60ccc9"},"children":[{"type":"text","value":"calls"}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-353508"},"children":[{"type":"text","value":"any"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":"[]) "}]},{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"getWeb3NoAccount"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"batch"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"BatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"promises"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"calls"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"map"}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-353508"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-60ccc9"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-60ccc9"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"batch"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"add"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"else"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"batch"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"execute"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3a9681"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"all"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"promises"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a950c2"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-680997"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-680997"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"makeBatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"subscribing-to-smart-contract-events"},"children":[{"type":"text","value":"Subscribing to smart contract events"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There're different ways to subscribe for contract events. For all of them you will need following variables:"}]},{"type":"element","tag":"code","props":{"code":" import Web3 from 'web3';\n const web3 = new Web3('YOUR_RPC_ENDPOINT_HERE');\n const ABI = 'YOUR ABI HERE';\n const CONTRACT_ADDRESS = 'YOUR CONTRACT ADDRESS HERE';\n const myContract = new Web3.Contract(ABI, CONTRACT_ADDRESS);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'web3'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'YOUR_RPC_ENDPOINT_HERE'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'YOUR ABI HERE'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'YOUR CONTRACT ADDRESS HERE'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"myContract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"Contract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"by-accessing-contractevents"},"children":[{"type":"text","value":"By accessing contract.events"}]},{"type":"element","tag":"code","props":{"code":"referralProgramContract.events\n .RegisterUser()\n .on('connected', (subscriptionId: string) => {\n console.log(`| UserRegistered | events | ${subscriptionId}`);\n })\n .on(\n 'data',\n async (event: {\n removed: boolean;\n returnValues: RegisterUserResponseInterface;\n }) => {\n try {\n if (event.removed) {\n return;\n }\n const { user, referrer } = event.returnValues;\n console.log(user, referrer);\n } catch (e) {\n console.log(`| ONCE | ${e}`);\n }\n },\n )\n .on('error', (error: ErrnoException) => {\n console.log(error);\n });\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"referralProgramContract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"events"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"RegisterUser"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"()"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-b0e2e0"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5bc21b"},"children":[{"type":"text","value":"'connected'"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":", ("}]},{"type":"element","tag":"span","props":{"class":"ct-60ccc9"},"children":[{"type":"text","value":"subscriptionId"}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-353508"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"`| UserRegistered | events | ${"}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"subscriptionId"}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'data'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-60ccc9"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-60ccc9"},"children":[{"type":"text","value":"removed"}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-353508"},"children":[{"type":"text","value":"boolean"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-60ccc9"},"children":[{"type":"text","value":"returnValues"}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0479b3"},"children":[{"type":"text","value":"RegisterUserResponseInterface"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"removed"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"user"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-61fe70"},"children":[{"type":"text","value":"referrer"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"returnValues"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"user"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"referrer"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"`| ONCE | ${"}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" )"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-b0e2e0"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5bc21b"},"children":[{"type":"text","value":"'error'"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":", ("}]},{"type":"element","tag":"span","props":{"class":"ct-60ccc9"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-163897"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0479b3"},"children":[{"type":"text","value":"ErrnoException"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-91fca1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-78ac5e"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" });"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"with-filtering"},"children":[{"type":"text","value":"With filtering"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We're listening to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Transfer"}]},{"type":"text","value":" event here:"}]},{"type":"element","tag":"code","props":{"code":" let options = {\n filter: {\n value: [],\n },\n fromBlock: 0\n };\n\n myContract.events.Transfer(options)\n .on('data', event => console.log(event))\n .on('changed', changed => console.log(changed))\n .on('error', err => throw err)\n .on('connected', str => console.log(str))\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" filter: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" value: [],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" fromBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-d7c5e5"},"children":[{"type":"text","value":"0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"myContract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"events"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"Transfer"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'data'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'changed'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"changed"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'error'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'connected'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"str"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"))"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"common-subscribe-method"},"children":[{"type":"text","value":"Common Subscribe method"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Filtering options can also be specified:"}]},{"type":"element","tag":"code","props":{"code":" let options = {\n fromBlock: 0,\n address: ['address-1', 'address-2'], //Only get events from specific addresses\n topics: [] //What topics to subscribe to\n };\n\n let subscription = ('logs', options, (err,event) => {\n if (!err)\n console.log(event)\n });\n\n subscription.on('data', event => console.log(event))\n subscription.on('changed', changed => console.log(changed))\n subscription.on('error', err => { throw err })\n subscription.on('connected', nr => console.log(nr))\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" fromBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-d7c5e5"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" address: ["}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'address-1'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'address-2'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"], "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"//Only get events from specific addresses"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" topics: [] "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"//What topics to subscribe to"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'logs'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'data'"}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'changed'"}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"changed"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'error'"}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'connected'"}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"nr"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"))"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"getting-event-history"},"children":[{"type":"text","value":"Getting event history"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Getting history for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Transfer"}]},{"type":"text","value":" events for specific values. More info can be found "},{"type":"element","tag":"a","props":{"href":"https://web3js.readthedocs.io/en/v1.2.11/web3-eth-subscribe.html#","rel":["nofollow"]},"children":[{"type":"text","value":"here"}]}]},{"type":"element","tag":"code","props":{"code":" //example options(optional)\n let options = {\n filter: {\n // only get events where transfer value was 1000 or 1337\n value: ['1000', '1337'] \n },\n // number | \"earliest\" | \"pending\" | \"latest\"\n fromBlock: 0, \n toBlock: 'latest'\n };\n\n myContract.getPastEvents('Transfer', options)\n .then(results => console.log(results))\n .catch(err => throw err);\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"//example options(optional)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-50d99e"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c5cafe"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" filter: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// only get events where transfer value was 1000 or 1337"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" value: ["}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'1000'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'1337'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"] "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7fbf47"},"children":[{"type":"text","value":"// number | \"earliest\" | \"pending\" | \"latest\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" fromBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-d7c5e5"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" toBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'latest'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"myContract"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"getPastEvents"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b4da57"},"children":[{"type":"text","value":"'Transfer'"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c91467"},"children":[{"type":"text","value":"results"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-975d2d"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-949cf0"},"children":[{"type":"text","value":" "}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-0479b3{color:#FFA657}.ct-5bc21b{color:#A5D6FF}.ct-a950c2{color:#79C0FF}.ct-3a9681{color:#79C0FF}.ct-d7c5e5{color:#79C0FF}.ct-61fe70{color:#79C0FF}.ct-50d99e{color:#FF7B72}.ct-7fbf47{color:#8B949E}.ct-680997{color:#FFA657}.ct-975d2d{color:#D2A8FF}.ct-2e4590{color:#79C0FF}.ct-7d4034{color:#79C0FF}.ct-353508{color:#79C0FF}.ct-60ccc9{color:#FFA657}.ct-163897{color:#FF7B72}.ct-b0e2e0{color:#D2A8FF}.ct-78ac5e{color:#C9D1D9}.ct-91fca1{color:#FF7B72}.ct-b4da57{color:#A5D6FF}.ct-c91467{color:#C9D1D9}.ct-949cf0{color:#C9D1D9}.ct-c5cafe{color:#FF7B72}.light .ct-c5cafe{color:#859900}.light .ct-949cf0{color:#657B83}.light .ct-c91467{color:#268BD2}.light .ct-b4da57{color:#2AA198}.light .ct-91fca1{color:#073642}.light .ct-78ac5e{color:#657B83}.light .ct-b0e2e0{color:#268BD2}.light .ct-163897{color:#859900}.light .ct-60ccc9{color:#657B83}.light .ct-353508{color:#859900}.light .ct-7d4034{color:#268BD2}.light .ct-2e4590{color:#657B83}.light .ct-975d2d{color:#268BD2}.light .ct-680997{color:#657B83}.light .ct-7fbf47{color:#93A1A1}.light .ct-50d99e{color:#073642}.light .ct-61fe70{color:#268BD2}.light .ct-d7c5e5{color:#D33682}.light .ct-3a9681{color:#859900}.light .ct-a950c2{color:#B58900}.light .ct-5bc21b{color:#2AA198}.light .ct-0479b3{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"getting-smart-contract-instance","depth":2,"text":"Getting smart contract instance"},{"id":"executing-contract-method","depth":2,"text":"Executing contract method","children":[{"id":"example-for-metamask-without-private-key","depth":3,"text":"Example for #Metamask without private key"},{"id":"nodejs-and-react-native-example","depth":3,"text":"Node.js and React Native example"},{"id":"calling-a-batch-of-contracts-methods","depth":3,"text":"Calling a batch of contract's methods"}]},{"id":"subscribing-to-smart-contract-events","depth":2,"text":"Subscribing to smart contract events","children":[{"id":"by-accessing-contractevents","depth":3,"text":"By accessing contract.events"},{"id":"with-filtering","depth":3,"text":"With filtering"},{"id":"common-subscribe-method","depth":3,"text":"Common Subscribe method"},{"id":"getting-event-history","depth":3,"text":"Getting event history"}]}]}},"_type":"markdown","_id":"content:Blockchain:Smart contracts.md","_source":"content","_file":"Blockchain/Smart contracts.md","_extension":"md"} \ No newline at end of file +{"_path":"/blockchain/smart-contracts","_dir":"blockchain","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Smart Contracts","description":"For common functions see Common typescript examples.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For common functions see "},{"type":"element","tag":"a","props":{"href":"Common%20typescript%20examples"},"children":[{"type":"text","value":"Common typescript examples"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"getting-smart-contract-instance"},"children":[{"type":"text","value":"Getting smart contract instance"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful for calling smart contract methods:"}]},{"type":"element","tag":"code","props":{"code":"import { Contract } from 'web3-eth-contract';\nimport { web3 } from '.';\n\nconst getContract = (abi: object, address?: string): Contract => {\n const abiFromJson = JSON.parse(JSON.stringify(abi));\n return new web3.eth.Contract(abiFromJson, address);\n};\n\nexport default getContract;\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { Contract } from 'web3-eth-contract';\nimport { web3 } from '.';\n\nconst getContract = (abi: object, address?: string): Contract => {\n const abiFromJson = JSON.parse(JSON.stringify(abi));\n return new web3.eth.Contract(abiFromJson, address);\n};\n\nexport default getContract;\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"executing-contract-method"},"children":[{"type":"text","value":"Executing contract method"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Contract has "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"read"}]},{"type":"text","value":" and "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"write"}]},{"type":"text","value":" methods. To get a list of methods, you can paste contract address on "},{"type":"element","tag":"a","props":{"href":"https://etherscan.io/token/0xdac17f958d2ee523a2206206994597c13d831ec7#readContract","rel":["nofollow"]},"children":[{"type":"text","value":"https://etherscan.io/ ETH"}]},{"type":"text","value":" or any other service."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Read"}]},{"type":"text","value":" methods doesn't require spending "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"gas"}]},{"type":"text","value":". "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Write"}]},{"type":"text","value":" methods cost some amount of "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"gas"}]},{"type":"text","value":", hence they will be executed with confirmation from user."}]},{"type":"element","tag":"h3","props":{"id":"example-for-metamask-without-private-key"},"children":[{"type":"text","value":"Example for #Metamask without private key"}]},{"type":"element","tag":"code","props":{"code":"// see example below\nimport { getContract } from '.';\n\n// ABI of contract\nconst CONTRACT_ABI = { /* ... */ };\n // address for contract\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n\nexport const executeContractMethod = async ({}) => {\n // getting contract\n const contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n \n // Calling write method\n try {\n // authorizing with Metamask\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n // getting wallet address\n const addressUser = web3.currentProvider.selectedAddress;\n // calling \"store\" store method for contract\n // payload should include `from` address, that matches\n // current user's wallet\n await contract.methods.store(0, 'Parameter').send({\n from: addressUser,\n });\n } catch (e) {\n throw new Error(e);\n }\n \n // calling read method\n try {\n // this method can return data\n const result = await contract.methods.retrieve().call();\n } catch (e) {\n throw new Error(e);\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// see example below\nimport { getContract } from '.';\n\n// ABI of contract\nconst CONTRACT_ABI = { /* ... */ };\n // address for contract\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n\nexport const executeContractMethod = async ({}) => {\n // getting contract\n const contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n \n // Calling write method\n try {\n // authorizing with Metamask\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n // getting wallet address\n const addressUser = web3.currentProvider.selectedAddress;\n // calling \"store\" store method for contract\n // payload should include `from` address, that matches\n // current user's wallet\n await contract.methods.store(0, 'Parameter').send({\n from: addressUser,\n });\n } catch (e) {\n throw new Error(e);\n }\n \n // calling read method\n try {\n // this method can return data\n const result = await contract.methods.retrieve().call();\n } catch (e) {\n throw new Error(e);\n }\n}\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"nodejs-and-react-native-example"},"children":[{"type":"text","value":"Node.js and React Native example"}]},{"type":"element","tag":"code","props":{"code":"// see example below\nimport { getContract } from '.';\n\n// ABI контракта\nconst CONTRACT_ABI = { /* ... */ };\n// contract address\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n// getting contract\nconst contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n// account's private key\nconst privateKey = '...';\n\n// write-methods requires private key\nconst executeContractMethod = async (val: number) => {\n const transaction = contract.methods.store(val);\n const account = web3.eth.accounts.privateKeyToAccount(privateKey);\n const options = {\n to: CONTRACT_ADDRESS,\n data: transaction.encodeABI(),\n gas: await transaction.estimateGas({ from: account.address }),\n gasPrice: await web3.eth.getGasPrice(),\n };\n const signed = await web3.eth.accounts.signTransaction(\n options,\n privateKey,\n );\n await web3.eth.sendSignedTransaction(signed.rawTransaction!);\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// see example below\nimport { getContract } from '.';\n\n// ABI контракта\nconst CONTRACT_ABI = { /* ... */ };\n// contract address\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n// getting contract\nconst contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n// account's private key\nconst privateKey = '...';\n\n// write-methods requires private key\nconst executeContractMethod = async (val: number) => {\n const transaction = contract.methods.store(val);\n const account = web3.eth.accounts.privateKeyToAccount(privateKey);\n const options = {\n to: CONTRACT_ADDRESS,\n data: transaction.encodeABI(),\n gas: await transaction.estimateGas({ from: account.address }),\n gasPrice: await web3.eth.getGasPrice(),\n };\n const signed = await web3.eth.accounts.signTransaction(\n options,\n privateKey,\n );\n await web3.eth.sendSignedTransaction(signed.rawTransaction!);\n};\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"calling-a-batch-of-contracts-methods"},"children":[{"type":"text","value":"Calling a batch of contract's methods"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Function calls batch of requests, returning array of results. For example:"}]},{"type":"element","tag":"code","props":{"code":" const requests = [\n contract.method.balanceOf().call,\n contract.method.getStaked().call\n ]\n\n const result = await makeBatchRequest(request);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" const requests = [\n contract.method.balanceOf().call,\n contract.method.getStaked().call\n ]\n\n const result = await makeBatchRequest(request);\n"}]}]}]},{"type":"element","tag":"code","props":{"code":"const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n\nconst makeBatchRequest = (calls: any[]) => {\n try {\n const web3 = getWeb3NoAccount();\n const batch = new web3.BatchRequest();\n\n const promises = calls.map((call) => {\n return new Promise((resolve, reject) => {\n batch.add(\n call.request({}, (err, result) => {\n if (err) {\n reject(err);\n } else {\n resolve(result);\n }\n })\n );\n });\n });\n\n batch.execute();\n\n return Promise.all(promises);\n } catch {\n return null;\n }\n};\n\nexport default makeBatchRequest;\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n\nconst makeBatchRequest = (calls: any[]) => {\n try {\n const web3 = getWeb3NoAccount();\n const batch = new web3.BatchRequest();\n\n const promises = calls.map((call) => {\n return new Promise((resolve, reject) => {\n batch.add(\n call.request({}, (err, result) => {\n if (err) {\n reject(err);\n } else {\n resolve(result);\n }\n })\n );\n });\n });\n\n batch.execute();\n\n return Promise.all(promises);\n } catch {\n return null;\n }\n};\n\nexport default makeBatchRequest;\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"subscribing-to-smart-contract-events"},"children":[{"type":"text","value":"Subscribing to smart contract events"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There're different ways to subscribe for contract events. For all of them you will need following variables:"}]},{"type":"element","tag":"code","props":{"code":" import Web3 from 'web3';\n const web3 = new Web3('YOUR_RPC_ENDPOINT_HERE');\n const ABI = 'YOUR ABI HERE';\n const CONTRACT_ADDRESS = 'YOUR CONTRACT ADDRESS HERE';\n const myContract = new Web3.Contract(ABI, CONTRACT_ADDRESS);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" import Web3 from 'web3';\n const web3 = new Web3('YOUR_RPC_ENDPOINT_HERE');\n const ABI = 'YOUR ABI HERE';\n const CONTRACT_ADDRESS = 'YOUR CONTRACT ADDRESS HERE';\n const myContract = new Web3.Contract(ABI, CONTRACT_ADDRESS);\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"by-accessing-contractevents"},"children":[{"type":"text","value":"By accessing contract.events"}]},{"type":"element","tag":"code","props":{"code":"referralProgramContract.events\n .RegisterUser()\n .on('connected', (subscriptionId: string) => {\n console.log(`| UserRegistered | events | ${subscriptionId}`);\n })\n .on(\n 'data',\n async (event: {\n removed: boolean;\n returnValues: RegisterUserResponseInterface;\n }) => {\n try {\n if (event.removed) {\n return;\n }\n const { user, referrer } = event.returnValues;\n console.log(user, referrer);\n } catch (e) {\n console.log(`| ONCE | ${e}`);\n }\n },\n )\n .on('error', (error: ErrnoException) => {\n console.log(error);\n });\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"referralProgramContract.events\n .RegisterUser()\n .on('connected', (subscriptionId: string) => {\n console.log(`| UserRegistered | events | ${subscriptionId}`);\n })\n .on(\n 'data',\n async (event: {\n removed: boolean;\n returnValues: RegisterUserResponseInterface;\n }) => {\n try {\n if (event.removed) {\n return;\n }\n const { user, referrer } = event.returnValues;\n console.log(user, referrer);\n } catch (e) {\n console.log(`| ONCE | ${e}`);\n }\n },\n )\n .on('error', (error: ErrnoException) => {\n console.log(error);\n });\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"with-filtering"},"children":[{"type":"text","value":"With filtering"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We're listening to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Transfer"}]},{"type":"text","value":" event here:"}]},{"type":"element","tag":"code","props":{"code":" let options = {\n filter: {\n value: [],\n },\n fromBlock: 0\n };\n\n myContract.events.Transfer(options)\n .on('data', event => console.log(event))\n .on('changed', changed => console.log(changed))\n .on('error', err => throw err)\n .on('connected', str => console.log(str))\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" let options = {\n filter: {\n value: [],\n },\n fromBlock: 0\n };\n\n myContract.events.Transfer(options)\n .on('data', event => console.log(event))\n .on('changed', changed => console.log(changed))\n .on('error', err => throw err)\n .on('connected', str => console.log(str))\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"common-subscribe-method"},"children":[{"type":"text","value":"Common Subscribe method"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Filtering options can also be specified:"}]},{"type":"element","tag":"code","props":{"code":" let options = {\n fromBlock: 0,\n address: ['address-1', 'address-2'], //Only get events from specific addresses\n topics: [] //What topics to subscribe to\n };\n\n let subscription = ('logs', options, (err,event) => {\n if (!err)\n console.log(event)\n });\n\n subscription.on('data', event => console.log(event))\n subscription.on('changed', changed => console.log(changed))\n subscription.on('error', err => { throw err })\n subscription.on('connected', nr => console.log(nr))\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" let options = {\n fromBlock: 0,\n address: ['address-1', 'address-2'], //Only get events from specific addresses\n topics: [] //What topics to subscribe to\n };\n\n let subscription = ('logs', options, (err,event) => {\n if (!err)\n console.log(event)\n });\n\n subscription.on('data', event => console.log(event))\n subscription.on('changed', changed => console.log(changed))\n subscription.on('error', err => { throw err })\n subscription.on('connected', nr => console.log(nr))\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"getting-event-history"},"children":[{"type":"text","value":"Getting event history"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Getting history for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Transfer"}]},{"type":"text","value":" events for specific values. More info can be found "},{"type":"element","tag":"a","props":{"href":"https://web3js.readthedocs.io/en/v1.2.11/web3-eth-subscribe.html#","rel":["nofollow"]},"children":[{"type":"text","value":"here"}]}]},{"type":"element","tag":"code","props":{"code":" //example options(optional)\n let options = {\n filter: {\n // only get events where transfer value was 1000 or 1337\n value: ['1000', '1337'] \n },\n // number | \"earliest\" | \"pending\" | \"latest\"\n fromBlock: 0, \n toBlock: 'latest'\n };\n\n myContract.getPastEvents('Transfer', options)\n .then(results => console.log(results))\n .catch(err => throw err);\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" //example options(optional)\n let options = {\n filter: {\n // only get events where transfer value was 1000 or 1337\n value: ['1000', '1337'] \n },\n // number | \"earliest\" | \"pending\" | \"latest\"\n fromBlock: 0, \n toBlock: 'latest'\n };\n\n myContract.getPastEvents('Transfer', options)\n .then(results => console.log(results))\n .catch(err => throw err);\n\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For common functions see "},{"type":"element","tag":"a","props":{"href":"Common%20typescript%20examples"},"children":[{"type":"text","value":"Common typescript examples"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"getting-smart-contract-instance"},"children":[{"type":"text","value":"Getting smart contract instance"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful for calling smart contract methods:"}]},{"type":"element","tag":"code","props":{"code":"import { Contract } from 'web3-eth-contract';\nimport { web3 } from '.';\n\nconst getContract = (abi: object, address?: string): Contract => {\n const abiFromJson = JSON.parse(JSON.stringify(abi));\n return new web3.eth.Contract(abiFromJson, address);\n};\n\nexport default getContract;\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"Contract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'web3-eth-contract'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bbedd3"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bed189"},"children":[{"type":"text","value":"abi"}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-82c1f9"},"children":[{"type":"text","value":"object"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bed189"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":"?:"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-82c1f9"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d007af"},"children":[{"type":"text","value":"abiFromJson"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c58381"},"children":[{"type":"text","value":"JSON"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d007af"},"children":[{"type":"text","value":"parse"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"Contract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"abiFromJson"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-2e08a5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-2e08a5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"executing-contract-method"},"children":[{"type":"text","value":"Executing contract method"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Contract has "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"read"}]},{"type":"text","value":" and "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"write"}]},{"type":"text","value":" methods. To get a list of methods, you can paste contract address on "},{"type":"element","tag":"a","props":{"href":"https://etherscan.io/token/0xdac17f958d2ee523a2206206994597c13d831ec7#readContract","rel":["nofollow"]},"children":[{"type":"text","value":"https://etherscan.io/ ETH"}]},{"type":"text","value":" or any other service."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Read"}]},{"type":"text","value":" methods doesn't require spending "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"gas"}]},{"type":"text","value":". "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Write"}]},{"type":"text","value":" methods cost some amount of "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"gas"}]},{"type":"text","value":", hence they will be executed with confirmation from user."}]},{"type":"element","tag":"h3","props":{"id":"example-for-metamask-without-private-key"},"children":[{"type":"text","value":"Example for #Metamask without private key"}]},{"type":"element","tag":"code","props":{"code":"// see example below\nimport { getContract } from '.';\n\n// ABI of contract\nconst CONTRACT_ABI = { /* ... */ };\n // address for contract\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n\nexport const executeContractMethod = async ({}) => {\n // getting contract\n const contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n \n // Calling write method\n try {\n // authorizing with Metamask\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n // getting wallet address\n const addressUser = web3.currentProvider.selectedAddress;\n // calling \"store\" store method for contract\n // payload should include `from` address, that matches\n // current user's wallet\n await contract.methods.store(0, 'Parameter').send({\n from: addressUser,\n });\n } catch (e) {\n throw new Error(e);\n }\n \n // calling read method\n try {\n // this method can return data\n const result = await contract.methods.retrieve().call();\n } catch (e) {\n throw new Error(e);\n }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// see example below"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// ABI of contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"/* ... */"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// address for contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'0xdea164f67df4dbfe675d5271c9d404e0260f33bb'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"executeContractMethod"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ({}) "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// getting contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// Calling write method"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// authorizing with Metamask"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"({ method: "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'eth_requestAccounts'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// getting wallet address"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"addressUser"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"currentProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"selectedAddress"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// calling \"store\" store method for contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// payload should include `from` address, that matches"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// current user's wallet"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"methods"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"store"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-2bb2d2"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'Parameter'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"send"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" from: "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"addressUser"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2ef3a"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// calling read method"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// this method can return data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"methods"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"retrieve"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"()."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"call"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2ef3a"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"nodejs-and-react-native-example"},"children":[{"type":"text","value":"Node.js and React Native example"}]},{"type":"element","tag":"code","props":{"code":"// see example below\nimport { getContract } from '.';\n\n// ABI контракта\nconst CONTRACT_ABI = { /* ... */ };\n// contract address\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n// getting contract\nconst contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n// account's private key\nconst privateKey = '...';\n\n// write-methods requires private key\nconst executeContractMethod = async (val: number) => {\n const transaction = contract.methods.store(val);\n const account = web3.eth.accounts.privateKeyToAccount(privateKey);\n const options = {\n to: CONTRACT_ADDRESS,\n data: transaction.encodeABI(),\n gas: await transaction.estimateGas({ from: account.address }),\n gasPrice: await web3.eth.getGasPrice(),\n };\n const signed = await web3.eth.accounts.signTransaction(\n options,\n privateKey,\n );\n await web3.eth.sendSignedTransaction(signed.rawTransaction!);\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// see example below"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'.'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// ABI контракта"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"/* ... */"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// contract address"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'0xdea164f67df4dbfe675d5271c9d404e0260f33bb'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// getting contract"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"getContract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"CONTRACT_ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// account's private key"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'...'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// write-methods requires private key"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bbedd3"},"children":[{"type":"text","value":"executeContractMethod"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bed189"},"children":[{"type":"text","value":"val"}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-82c1f9"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"methods"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"store"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"val"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"account"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"accounts"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"privateKeyToAccount"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" to: "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" data: "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"encodeABI"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"(),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" gas: "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"transaction"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"estimateGas"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"({ from: "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"account"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"address"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" }),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" gasPrice: "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"getGasPrice"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"(),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"signed"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"accounts"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"signTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"privateKey"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"eth"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"sendSignedTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"signed"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"rawTransaction"}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"calling-a-batch-of-contracts-methods"},"children":[{"type":"text","value":"Calling a batch of contract's methods"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Function calls batch of requests, returning array of results. For example:"}]},{"type":"element","tag":"code","props":{"code":" const requests = [\n contract.method.balanceOf().call,\n contract.method.getStaked().call\n ]\n\n const result = await makeBatchRequest(request);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"requests"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"method"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"balanceOf"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"()."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"call"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"contract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"method"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"getStaked"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"()."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"call"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"makeBatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"request"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"code","props":{"code":"const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n\nconst makeBatchRequest = (calls: any[]) => {\n try {\n const web3 = getWeb3NoAccount();\n const batch = new web3.BatchRequest();\n\n const promises = calls.map((call) => {\n return new Promise((resolve, reject) => {\n batch.add(\n call.request({}, (err, result) => {\n if (err) {\n reject(err);\n } else {\n resolve(result);\n }\n })\n );\n });\n });\n\n batch.execute();\n\n return Promise.all(promises);\n } catch {\n return null;\n }\n};\n\nexport default makeBatchRequest;\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"givenProvider"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"PROVIDER_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bbedd3"},"children":[{"type":"text","value":"makeBatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bed189"},"children":[{"type":"text","value":"calls"}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-82c1f9"},"children":[{"type":"text","value":"any"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":"[]) "}]},{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"getWeb3NoAccount"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"batch"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"BatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"promises"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"calls"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"map"}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-82c1f9"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-bed189"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-bed189"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"batch"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"add"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"reject"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"else"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"resolve"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"result"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"batch"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"execute"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2ef3a"},"children":[{"type":"text","value":"Promise"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"all"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"promises"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-391539"},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-2e08a5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-2e08a5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"makeBatchRequest"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"subscribing-to-smart-contract-events"},"children":[{"type":"text","value":"Subscribing to smart contract events"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There're different ways to subscribe for contract events. For all of them you will need following variables:"}]},{"type":"element","tag":"code","props":{"code":" import Web3 from 'web3';\n const web3 = new Web3('YOUR_RPC_ENDPOINT_HERE');\n const ABI = 'YOUR ABI HERE';\n const CONTRACT_ADDRESS = 'YOUR CONTRACT ADDRESS HERE';\n const myContract = new Web3.Contract(ABI, CONTRACT_ADDRESS);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'web3'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'YOUR_RPC_ENDPOINT_HERE'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'YOUR ABI HERE'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'YOUR CONTRACT ADDRESS HERE'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"myContract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"Web3"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"Contract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"ABI"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"CONTRACT_ADDRESS"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"by-accessing-contractevents"},"children":[{"type":"text","value":"By accessing contract.events"}]},{"type":"element","tag":"code","props":{"code":"referralProgramContract.events\n .RegisterUser()\n .on('connected', (subscriptionId: string) => {\n console.log(`| UserRegistered | events | ${subscriptionId}`);\n })\n .on(\n 'data',\n async (event: {\n removed: boolean;\n returnValues: RegisterUserResponseInterface;\n }) => {\n try {\n if (event.removed) {\n return;\n }\n const { user, referrer } = event.returnValues;\n console.log(user, referrer);\n } catch (e) {\n console.log(`| ONCE | ${e}`);\n }\n },\n )\n .on('error', (error: ErrnoException) => {\n console.log(error);\n });\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"referralProgramContract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"events"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"RegisterUser"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"()"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-bbedd3"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5da781"},"children":[{"type":"text","value":"'connected'"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":", ("}]},{"type":"element","tag":"span","props":{"class":"ct-bed189"},"children":[{"type":"text","value":"subscriptionId"}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-82c1f9"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"`| UserRegistered | events | ${"}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"subscriptionId"}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'data'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-bed189"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bed189"},"children":[{"type":"text","value":"removed"}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-82c1f9"},"children":[{"type":"text","value":"boolean"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bed189"},"children":[{"type":"text","value":"returnValues"}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-41d808"},"children":[{"type":"text","value":"RegisterUserResponseInterface"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"removed"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"user"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-9207a0"},"children":[{"type":"text","value":"referrer"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"returnValues"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"user"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"referrer"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"`| ONCE | ${"}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"e"}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"}`"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" )"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-bbedd3"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-5da781"},"children":[{"type":"text","value":"'error'"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":", ("}]},{"type":"element","tag":"span","props":{"class":"ct-bed189"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-f3c518"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-41d808"},"children":[{"type":"text","value":"ErrnoException"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-2690b3"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-177e39"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"error"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" });"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"with-filtering"},"children":[{"type":"text","value":"With filtering"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"We're listening to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Transfer"}]},{"type":"text","value":" event here:"}]},{"type":"element","tag":"code","props":{"code":" let options = {\n filter: {\n value: [],\n },\n fromBlock: 0\n };\n\n myContract.events.Transfer(options)\n .on('data', event => console.log(event))\n .on('changed', changed => console.log(changed))\n .on('error', err => throw err)\n .on('connected', str => console.log(str))\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" filter: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" value: [],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" fromBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-2bb2d2"},"children":[{"type":"text","value":"0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"myContract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"events"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"Transfer"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'data'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'changed'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"changed"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'error'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'connected'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"str"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"))"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"common-subscribe-method"},"children":[{"type":"text","value":"Common Subscribe method"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Filtering options can also be specified:"}]},{"type":"element","tag":"code","props":{"code":" let options = {\n fromBlock: 0,\n address: ['address-1', 'address-2'], //Only get events from specific addresses\n topics: [] //What topics to subscribe to\n };\n\n let subscription = ('logs', options, (err,event) => {\n if (!err)\n console.log(event)\n });\n\n subscription.on('data', event => console.log(event))\n subscription.on('changed', changed => console.log(changed))\n subscription.on('error', err => { throw err })\n subscription.on('connected', nr => console.log(nr))\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" fromBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-2bb2d2"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" address: ["}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'address-1'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'address-2'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"], "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"//Only get events from specific addresses"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" topics: [] "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"//What topics to subscribe to"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'logs'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'data'"}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'changed'"}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"changed"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'error'"}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"err"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"subscription"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"on"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'connected'"}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"console"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"nr"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"))"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"getting-event-history"},"children":[{"type":"text","value":"Getting event history"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Getting history for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Transfer"}]},{"type":"text","value":" events for specific values. More info can be found "},{"type":"element","tag":"a","props":{"href":"https://web3js.readthedocs.io/en/v1.2.11/web3-eth-subscribe.html#","rel":["nofollow"]},"children":[{"type":"text","value":"here"}]}]},{"type":"element","tag":"code","props":{"code":" //example options(optional)\n let options = {\n filter: {\n // only get events where transfer value was 1000 or 1337\n value: ['1000', '1337'] \n },\n // number | \"earliest\" | \"pending\" | \"latest\"\n fromBlock: 0, \n toBlock: 'latest'\n };\n\n myContract.getPastEvents('Transfer', options)\n .then(results => console.log(results))\n .catch(err => throw err);\n\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"//example options(optional)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-890deb"},"children":[{"type":"text","value":"let"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1ef187"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" filter: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// only get events where transfer value was 1000 or 1337"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" value: ["}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'1000'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'1337'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"] "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-295134"},"children":[{"type":"text","value":"// number | \"earliest\" | \"pending\" | \"latest\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" fromBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-2bb2d2"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" toBlock: "}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'latest'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"myContract"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"getPastEvents"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-9c9782"},"children":[{"type":"text","value":"'Transfer'"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"log"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-56249b"},"children":[{"type":"text","value":"results"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" ."}]},{"type":"element","tag":"span","props":{"class":"ct-61346a"},"children":[{"type":"text","value":"catch"}]},{"type":"element","tag":"span","props":{"class":"ct-fc252f"},"children":[{"type":"text","value":" "}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-41d808{color:#FFA657}.ct-5da781{color:#A5D6FF}.ct-391539{color:#79C0FF}.ct-c2ef3a{color:#79C0FF}.ct-2bb2d2{color:#79C0FF}.ct-9207a0{color:#79C0FF}.ct-890deb{color:#FF7B72}.ct-295134{color:#8B949E}.ct-2e08a5{color:#FFA657}.ct-61346a{color:#D2A8FF}.ct-c58381{color:#79C0FF}.ct-d007af{color:#79C0FF}.ct-82c1f9{color:#79C0FF}.ct-bed189{color:#FFA657}.ct-f3c518{color:#FF7B72}.ct-bbedd3{color:#D2A8FF}.ct-177e39{color:#C9D1D9}.ct-2690b3{color:#FF7B72}.ct-9c9782{color:#A5D6FF}.ct-56249b{color:#C9D1D9}.ct-fc252f{color:#C9D1D9}.ct-1ef187{color:#FF7B72}.light .ct-1ef187{color:#859900}.light .ct-fc252f{color:#657B83}.light .ct-56249b{color:#268BD2}.light .ct-9c9782{color:#2AA198}.light .ct-2690b3{color:#073642}.light .ct-177e39{color:#657B83}.light .ct-bbedd3{color:#268BD2}.light .ct-f3c518{color:#859900}.light .ct-bed189{color:#657B83}.light .ct-82c1f9{color:#859900}.light .ct-d007af{color:#268BD2}.light .ct-c58381{color:#657B83}.light .ct-61346a{color:#268BD2}.light .ct-2e08a5{color:#657B83}.light .ct-295134{color:#93A1A1}.light .ct-890deb{color:#073642}.light .ct-9207a0{color:#268BD2}.light .ct-2bb2d2{color:#D33682}.light .ct-c2ef3a{color:#859900}.light .ct-391539{color:#B58900}.light .ct-5da781{color:#2AA198}.light .ct-41d808{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"getting-smart-contract-instance","depth":2,"text":"Getting smart contract instance"},{"id":"executing-contract-method","depth":2,"text":"Executing contract method","children":[{"id":"example-for-metamask-without-private-key","depth":3,"text":"Example for #Metamask without private key"},{"id":"nodejs-and-react-native-example","depth":3,"text":"Node.js and React Native example"},{"id":"calling-a-batch-of-contracts-methods","depth":3,"text":"Calling a batch of contract's methods"}]},{"id":"subscribing-to-smart-contract-events","depth":2,"text":"Subscribing to smart contract events","children":[{"id":"by-accessing-contractevents","depth":3,"text":"By accessing contract.events"},{"id":"with-filtering","depth":3,"text":"With filtering"},{"id":"common-subscribe-method","depth":3,"text":"Common Subscribe method"},{"id":"getting-event-history","depth":3,"text":"Getting event history"}]}]}},"_type":"markdown","_id":"content:Blockchain:Smart contracts.md","_source":"content","_file":"Blockchain/Smart contracts.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/WUiUHbO5Pg.json b/docs/api/_content/query/WUiUHbO5Pg.json index bc29843..dfd3883 100644 --- a/docs/api/_content/query/WUiUHbO5Pg.json +++ b/docs/api/_content/query/WUiUHbO5Pg.json @@ -1 +1 @@ -{"_path":"/css/test-if-browser-supports-css-rules","_dir":"css","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Test If Browser Supports CSS Rules","description":"To test if browser supports some #CSS rules, do following:","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To test if browser supports some #CSS rules, do following:"}]},{"type":"element","tag":"code","props":{"code":"@supports (backdrop-filter: blur(5px)) {\n backdrop-filter: blur(5px);\n}\n","language":"css"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"@supports (backdrop-filter: blur(5px)) {\n backdrop-filter: blur(5px);\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"@mixin"}]},{"type":"text","value":" will only apply rule if browser support backdrop filtering:"}]},{"type":"element","tag":"code","props":{"code":"@mixin can_backdrop {\n @supports (\n (-webkit-backdrop-filter: blur(5px)) or \n (backdrop-filter: blur(5px))\n ) {\n @content;\n }\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"@mixin can_backdrop {\n @supports (\n (-webkit-backdrop-filter: blur(5px)) or \n (backdrop-filter: blur(5px))\n ) {\n @content;\n }\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To test if browser supports some #CSS rules, do following:"}]},{"type":"element","tag":"code","props":{"code":"@supports (backdrop-filter: blur(5px)) {\n backdrop-filter: blur(5px);\n}\n","language":"css"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a0ae9b"},"children":[{"type":"text","value":"@supports"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-112c18"},"children":[{"type":"text","value":"backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-226639"},"children":[{"type":"text","value":"blur"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-899a6f"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-a0ae9b"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-509371"},"children":[{"type":"text","value":"backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":": blur(5px);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"@mixin"}]},{"type":"text","value":" will only apply rule if browser support backdrop filtering:"}]},{"type":"element","tag":"code","props":{"code":"@mixin can_backdrop {\n @supports (\n (-webkit-backdrop-filter: blur(5px)) or \n (backdrop-filter: blur(5px))\n ) {\n @content;\n }\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a0ae9b"},"children":[{"type":"text","value":"@mixin"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0500fd"},"children":[{"type":"text","value":"can_backdrop"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a0ae9b"},"children":[{"type":"text","value":"@supports"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8b2965"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-6c59f3"},"children":[{"type":"text","value":"-webkit-backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-8b2965"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-8e2b82"},"children":[{"type":"text","value":"blur"}]},{"type":"element","tag":"span","props":{"class":"ct-8b2965"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ad4b38"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-7461e6"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-8b2965"},"children":[{"type":"text","value":")) "}]},{"type":"element","tag":"span","props":{"class":"ct-1c5c15"},"children":[{"type":"text","value":"or"}]},{"type":"element","tag":"span","props":{"class":"ct-8b2965"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-112c18"},"children":[{"type":"text","value":"backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-226639"},"children":[{"type":"text","value":"blur"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-899a6f"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-a0ae9b"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a0ae9b"},"children":[{"type":"text","value":"@content"}]},{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c4faf2"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-1c5c15{color:#79C0FF}.ct-7461e6{color:#FF7B72}.ct-ad4b38{color:#79C0FF}.ct-8e2b82{color:#79C0FF}.ct-6c59f3{color:#79C0FF}.ct-8b2965{color:#C9D1D9}.ct-0500fd{color:#D2A8FF}.ct-509371{color:#7EE787}.ct-899a6f{color:#79C0FF}.ct-226639{color:#79C0FF}.ct-112c18{color:#79C0FF}.ct-c4faf2{color:#C9D1D9}.ct-a0ae9b{color:#FF7B72}.light .ct-a0ae9b{color:#859900}.light .ct-c4faf2{color:#657B83}.light .ct-112c18{color:#859900}.light .ct-226639{color:#268BD2}.light .ct-899a6f{color:#D33682}.light .ct-509371{color:#268BD2}.light .ct-0500fd{color:#268BD2}.light .ct-8b2965{color:#657B83}.light .ct-6c59f3{color:#859900}.light .ct-8e2b82{color:#268BD2}.light .ct-ad4b38{color:#D33682}.light .ct-7461e6{color:#859900}.light .ct-1c5c15{color:#657B83}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:CSS:Test if browser supports CSS rules.md","_source":"content","_file":"CSS/Test if browser supports CSS rules.md","_extension":"md"} \ No newline at end of file +{"_path":"/css/test-if-browser-supports-css-rules","_dir":"css","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Test If Browser Supports CSS Rules","description":"To test if browser supports some #CSS rules, do following:","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To test if browser supports some #CSS rules, do following:"}]},{"type":"element","tag":"code","props":{"code":"@supports (backdrop-filter: blur(5px)) {\n backdrop-filter: blur(5px);\n}\n","language":"css"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"@supports (backdrop-filter: blur(5px)) {\n backdrop-filter: blur(5px);\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"@mixin"}]},{"type":"text","value":" will only apply rule if browser support backdrop filtering:"}]},{"type":"element","tag":"code","props":{"code":"@mixin can_backdrop {\n @supports (\n (-webkit-backdrop-filter: blur(5px)) or \n (backdrop-filter: blur(5px))\n ) {\n @content;\n }\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"@mixin can_backdrop {\n @supports (\n (-webkit-backdrop-filter: blur(5px)) or \n (backdrop-filter: blur(5px))\n ) {\n @content;\n }\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To test if browser supports some #CSS rules, do following:"}]},{"type":"element","tag":"code","props":{"code":"@supports (backdrop-filter: blur(5px)) {\n backdrop-filter: blur(5px);\n}\n","language":"css"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-45aa1d"},"children":[{"type":"text","value":"@supports"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-86d011"},"children":[{"type":"text","value":"backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-4cf4bf"},"children":[{"type":"text","value":"blur"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-0a3d5b"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-45aa1d"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ee1d29"},"children":[{"type":"text","value":"backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":": blur(5px);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"@mixin"}]},{"type":"text","value":" will only apply rule if browser support backdrop filtering:"}]},{"type":"element","tag":"code","props":{"code":"@mixin can_backdrop {\n @supports (\n (-webkit-backdrop-filter: blur(5px)) or \n (backdrop-filter: blur(5px))\n ) {\n @content;\n }\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-45aa1d"},"children":[{"type":"text","value":"@mixin"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6fdca5"},"children":[{"type":"text","value":"can_backdrop"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-45aa1d"},"children":[{"type":"text","value":"@supports"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b96a7c"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-fd3bac"},"children":[{"type":"text","value":"-webkit-backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-b96a7c"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-e2d865"},"children":[{"type":"text","value":"blur"}]},{"type":"element","tag":"span","props":{"class":"ct-b96a7c"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d53fb7"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-1caf5e"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-b96a7c"},"children":[{"type":"text","value":")) "}]},{"type":"element","tag":"span","props":{"class":"ct-b98b1b"},"children":[{"type":"text","value":"or"}]},{"type":"element","tag":"span","props":{"class":"ct-b96a7c"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-86d011"},"children":[{"type":"text","value":"backdrop-filter"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-4cf4bf"},"children":[{"type":"text","value":"blur"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-0a3d5b"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-45aa1d"},"children":[{"type":"text","value":"px"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":" ) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-45aa1d"},"children":[{"type":"text","value":"@content"}]},{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-786564"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-b98b1b{color:#79C0FF}.ct-1caf5e{color:#FF7B72}.ct-d53fb7{color:#79C0FF}.ct-e2d865{color:#79C0FF}.ct-fd3bac{color:#79C0FF}.ct-b96a7c{color:#C9D1D9}.ct-6fdca5{color:#D2A8FF}.ct-ee1d29{color:#7EE787}.ct-0a3d5b{color:#79C0FF}.ct-4cf4bf{color:#79C0FF}.ct-86d011{color:#79C0FF}.ct-786564{color:#C9D1D9}.ct-45aa1d{color:#FF7B72}.light .ct-45aa1d{color:#859900}.light .ct-786564{color:#657B83}.light .ct-86d011{color:#859900}.light .ct-4cf4bf{color:#268BD2}.light .ct-0a3d5b{color:#D33682}.light .ct-ee1d29{color:#268BD2}.light .ct-6fdca5{color:#268BD2}.light .ct-b96a7c{color:#657B83}.light .ct-fd3bac{color:#859900}.light .ct-e2d865{color:#268BD2}.light .ct-d53fb7{color:#D33682}.light .ct-1caf5e{color:#859900}.light .ct-b98b1b{color:#657B83}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:CSS:Test if browser supports CSS rules.md","_source":"content","_file":"CSS/Test if browser supports CSS rules.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/XgydJZDPap.json b/docs/api/_content/query/XgydJZDPap.json index 3042b45..96c66a1 100644 --- a/docs/api/_content/query/XgydJZDPap.json +++ b/docs/api/_content/query/XgydJZDPap.json @@ -1 +1 @@ -{"_path":"/linux/fixing-lagging-usb-headphones","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Fixing Lagging USB Headphones","description":"When receiving messages like this:","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"When receiving messages like this:"}]},{"type":"element","tag":"code","props":{"code":"Bluetooth: hci0: ACL packet for unknown connection handle 256\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"Bluetooth: hci0: ACL packet for unknown connection handle 256\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/modprobe.d/disable_btusb_autosuspend.conf"}]},{"type":"text","value":" with following content:"}]},{"type":"element","tag":"code","props":{"code":"# Disable autosuspend for btusb to make the bluetooth keyboard work again\noptions btusb enable_autosuspend=n\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"# Disable autosuspend for btusb to make the bluetooth keyboard work again\noptions btusb enable_autosuspend=n\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run"}]},{"type":"element","tag":"code","props":{"code":"mkinitcpio -P\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"mkinitcpio -P\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Reboot and debug with"}]},{"type":"element","tag":"code","props":{"code":"$ systool -v -m btusb | grep autosuspend\n enable_autosuspend = \"N\" # should be \"N\"\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"$ systool -v -m btusb | grep autosuspend\n enable_autosuspend = \"N\" # should be \"N\"\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"also"},"children":[{"type":"text","value":"Also"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"That could be either "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"btusb.enable_autosuspend=n"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"usbcore.autosuspend=-1"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"TLP has settings for BTUSB, check it to exclude your device from autosuspend"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"There's a guy on ubuntuforums, who wrote "},{"type":"element","tag":"a","props":{"href":"https://ubuntuforums.org/showthread.php?t=2159645&page=6&p=12926730#post12926730","rel":["nofollow"]},"children":[{"type":"text","value":"solution"}]},{"type":"text","value":", which disables autosuspend manually"}]}]},{"type":"element","tag":"h2","props":{"id":"refs"},"children":[{"type":"text","value":"Refs"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://bbs.archlinux.org/viewtopic.php?id=236479","rel":["nofollow"]},"children":[{"type":"text","value":"Bluetooth keyboard disconnects randomly"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://bbs.archlinux.org/viewtopic.php?id=275962","rel":["nofollow"]},"children":[{"type":"text","value":"Bluetooth keeps turning off"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://wiki.archlinux.org/title/Bluetooth#Device_connects,_then_disconnects_after_a_few_moments","rel":["nofollow"]},"children":[{"type":"text","value":"ArchWiki: Device connects, then disconnects after a few moments"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://ubuntuforums.org/showthread.php?t=2159645&page=6&p=12926730#post12926730","rel":["nofollow"]},"children":[{"type":"text","value":"Said solution with a script in rc.local"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"When receiving messages like this:"}]},{"type":"element","tag":"code","props":{"code":"Bluetooth: hci0: ACL packet for unknown connection handle 256\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5e4a7"},"children":[{"type":"text","value":"Bluetooth: hci0: ACL packet "}]},{"type":"element","tag":"span","props":{"class":"ct-107814"},"children":[{"type":"text","value":"for"}]},{"type":"element","tag":"span","props":{"class":"ct-b5e4a7"},"children":[{"type":"text","value":" unknown connection handle 256"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/modprobe.d/disable_btusb_autosuspend.conf"}]},{"type":"text","value":" with following content:"}]},{"type":"element","tag":"code","props":{"code":"# Disable autosuspend for btusb to make the bluetooth keyboard work again\noptions btusb enable_autosuspend=n\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-08f1b7"},"children":[{"type":"text","value":"# Disable autosuspend for btusb to make the bluetooth keyboard work again"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5e4a7"},"children":[{"type":"text","value":"options btusb enable_autosuspend=n"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run"}]},{"type":"element","tag":"code","props":{"code":"mkinitcpio -P\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5e4a7"},"children":[{"type":"text","value":"mkinitcpio -P"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Reboot and debug with"}]},{"type":"element","tag":"code","props":{"code":"$ systool -v -m btusb | grep autosuspend\n enable_autosuspend = \"N\" # should be \"N\"\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5e4a7"},"children":[{"type":"text","value":"$ systool -v -m btusb "}]},{"type":"element","tag":"span","props":{"class":"ct-107814"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-b5e4a7"},"children":[{"type":"text","value":" grep autosuspend"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b5e4a7"},"children":[{"type":"text","value":" enable_autosuspend = "}]},{"type":"element","tag":"span","props":{"class":"ct-be00c3"},"children":[{"type":"text","value":"\"N\""}]},{"type":"element","tag":"span","props":{"class":"ct-b5e4a7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-08f1b7"},"children":[{"type":"text","value":"# should be \"N\""}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"also"},"children":[{"type":"text","value":"Also"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"That could be either "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"btusb.enable_autosuspend=n"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"usbcore.autosuspend=-1"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"TLP has settings for BTUSB, check it to exclude your device from autosuspend"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"There's a guy on ubuntuforums, who wrote "},{"type":"element","tag":"a","props":{"href":"https://ubuntuforums.org/showthread.php?t=2159645&page=6&p=12926730#post12926730","rel":["nofollow"]},"children":[{"type":"text","value":"solution"}]},{"type":"text","value":", which disables autosuspend manually"}]}]},{"type":"element","tag":"h2","props":{"id":"refs"},"children":[{"type":"text","value":"Refs"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://bbs.archlinux.org/viewtopic.php?id=236479","rel":["nofollow"]},"children":[{"type":"text","value":"Bluetooth keyboard disconnects randomly"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://bbs.archlinux.org/viewtopic.php?id=275962","rel":["nofollow"]},"children":[{"type":"text","value":"Bluetooth keeps turning off"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://wiki.archlinux.org/title/Bluetooth#Device_connects,_then_disconnects_after_a_few_moments","rel":["nofollow"]},"children":[{"type":"text","value":"ArchWiki: Device connects, then disconnects after a few moments"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://ubuntuforums.org/showthread.php?t=2159645&page=6&p=12926730#post12926730","rel":["nofollow"]},"children":[{"type":"text","value":"Said solution with a script in rc.local"}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-be00c3{color:#A5D6FF}.ct-08f1b7{color:#8B949E}.ct-107814{color:#FF7B72}.ct-b5e4a7{color:#C9D1D9}.light .ct-b5e4a7{color:#657B83}.light .ct-107814{color:#859900}.light .ct-08f1b7{color:#93A1A1}.light .ct-be00c3{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"also","depth":2,"text":"Also"},{"id":"refs","depth":2,"text":"Refs"}]}},"_type":"markdown","_id":"content:Linux:Fixing lagging USB Headphones.md","_source":"content","_file":"Linux/Fixing lagging USB Headphones.md","_extension":"md"} \ No newline at end of file +{"_path":"/linux/fixing-lagging-usb-headphones","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Fixing Lagging USB Headphones","description":"When receiving messages like this:","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"When receiving messages like this:"}]},{"type":"element","tag":"code","props":{"code":"Bluetooth: hci0: ACL packet for unknown connection handle 256\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"Bluetooth: hci0: ACL packet for unknown connection handle 256\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/modprobe.d/disable_btusb_autosuspend.conf"}]},{"type":"text","value":" with following content:"}]},{"type":"element","tag":"code","props":{"code":"# Disable autosuspend for btusb to make the bluetooth keyboard work again\noptions btusb enable_autosuspend=n\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"# Disable autosuspend for btusb to make the bluetooth keyboard work again\noptions btusb enable_autosuspend=n\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run"}]},{"type":"element","tag":"code","props":{"code":"mkinitcpio -P\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"mkinitcpio -P\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Reboot and debug with"}]},{"type":"element","tag":"code","props":{"code":"$ systool -v -m btusb | grep autosuspend\n enable_autosuspend = \"N\" # should be \"N\"\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"$ systool -v -m btusb | grep autosuspend\n enable_autosuspend = \"N\" # should be \"N\"\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"also"},"children":[{"type":"text","value":"Also"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"That could be either "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"btusb.enable_autosuspend=n"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"usbcore.autosuspend=-1"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"TLP has settings for BTUSB, check it to exclude your device from autosuspend"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"There's a guy on ubuntuforums, who wrote "},{"type":"element","tag":"a","props":{"href":"https://ubuntuforums.org/showthread.php?t=2159645&page=6&p=12926730#post12926730","rel":["nofollow"]},"children":[{"type":"text","value":"solution"}]},{"type":"text","value":", which disables autosuspend manually"}]}]},{"type":"element","tag":"h2","props":{"id":"refs"},"children":[{"type":"text","value":"Refs"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://bbs.archlinux.org/viewtopic.php?id=236479","rel":["nofollow"]},"children":[{"type":"text","value":"Bluetooth keyboard disconnects randomly"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://bbs.archlinux.org/viewtopic.php?id=275962","rel":["nofollow"]},"children":[{"type":"text","value":"Bluetooth keeps turning off"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://wiki.archlinux.org/title/Bluetooth#Device_connects,_then_disconnects_after_a_few_moments","rel":["nofollow"]},"children":[{"type":"text","value":"ArchWiki: Device connects, then disconnects after a few moments"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://ubuntuforums.org/showthread.php?t=2159645&page=6&p=12926730#post12926730","rel":["nofollow"]},"children":[{"type":"text","value":"Said solution with a script in rc.local"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"When receiving messages like this:"}]},{"type":"element","tag":"code","props":{"code":"Bluetooth: hci0: ACL packet for unknown connection handle 256\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c92475"},"children":[{"type":"text","value":"Bluetooth: hci0: ACL packet "}]},{"type":"element","tag":"span","props":{"class":"ct-3fc0e0"},"children":[{"type":"text","value":"for"}]},{"type":"element","tag":"span","props":{"class":"ct-c92475"},"children":[{"type":"text","value":" unknown connection handle 256"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/modprobe.d/disable_btusb_autosuspend.conf"}]},{"type":"text","value":" with following content:"}]},{"type":"element","tag":"code","props":{"code":"# Disable autosuspend for btusb to make the bluetooth keyboard work again\noptions btusb enable_autosuspend=n\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b1f60c"},"children":[{"type":"text","value":"# Disable autosuspend for btusb to make the bluetooth keyboard work again"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c92475"},"children":[{"type":"text","value":"options btusb enable_autosuspend=n"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run"}]},{"type":"element","tag":"code","props":{"code":"mkinitcpio -P\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c92475"},"children":[{"type":"text","value":"mkinitcpio -P"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Reboot and debug with"}]},{"type":"element","tag":"code","props":{"code":"$ systool -v -m btusb | grep autosuspend\n enable_autosuspend = \"N\" # should be \"N\"\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c92475"},"children":[{"type":"text","value":"$ systool -v -m btusb "}]},{"type":"element","tag":"span","props":{"class":"ct-3fc0e0"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-c92475"},"children":[{"type":"text","value":" grep autosuspend"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c92475"},"children":[{"type":"text","value":" enable_autosuspend = "}]},{"type":"element","tag":"span","props":{"class":"ct-3e1943"},"children":[{"type":"text","value":"\"N\""}]},{"type":"element","tag":"span","props":{"class":"ct-c92475"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b1f60c"},"children":[{"type":"text","value":"# should be \"N\""}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"also"},"children":[{"type":"text","value":"Also"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"That could be either "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"btusb.enable_autosuspend=n"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"usbcore.autosuspend=-1"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"TLP has settings for BTUSB, check it to exclude your device from autosuspend"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"There's a guy on ubuntuforums, who wrote "},{"type":"element","tag":"a","props":{"href":"https://ubuntuforums.org/showthread.php?t=2159645&page=6&p=12926730#post12926730","rel":["nofollow"]},"children":[{"type":"text","value":"solution"}]},{"type":"text","value":", which disables autosuspend manually"}]}]},{"type":"element","tag":"h2","props":{"id":"refs"},"children":[{"type":"text","value":"Refs"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://bbs.archlinux.org/viewtopic.php?id=236479","rel":["nofollow"]},"children":[{"type":"text","value":"Bluetooth keyboard disconnects randomly"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://bbs.archlinux.org/viewtopic.php?id=275962","rel":["nofollow"]},"children":[{"type":"text","value":"Bluetooth keeps turning off"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://wiki.archlinux.org/title/Bluetooth#Device_connects,_then_disconnects_after_a_few_moments","rel":["nofollow"]},"children":[{"type":"text","value":"ArchWiki: Device connects, then disconnects after a few moments"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://ubuntuforums.org/showthread.php?t=2159645&page=6&p=12926730#post12926730","rel":["nofollow"]},"children":[{"type":"text","value":"Said solution with a script in rc.local"}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-3e1943{color:#A5D6FF}.ct-b1f60c{color:#8B949E}.ct-3fc0e0{color:#FF7B72}.ct-c92475{color:#C9D1D9}.light .ct-c92475{color:#657B83}.light .ct-3fc0e0{color:#859900}.light .ct-b1f60c{color:#93A1A1}.light .ct-3e1943{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"also","depth":2,"text":"Also"},{"id":"refs","depth":2,"text":"Refs"}]}},"_type":"markdown","_id":"content:Linux:Fixing lagging USB Headphones.md","_source":"content","_file":"Linux/Fixing lagging USB Headphones.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/a1s3E9iAyd.json b/docs/api/_content/query/a1s3E9iAyd.json index 004ba2b..2b41f5e 100644 --- a/docs/api/_content/query/a1s3E9iAyd.json +++ b/docs/api/_content/query/a1s3E9iAyd.json @@ -1 +1 @@ -{"_path":"/docker/wait-for-mysql","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Wait For Mysql","description":"wait-for-it.sh doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before #mysql is ready to accept connections","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vishnubob/wait-for-it","rel":["nofollow"]},"children":[{"type":"text","value":"wait-for-it.sh"}]},{"type":"text","value":" doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before #mysql is ready to accept connections"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This script waits for first successful query from database or exits with non-zero status after timeout."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$query"}]},{"type":"text","value":" for the actually working one."}]},{"type":"element","tag":"code","props":{"code":"# Waits for mysql to become actually available\nwait_for_mysql() {\n query=\"SELECT count(*) FROM users\"\n \n timeout=180 # 3 minutes limit\n i=0\n \n while ! docker exec -it \"$1\" mysql --user=\"$2\" --password=\"$3\" -e \"$query\" $4 >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly query MySQL after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_mysql miin-mysql-dev root password database\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"# Waits for mysql to become actually available\nwait_for_mysql() {\n query=\"SELECT count(*) FROM users\"\n \n timeout=180 # 3 minutes limit\n i=0\n \n while ! docker exec -it \"$1\" mysql --user=\"$2\" --password=\"$3\" -e \"$query\" $4 >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly query MySQL after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_mysql miin-mysql-dev root password database\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Wait%20for%20redis"},"children":[{"type":"text","value":"Wait for redis"}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vishnubob/wait-for-it","rel":["nofollow"]},"children":[{"type":"text","value":"wait-for-it.sh"}]},{"type":"text","value":" doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before #mysql is ready to accept connections"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This script waits for first successful query from database or exits with non-zero status after timeout."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$query"}]},{"type":"text","value":" for the actually working one."}]},{"type":"element","tag":"code","props":{"code":"# Waits for mysql to become actually available\nwait_for_mysql() {\n query=\"SELECT count(*) FROM users\"\n \n timeout=180 # 3 minutes limit\n i=0\n \n while ! docker exec -it \"$1\" mysql --user=\"$2\" --password=\"$3\" -e \"$query\" $4 >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly query MySQL after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_mysql miin-mysql-dev root password database\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ee899c"},"children":[{"type":"text","value":"# Waits for mysql to become actually available"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fcae9b"},"children":[{"type":"text","value":"wait_for_mysql"}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":"() {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" query="}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":"\"SELECT count(*) FROM users\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" timeout=180 "}]},{"type":"element","tag":"span","props":{"class":"ct-ee899c"},"children":[{"type":"text","value":"# 3 minutes limit"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" i=0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":"while"}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" docker "}]},{"type":"element","tag":"span","props":{"class":"ct-5b78c6"},"children":[{"type":"text","value":"exec"}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" -it "}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-f2f437"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-32fef5"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" mysql --user="}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-f2f437"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-32fef5"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" -e "}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-f2f437"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-32fef5"},"children":[{"type":"text","value":"query"}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":"do"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" sleep 1"}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" i="}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":"$(("}]},{"type":"element","tag":"span","props":{"class":"ct-f2f437"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-32fef5"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-2c5bcb"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" [[ "}]},{"type":"element","tag":"span","props":{"class":"ct-f2f437"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-32fef5"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-f2f437"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":"-ge"}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f2f437"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-32fef5"},"children":[{"type":"text","value":"timeout"}]},{"type":"element","tag":"span","props":{"class":"ct-f2f437"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" ]]"}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":";"}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":"then"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5b78c6"},"children":[{"type":"text","value":"echo"}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":"\"[Error] can't properly query MySQL after "}]},{"type":"element","tag":"span","props":{"class":"ct-f2f437"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-32fef5"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-f2f437"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-30990b"},"children":[{"type":"text","value":" secs\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5b78c6"},"children":[{"type":"text","value":"exit"}]},{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" 1"}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":"fi"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-09cbe0"},"children":[{"type":"text","value":"done"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-088cdc"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ee899c"},"children":[{"type":"text","value":"# usage: wait_for_mysql miin-mysql-dev root password database"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Wait%20for%20redis"},"children":[{"type":"text","value":"Wait for redis"}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-2c5bcb{color:#79C0FF}.ct-32fef5{color:#C9D1D9}.ct-f2f437{color:#C9D1D9}.ct-5b78c6{color:#79C0FF}.ct-09cbe0{color:#FF7B72}.ct-30990b{color:#A5D6FF}.ct-088cdc{color:#C9D1D9}.ct-fcae9b{color:#D2A8FF}.ct-ee899c{color:#8B949E}.light .ct-ee899c{color:#93A1A1}.light .ct-fcae9b{color:#268BD2}.light .ct-088cdc{color:#657B83}.light .ct-30990b{color:#2AA198}.light .ct-09cbe0{color:#859900}.light .ct-5b78c6{color:#268BD2}.light .ct-f2f437{color:#859900}.light .ct-32fef5{color:#268BD2}.light .ct-2c5bcb{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Docker:Wait for mysql.md","_source":"content","_file":"Docker/Wait for mysql.md","_extension":"md"} \ No newline at end of file +{"_path":"/docker/wait-for-mysql","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Wait For Mysql","description":"wait-for-it.sh doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before #mysql is ready to accept connections","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vishnubob/wait-for-it","rel":["nofollow"]},"children":[{"type":"text","value":"wait-for-it.sh"}]},{"type":"text","value":" doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before #mysql is ready to accept connections"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This script waits for first successful query from database or exits with non-zero status after timeout."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$query"}]},{"type":"text","value":" for the actually working one."}]},{"type":"element","tag":"code","props":{"code":"# Waits for mysql to become actually available\nwait_for_mysql() {\n query=\"SELECT count(*) FROM users\"\n \n timeout=180 # 3 minutes limit\n i=0\n \n while ! docker exec -it \"$1\" mysql --user=\"$2\" --password=\"$3\" -e \"$query\" $4 >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly query MySQL after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_mysql miin-mysql-dev root password database\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"# Waits for mysql to become actually available\nwait_for_mysql() {\n query=\"SELECT count(*) FROM users\"\n \n timeout=180 # 3 minutes limit\n i=0\n \n while ! docker exec -it \"$1\" mysql --user=\"$2\" --password=\"$3\" -e \"$query\" $4 >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly query MySQL after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_mysql miin-mysql-dev root password database\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Wait%20for%20redis"},"children":[{"type":"text","value":"Wait for redis"}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/vishnubob/wait-for-it","rel":["nofollow"]},"children":[{"type":"text","value":"wait-for-it.sh"}]},{"type":"text","value":" doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before #mysql is ready to accept connections"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This script waits for first successful query from database or exits with non-zero status after timeout."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$query"}]},{"type":"text","value":" for the actually working one."}]},{"type":"element","tag":"code","props":{"code":"# Waits for mysql to become actually available\nwait_for_mysql() {\n query=\"SELECT count(*) FROM users\"\n \n timeout=180 # 3 minutes limit\n i=0\n \n while ! docker exec -it \"$1\" mysql --user=\"$2\" --password=\"$3\" -e \"$query\" $4 >/dev/null 2>&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly query MySQL after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_mysql miin-mysql-dev root password database\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b14eb"},"children":[{"type":"text","value":"# Waits for mysql to become actually available"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-46a328"},"children":[{"type":"text","value":"wait_for_mysql"}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":"() {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" query="}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":"\"SELECT count(*) FROM users\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" timeout=180 "}]},{"type":"element","tag":"span","props":{"class":"ct-5b14eb"},"children":[{"type":"text","value":"# 3 minutes limit"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" i=0"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":"while"}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" docker "}]},{"type":"element","tag":"span","props":{"class":"ct-174785"},"children":[{"type":"text","value":"exec"}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" -it "}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-7edd79"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-b5713d"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" mysql --user="}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-7edd79"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-b5713d"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" -e "}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-7edd79"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-b5713d"},"children":[{"type":"text","value":"query"}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":"do"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" sleep 1"}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" i="}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":"$(("}]},{"type":"element","tag":"span","props":{"class":"ct-7edd79"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-b5713d"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-ad6a7c"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":"))"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" [[ "}]},{"type":"element","tag":"span","props":{"class":"ct-7edd79"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-b5713d"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-7edd79"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":"-ge"}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7edd79"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-b5713d"},"children":[{"type":"text","value":"timeout"}]},{"type":"element","tag":"span","props":{"class":"ct-7edd79"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" ]]"}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":";"}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":"then"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-174785"},"children":[{"type":"text","value":"echo"}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":"\"[Error] can't properly query MySQL after "}]},{"type":"element","tag":"span","props":{"class":"ct-7edd79"},"children":[{"type":"text","value":"${"}]},{"type":"element","tag":"span","props":{"class":"ct-b5713d"},"children":[{"type":"text","value":"i"}]},{"type":"element","tag":"span","props":{"class":"ct-7edd79"},"children":[{"type":"text","value":"}"}]},{"type":"element","tag":"span","props":{"class":"ct-4afbe3"},"children":[{"type":"text","value":" secs\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-174785"},"children":[{"type":"text","value":"exit"}]},{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" 1"}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":"fi"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bb4b9c"},"children":[{"type":"text","value":"done"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ec2995"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b14eb"},"children":[{"type":"text","value":"# usage: wait_for_mysql miin-mysql-dev root password database"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"Wait%20for%20redis"},"children":[{"type":"text","value":"Wait for redis"}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-ad6a7c{color:#79C0FF}.ct-b5713d{color:#C9D1D9}.ct-7edd79{color:#C9D1D9}.ct-174785{color:#79C0FF}.ct-bb4b9c{color:#FF7B72}.ct-4afbe3{color:#A5D6FF}.ct-ec2995{color:#C9D1D9}.ct-46a328{color:#D2A8FF}.ct-5b14eb{color:#8B949E}.light .ct-5b14eb{color:#93A1A1}.light .ct-46a328{color:#268BD2}.light .ct-ec2995{color:#657B83}.light .ct-4afbe3{color:#2AA198}.light .ct-bb4b9c{color:#859900}.light .ct-174785{color:#268BD2}.light .ct-7edd79{color:#859900}.light .ct-b5713d{color:#268BD2}.light .ct-ad6a7c{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Docker:Wait for mysql.md","_source":"content","_file":"Docker/Wait for mysql.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/aP6pCxBj14.json b/docs/api/_content/query/aP6pCxBj14.json index 5213270..09eef3a 100644 --- a/docs/api/_content/query/aP6pCxBj14.json +++ b/docs/api/_content/query/aP6pCxBj14.json @@ -1 +1 @@ -{"_path":"/linux/resume-or-start-screen-session","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Resume Or Start Screen Session","description":"Running this script will enter currently running screen session or will start new one.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Running this script will enter currently running "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"screen"}]},{"type":"text","value":" session or will start new one."}]},{"type":"element","tag":"code","props":{"code":"( screen -r bash || ( screen -d bash && screen -r bash || screen -SAm bash bash ) )\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"( screen -r bash || ( screen -d bash && screen -r bash || screen -SAm bash bash ) )\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Running this script will enter currently running "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"screen"}]},{"type":"text","value":" session or will start new one."}]},{"type":"element","tag":"code","props":{"code":"( screen -r bash || ( screen -d bash && screen -r bash || screen -SAm bash bash ) )\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-322b82"},"children":[{"type":"text","value":"( screen -r bash "}]},{"type":"element","tag":"span","props":{"class":"ct-14dc6a"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-322b82"},"children":[{"type":"text","value":" ( screen -d bash "}]},{"type":"element","tag":"span","props":{"class":"ct-14dc6a"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-322b82"},"children":[{"type":"text","value":" screen -r bash "}]},{"type":"element","tag":"span","props":{"class":"ct-14dc6a"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-322b82"},"children":[{"type":"text","value":" screen -SAm bash bash ) )"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-14dc6a{color:#FF7B72}.ct-322b82{color:#C9D1D9}.light .ct-322b82{color:#657B83}.light .ct-14dc6a{color:#859900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Linux:Resume or start screen session.md","_source":"content","_file":"Linux/Resume or start screen session.md","_extension":"md"} \ No newline at end of file +{"_path":"/linux/resume-or-start-screen-session","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Resume Or Start Screen Session","description":"Running this script will enter currently running screen session or will start new one.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Running this script will enter currently running "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"screen"}]},{"type":"text","value":" session or will start new one."}]},{"type":"element","tag":"code","props":{"code":"( screen -r bash || ( screen -d bash && screen -r bash || screen -SAm bash bash ) )\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"( screen -r bash || ( screen -d bash && screen -r bash || screen -SAm bash bash ) )\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Running this script will enter currently running "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"screen"}]},{"type":"text","value":" session or will start new one."}]},{"type":"element","tag":"code","props":{"code":"( screen -r bash || ( screen -d bash && screen -r bash || screen -SAm bash bash ) )\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8433fd"},"children":[{"type":"text","value":"( screen -r bash "}]},{"type":"element","tag":"span","props":{"class":"ct-c0622b"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-8433fd"},"children":[{"type":"text","value":" ( screen -d bash "}]},{"type":"element","tag":"span","props":{"class":"ct-c0622b"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-8433fd"},"children":[{"type":"text","value":" screen -r bash "}]},{"type":"element","tag":"span","props":{"class":"ct-c0622b"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-8433fd"},"children":[{"type":"text","value":" screen -SAm bash bash ) )"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-c0622b{color:#FF7B72}.ct-8433fd{color:#C9D1D9}.light .ct-8433fd{color:#657B83}.light .ct-c0622b{color:#859900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Linux:Resume or start screen session.md","_source":"content","_file":"Linux/Resume or start screen session.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/arOc40mIpI.json b/docs/api/_content/query/arOc40mIpI.json index b184088..88abbac 100644 --- a/docs/api/_content/query/arOc40mIpI.json +++ b/docs/api/_content/query/arOc40mIpI.json @@ -1 +1 @@ -{"_path":"/docker/drone-ci","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Drone Ci","description":"Can be used with Private docker registry to deploy things using #docker.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Can be used with "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"Private docker registry"}]},{"type":"text","value":" to deploy things using #docker."}]},{"type":"element","tag":"h2","props":{"id":"pushing-to-private-docker_registry"},"children":[{"type":"text","value":"Pushing to private docker_registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should specify "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_login"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_password"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_registry"}]},{"type":"text","value":" organizations variables in your "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"drone"}]},{"type":"text","value":". And "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker_repo"}]},{"type":"text","value":" variable for your repo as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker.yourdomain.com/your-image"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is example of "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".droneci"}]},{"type":"text","value":" for "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"private docker registry"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build-master\n image: plugins/docker\n when:\n branch:\n - master\n settings:\n dockerfile: Dockerfile\n tag:\n - ${DRONE_BRANCH}\n username:\n from_secret: global_docker_login\n password:\n from_secret: global_docker_password\n registry:\n from_secret: global_docker_registry\n repo:\n from_secret: docker_repo\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build-master\n image: plugins/docker\n when:\n branch:\n - master\n settings:\n dockerfile: Dockerfile\n tag:\n - ${DRONE_BRANCH}\n username:\n from_secret: global_docker_login\n password:\n from_secret: global_docker_password\n registry:\n from_secret: global_docker_registry\n repo:\n from_secret: docker_repo\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"docker-compose-file-for-drone-ci"},"children":[{"type":"text","value":"Docker-compose file for drone-ci"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone"}]},{"type":"text","value":" service is ui itself and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone-agent"}]},{"type":"text","value":" is runner for builds, that can be started on different machine (or machines)."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"secret_id"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"rpc_secret"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone.url"}]},{"type":"text","value":" to something you like."}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nservices:\n drone:\n container_name: drone\n image: drone/drone:latest\n environment:\n - DRONE_GITHUB_CLIENT_ID=secret_id\n - DRONE_GITHUB_CLIENT_SECRET=client_secret\n - DRONE_RPC_SECRET=rpc_secret\n - DRONE_SERVER_HOST=drone.url\n - DRONE_USER_CREATE=\"username:user,admin:true\"\n - DRONE_SERVER_PROTO=https\n - DRONE_TLS_AUTOCERT=false\n - DRONE_GIT_ALWAYS_AUTH=false\n - DRONE_LOGS_DEBUG=true\n - DRONE_LOGS_TRACE=true\n restart: always\n volumes:\n - ./data:/data\n ports:\n - 8090:80\n drone-agent:\n container_name: drone__agent\n image: drone/agent:latest\n command: agent\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n environment:\n - DRONE_RPC_SERVER=https://drone.url\n - DRONE_RPC_SECRET=rpc_secret\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: \"3\"\n\nservices:\n drone:\n container_name: drone\n image: drone/drone:latest\n environment:\n - DRONE_GITHUB_CLIENT_ID=secret_id\n - DRONE_GITHUB_CLIENT_SECRET=client_secret\n - DRONE_RPC_SECRET=rpc_secret\n - DRONE_SERVER_HOST=drone.url\n - DRONE_USER_CREATE=\"username:user,admin:true\"\n - DRONE_SERVER_PROTO=https\n - DRONE_TLS_AUTOCERT=false\n - DRONE_GIT_ALWAYS_AUTH=false\n - DRONE_LOGS_DEBUG=true\n - DRONE_LOGS_TRACE=true\n restart: always\n volumes:\n - ./data:/data\n ports:\n - 8090:80\n drone-agent:\n container_name: drone__agent\n image: drone/agent:latest\n command: agent\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n environment:\n - DRONE_RPC_SERVER=https://drone.url\n - DRONE_RPC_SECRET=rpc_secret\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"caching-builds"},"children":[{"type":"text","value":"Caching builds"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Haven't checked that yet, but there's a "},{"type":"element","tag":"a","props":{"href":"https://laszlo.cloud/the-ultimate-droneci-caching-guide","rel":["nofollow"]},"children":[{"type":"text","value":"manual"}]},{"type":"text","value":" from "},{"type":"element","tag":"a","props":{"href":"https://laszlo.cloud/","rel":["nofollow"]},"children":[{"type":"text","value":"Laszlo Fogas"}]},{"type":"text","value":" about that."}]},{"type":"element","tag":"h2","props":{"id":"get-user-info"},"children":[{"type":"text","value":"Get user info"}]},{"type":"element","tag":"code","props":{"code":"export DRONE_SERVER=https://drone.url\nexport DRONE_TOKEN=password\ndrone info\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"export DRONE_SERVER=https://drone.url\nexport DRONE_TOKEN=password\ndrone info\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"mark-user-as-trusted"},"children":[{"type":"text","value":"Mark user as trusted"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes it won't help, then connect to drone database with sqlite and change user's trusted flag to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"1"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"drone repo update $1 --trusted=true && drone repo info $1\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"drone repo update $1 --trusted=true && drone repo info $1\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Can be used with "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"Private docker registry"}]},{"type":"text","value":" to deploy things using #docker."}]},{"type":"element","tag":"h2","props":{"id":"pushing-to-private-docker_registry"},"children":[{"type":"text","value":"Pushing to private docker_registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should specify "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_login"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_password"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_registry"}]},{"type":"text","value":" organizations variables in your "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"drone"}]},{"type":"text","value":". And "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker_repo"}]},{"type":"text","value":" variable for your repo as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker.yourdomain.com/your-image"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is example of "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".droneci"}]},{"type":"text","value":" for "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"private docker registry"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build-master\n image: plugins/docker\n when:\n branch:\n - master\n settings:\n dockerfile: Dockerfile\n tag:\n - ${DRONE_BRANCH}\n username:\n from_secret: global_docker_login\n password:\n from_secret: global_docker_password\n registry:\n from_secret: global_docker_registry\n repo:\n from_secret: docker_repo\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"kind"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"pipeline"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"build"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"docker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"platform"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"os"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"linux"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"arch"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"amd64"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"steps"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"build-master"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"plugins/docker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"when"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"branch"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"master"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"settings"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"dockerfile"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"Dockerfile"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"tag"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"${DRONE_BRANCH}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"username"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"global_docker_login"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"password"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"global_docker_password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"registry"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"global_docker_registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"repo"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"docker_repo"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"docker-compose-file-for-drone-ci"},"children":[{"type":"text","value":"Docker-compose file for drone-ci"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone"}]},{"type":"text","value":" service is ui itself and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone-agent"}]},{"type":"text","value":" is runner for builds, that can be started on different machine (or machines)."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"secret_id"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"rpc_secret"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone.url"}]},{"type":"text","value":" to something you like."}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nservices:\n drone:\n container_name: drone\n image: drone/drone:latest\n environment:\n - DRONE_GITHUB_CLIENT_ID=secret_id\n - DRONE_GITHUB_CLIENT_SECRET=client_secret\n - DRONE_RPC_SECRET=rpc_secret\n - DRONE_SERVER_HOST=drone.url\n - DRONE_USER_CREATE=\"username:user,admin:true\"\n - DRONE_SERVER_PROTO=https\n - DRONE_TLS_AUTOCERT=false\n - DRONE_GIT_ALWAYS_AUTH=false\n - DRONE_LOGS_DEBUG=true\n - DRONE_LOGS_TRACE=true\n restart: always\n volumes:\n - ./data:/data\n ports:\n - 8090:80\n drone-agent:\n container_name: drone__agent\n image: drone/agent:latest\n command: agent\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n environment:\n - DRONE_RPC_SERVER=https://drone.url\n - DRONE_RPC_SECRET=rpc_secret\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"\"3\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"drone"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"drone"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"drone/drone:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_GITHUB_CLIENT_ID=secret_id"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_GITHUB_CLIENT_SECRET=client_secret"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_RPC_SECRET=rpc_secret"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_SERVER_HOST=drone.url"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_USER_CREATE=\"username:user,admin:true\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_SERVER_PROTO=https"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_TLS_AUTOCERT=false"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_GIT_ALWAYS_AUTH=false"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_LOGS_DEBUG=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_LOGS_TRACE=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"./data:/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"8090:80"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"drone-agent"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"drone__agent"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"drone/agent:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"command"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"agent"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"/var/run/docker.sock:/var/run/docker.sock"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2411f6"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_RPC_SERVER=https://drone.url"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-dd39ce"},"children":[{"type":"text","value":"DRONE_RPC_SECRET=rpc_secret"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"caching-builds"},"children":[{"type":"text","value":"Caching builds"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Haven't checked that yet, but there's a "},{"type":"element","tag":"a","props":{"href":"https://laszlo.cloud/the-ultimate-droneci-caching-guide","rel":["nofollow"]},"children":[{"type":"text","value":"manual"}]},{"type":"text","value":" from "},{"type":"element","tag":"a","props":{"href":"https://laszlo.cloud/","rel":["nofollow"]},"children":[{"type":"text","value":"Laszlo Fogas"}]},{"type":"text","value":" about that."}]},{"type":"element","tag":"h2","props":{"id":"get-user-info"},"children":[{"type":"text","value":"Get user info"}]},{"type":"element","tag":"code","props":{"code":"export DRONE_SERVER=https://drone.url\nexport DRONE_TOKEN=password\ndrone info\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-18f58a"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" DRONE_SERVER=https://drone.url"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-18f58a"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" DRONE_TOKEN=password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":"drone info"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"mark-user-as-trusted"},"children":[{"type":"text","value":"Mark user as trusted"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes it won't help, then connect to drone database with sqlite and change user's trusted flag to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"1"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"drone repo update $1 --trusted=true && drone repo info $1\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":"drone repo update "}]},{"type":"element","tag":"span","props":{"class":"ct-3cdac0"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-327cdc"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" --trusted=true "}]},{"type":"element","tag":"span","props":{"class":"ct-f84443"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-f2462a"},"children":[{"type":"text","value":" drone repo info "}]},{"type":"element","tag":"span","props":{"class":"ct-3cdac0"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-327cdc"},"children":[{"type":"text","value":"1"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-f84443{color:#FF7B72}.ct-327cdc{color:#C9D1D9}.ct-3cdac0{color:#C9D1D9}.ct-18f58a{color:#FF7B72}.ct-dd39ce{color:#A5D6FF}.ct-f2462a{color:#C9D1D9}.ct-2411f6{color:#7EE787}.light .ct-2411f6{color:#268BD2}.light .ct-f2462a{color:#657B83}.light .ct-dd39ce{color:#2AA198}.light .ct-18f58a{color:#073642}.light .ct-3cdac0{color:#859900}.light .ct-327cdc{color:#268BD2}.light .ct-f84443{color:#859900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"pushing-to-private-docker_registry","depth":2,"text":"Pushing to private docker_registry"},{"id":"docker-compose-file-for-drone-ci","depth":2,"text":"Docker-compose file for drone-ci"},{"id":"caching-builds","depth":2,"text":"Caching builds"},{"id":"get-user-info","depth":2,"text":"Get user info"},{"id":"mark-user-as-trusted","depth":2,"text":"Mark user as trusted"}]}},"_type":"markdown","_id":"content:Docker:Drone-ci.md","_source":"content","_file":"Docker/Drone-ci.md","_extension":"md"} \ No newline at end of file +{"_path":"/docker/drone-ci","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Drone Ci","description":"Can be used with Private docker registry to deploy things using #docker.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Can be used with "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"Private docker registry"}]},{"type":"text","value":" to deploy things using #docker."}]},{"type":"element","tag":"h2","props":{"id":"pushing-to-private-docker_registry"},"children":[{"type":"text","value":"Pushing to private docker_registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should specify "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_login"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_password"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_registry"}]},{"type":"text","value":" organizations variables in your "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"drone"}]},{"type":"text","value":". And "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker_repo"}]},{"type":"text","value":" variable for your repo as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker.yourdomain.com/your-image"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is example of "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".droneci"}]},{"type":"text","value":" for "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"private docker registry"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build-master\n image: plugins/docker\n when:\n branch:\n - master\n settings:\n dockerfile: Dockerfile\n tag:\n - ${DRONE_BRANCH}\n username:\n from_secret: global_docker_login\n password:\n from_secret: global_docker_password\n registry:\n from_secret: global_docker_registry\n repo:\n from_secret: docker_repo\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build-master\n image: plugins/docker\n when:\n branch:\n - master\n settings:\n dockerfile: Dockerfile\n tag:\n - ${DRONE_BRANCH}\n username:\n from_secret: global_docker_login\n password:\n from_secret: global_docker_password\n registry:\n from_secret: global_docker_registry\n repo:\n from_secret: docker_repo\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"docker-compose-file-for-drone-ci"},"children":[{"type":"text","value":"Docker-compose file for drone-ci"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone"}]},{"type":"text","value":" service is ui itself and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone-agent"}]},{"type":"text","value":" is runner for builds, that can be started on different machine (or machines)."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"secret_id"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"rpc_secret"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone.url"}]},{"type":"text","value":" to something you like."}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nservices:\n drone:\n container_name: drone\n image: drone/drone:latest\n environment:\n - DRONE_GITHUB_CLIENT_ID=secret_id\n - DRONE_GITHUB_CLIENT_SECRET=client_secret\n - DRONE_RPC_SECRET=rpc_secret\n - DRONE_SERVER_HOST=drone.url\n - DRONE_USER_CREATE=\"username:user,admin:true\"\n - DRONE_SERVER_PROTO=https\n - DRONE_TLS_AUTOCERT=false\n - DRONE_GIT_ALWAYS_AUTH=false\n - DRONE_LOGS_DEBUG=true\n - DRONE_LOGS_TRACE=true\n restart: always\n volumes:\n - ./data:/data\n ports:\n - 8090:80\n drone-agent:\n container_name: drone__agent\n image: drone/agent:latest\n command: agent\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n environment:\n - DRONE_RPC_SERVER=https://drone.url\n - DRONE_RPC_SECRET=rpc_secret\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: \"3\"\n\nservices:\n drone:\n container_name: drone\n image: drone/drone:latest\n environment:\n - DRONE_GITHUB_CLIENT_ID=secret_id\n - DRONE_GITHUB_CLIENT_SECRET=client_secret\n - DRONE_RPC_SECRET=rpc_secret\n - DRONE_SERVER_HOST=drone.url\n - DRONE_USER_CREATE=\"username:user,admin:true\"\n - DRONE_SERVER_PROTO=https\n - DRONE_TLS_AUTOCERT=false\n - DRONE_GIT_ALWAYS_AUTH=false\n - DRONE_LOGS_DEBUG=true\n - DRONE_LOGS_TRACE=true\n restart: always\n volumes:\n - ./data:/data\n ports:\n - 8090:80\n drone-agent:\n container_name: drone__agent\n image: drone/agent:latest\n command: agent\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n environment:\n - DRONE_RPC_SERVER=https://drone.url\n - DRONE_RPC_SECRET=rpc_secret\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"caching-builds"},"children":[{"type":"text","value":"Caching builds"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Haven't checked that yet, but there's a "},{"type":"element","tag":"a","props":{"href":"https://laszlo.cloud/the-ultimate-droneci-caching-guide","rel":["nofollow"]},"children":[{"type":"text","value":"manual"}]},{"type":"text","value":" from "},{"type":"element","tag":"a","props":{"href":"https://laszlo.cloud/","rel":["nofollow"]},"children":[{"type":"text","value":"Laszlo Fogas"}]},{"type":"text","value":" about that."}]},{"type":"element","tag":"h2","props":{"id":"get-user-info"},"children":[{"type":"text","value":"Get user info"}]},{"type":"element","tag":"code","props":{"code":"export DRONE_SERVER=https://drone.url\nexport DRONE_TOKEN=password\ndrone info\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"export DRONE_SERVER=https://drone.url\nexport DRONE_TOKEN=password\ndrone info\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"mark-user-as-trusted"},"children":[{"type":"text","value":"Mark user as trusted"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes it won't help, then connect to drone database with sqlite and change user's trusted flag to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"1"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"drone repo update $1 --trusted=true && drone repo info $1\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"drone repo update $1 --trusted=true && drone repo info $1\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Can be used with "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"Private docker registry"}]},{"type":"text","value":" to deploy things using #docker."}]},{"type":"element","tag":"h2","props":{"id":"pushing-to-private-docker_registry"},"children":[{"type":"text","value":"Pushing to private docker_registry"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should specify "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_login"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_password"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"global_docker_registry"}]},{"type":"text","value":" organizations variables in your "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"drone"}]},{"type":"text","value":". And "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker_repo"}]},{"type":"text","value":" variable for your repo as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker.yourdomain.com/your-image"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is example of "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".droneci"}]},{"type":"text","value":" for "},{"type":"element","tag":"a","props":{"href":"Private%20docker%20registry"},"children":[{"type":"text","value":"private docker registry"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build-master\n image: plugins/docker\n when:\n branch:\n - master\n settings:\n dockerfile: Dockerfile\n tag:\n - ${DRONE_BRANCH}\n username:\n from_secret: global_docker_login\n password:\n from_secret: global_docker_password\n registry:\n from_secret: global_docker_registry\n repo:\n from_secret: docker_repo\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"kind"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"pipeline"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"build"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"docker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"platform"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"os"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"linux"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"arch"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"amd64"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"steps"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"build-master"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"plugins/docker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"when"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"branch"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"master"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"settings"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"dockerfile"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"Dockerfile"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"tag"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"${DRONE_BRANCH}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"username"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"global_docker_login"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"password"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"global_docker_password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"registry"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"global_docker_registry"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"repo"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"docker_repo"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"docker-compose-file-for-drone-ci"},"children":[{"type":"text","value":"Docker-compose file for drone-ci"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone"}]},{"type":"text","value":" service is ui itself and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone-agent"}]},{"type":"text","value":" is runner for builds, that can be started on different machine (or machines)."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"secret_id"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"rpc_secret"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"drone.url"}]},{"type":"text","value":" to something you like."}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nservices:\n drone:\n container_name: drone\n image: drone/drone:latest\n environment:\n - DRONE_GITHUB_CLIENT_ID=secret_id\n - DRONE_GITHUB_CLIENT_SECRET=client_secret\n - DRONE_RPC_SECRET=rpc_secret\n - DRONE_SERVER_HOST=drone.url\n - DRONE_USER_CREATE=\"username:user,admin:true\"\n - DRONE_SERVER_PROTO=https\n - DRONE_TLS_AUTOCERT=false\n - DRONE_GIT_ALWAYS_AUTH=false\n - DRONE_LOGS_DEBUG=true\n - DRONE_LOGS_TRACE=true\n restart: always\n volumes:\n - ./data:/data\n ports:\n - 8090:80\n drone-agent:\n container_name: drone__agent\n image: drone/agent:latest\n command: agent\n restart: always\n volumes:\n - /var/run/docker.sock:/var/run/docker.sock\n environment:\n - DRONE_RPC_SERVER=https://drone.url\n - DRONE_RPC_SECRET=rpc_secret\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"\"3\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"drone"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"drone"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"drone/drone:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_GITHUB_CLIENT_ID=secret_id"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_GITHUB_CLIENT_SECRET=client_secret"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_RPC_SECRET=rpc_secret"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_SERVER_HOST=drone.url"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_USER_CREATE=\"username:user,admin:true\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_SERVER_PROTO=https"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_TLS_AUTOCERT=false"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_GIT_ALWAYS_AUTH=false"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_LOGS_DEBUG=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_LOGS_TRACE=true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"./data:/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"8090:80"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"drone-agent"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"drone__agent"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"drone/agent:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"command"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"agent"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"/var/run/docker.sock:/var/run/docker.sock"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d1fd60"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_RPC_SERVER=https://drone.url"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-404a3d"},"children":[{"type":"text","value":"DRONE_RPC_SECRET=rpc_secret"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"caching-builds"},"children":[{"type":"text","value":"Caching builds"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Haven't checked that yet, but there's a "},{"type":"element","tag":"a","props":{"href":"https://laszlo.cloud/the-ultimate-droneci-caching-guide","rel":["nofollow"]},"children":[{"type":"text","value":"manual"}]},{"type":"text","value":" from "},{"type":"element","tag":"a","props":{"href":"https://laszlo.cloud/","rel":["nofollow"]},"children":[{"type":"text","value":"Laszlo Fogas"}]},{"type":"text","value":" about that."}]},{"type":"element","tag":"h2","props":{"id":"get-user-info"},"children":[{"type":"text","value":"Get user info"}]},{"type":"element","tag":"code","props":{"code":"export DRONE_SERVER=https://drone.url\nexport DRONE_TOKEN=password\ndrone info\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0734fc"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" DRONE_SERVER=https://drone.url"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0734fc"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" DRONE_TOKEN=password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":"drone info"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"mark-user-as-trusted"},"children":[{"type":"text","value":"Mark user as trusted"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes it won't help, then connect to drone database with sqlite and change user's trusted flag to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"1"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"drone repo update $1 --trusted=true && drone repo info $1\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":"drone repo update "}]},{"type":"element","tag":"span","props":{"class":"ct-9f67ad"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-55c6c3"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" --trusted=true "}]},{"type":"element","tag":"span","props":{"class":"ct-303659"},"children":[{"type":"text","value":"&&"}]},{"type":"element","tag":"span","props":{"class":"ct-2da089"},"children":[{"type":"text","value":" drone repo info "}]},{"type":"element","tag":"span","props":{"class":"ct-9f67ad"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-55c6c3"},"children":[{"type":"text","value":"1"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-303659{color:#FF7B72}.ct-55c6c3{color:#C9D1D9}.ct-9f67ad{color:#C9D1D9}.ct-0734fc{color:#FF7B72}.ct-404a3d{color:#A5D6FF}.ct-2da089{color:#C9D1D9}.ct-d1fd60{color:#7EE787}.light .ct-d1fd60{color:#268BD2}.light .ct-2da089{color:#657B83}.light .ct-404a3d{color:#2AA198}.light .ct-0734fc{color:#073642}.light .ct-9f67ad{color:#859900}.light .ct-55c6c3{color:#268BD2}.light .ct-303659{color:#859900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"pushing-to-private-docker_registry","depth":2,"text":"Pushing to private docker_registry"},{"id":"docker-compose-file-for-drone-ci","depth":2,"text":"Docker-compose file for drone-ci"},{"id":"caching-builds","depth":2,"text":"Caching builds"},{"id":"get-user-info","depth":2,"text":"Get user info"},{"id":"mark-user-as-trusted","depth":2,"text":"Mark user as trusted"}]}},"_type":"markdown","_id":"content:Docker:Drone-ci.md","_source":"content","_file":"Docker/Drone-ci.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/cft4lrDUKB.json b/docs/api/_content/query/cft4lrDUKB.json index e885f2c..39daaad 100644 --- a/docs/api/_content/query/cft4lrDUKB.json +++ b/docs/api/_content/query/cft4lrDUKB.json @@ -1 +1 @@ -{"_path":"/frontend/webgl/fragment-shaders","_dir":"webgl","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Fragment Shaders","description":"Fragment shaders describe how polygons are painted (or textured). Read Basics of WebGL (Drawing a Cube) first.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Fragment shaders describe "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"how polygons are painted"}]},{"type":"text","value":" (or textured). Read "},{"type":"element","tag":"a","props":{"href":"Basics%20of%20WebGL%20(Drawing%20a%20Cube)"},"children":[{"type":"text","value":"Basics of WebGL (Drawing a Cube)"}]},{"type":"text","value":" first."}]},{"type":"element","tag":"h2","props":{"id":"sample-fragment-vertex"},"children":[{"type":"text","value":"Sample fragment vertex"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Parameters could be passed here as written at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n// parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}```\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n// parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}```\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Fragment shaders describe "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"how polygons are painted"}]},{"type":"text","value":" (or textured). Read "},{"type":"element","tag":"a","props":{"href":"Basics%20of%20WebGL%20(Drawing%20a%20Cube)"},"children":[{"type":"text","value":"Basics of WebGL (Drawing a Cube)"}]},{"type":"text","value":" first."}]},{"type":"element","tag":"h2","props":{"id":"sample-fragment-vertex"},"children":[{"type":"text","value":"Sample fragment vertex"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Parameters could be passed here as written at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n// parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}```\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":"precision highp "}]},{"type":"element","tag":"span","props":{"class":"ct-87906d"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-83a565"},"children":[{"type":"text","value":"// parameter from Vertex Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":"varying vec4 v_positionWithOffset;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-83a565"},"children":[{"type":"text","value":"// parameters passed from Javascript loop"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-87906d"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":" slide;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-87906d"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":" aspect;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-87906d"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bd94b5"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-87906d"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":"){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-83a565"},"children":[{"type":"text","value":"// color, attached to current verticle {r,g,b,alpha}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-83a565"},"children":[{"type":"text","value":"// same a["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-83a565"},"children":[{"type":"text","value":"// v_positionWithOffset.x,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-83a565"},"children":[{"type":"text","value":"// v_positionWithOffset.y, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-83a565"},"children":[{"type":"text","value":"// v_positionWithOffset.z, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-83a565"},"children":[{"type":"text","value":"// 1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-83a565"},"children":[{"type":"text","value":"// ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":" gl_FragColor"}]},{"type":"element","tag":"span","props":{"class":"ct-f82235"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-bd94b5"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ec0d41"},"children":[{"type":"text","value":"v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-ec0d41"},"children":[{"type":"text","value":"xyz"}]},{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-c7e855"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c796a9"},"children":[{"type":"text","value":"}```"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-c7e855{color:#79C0FF}.ct-ec0d41{color:#C9D1D9}.ct-f82235{color:#FF7B72}.ct-bd94b5{color:#D2A8FF}.ct-83a565{color:#8B949E}.ct-87906d{color:#FF7B72}.ct-c796a9{color:#C9D1D9}.light .ct-c796a9{color:#657B83}.light .ct-87906d{color:#073642}.light .ct-83a565{color:#93A1A1}.light .ct-bd94b5{color:#268BD2}.light .ct-f82235{color:#859900}.light .ct-ec0d41{color:#268BD2}.light .ct-c7e855{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"sample-fragment-vertex","depth":2,"text":"Sample fragment vertex"}]}},"_type":"markdown","_id":"content:Frontend:WebGL:Fragment Shaders.md","_source":"content","_file":"Frontend/WebGL/Fragment Shaders.md","_extension":"md"} \ No newline at end of file +{"_path":"/frontend/webgl/fragment-shaders","_dir":"webgl","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Fragment Shaders","description":"Fragment shaders describe how polygons are painted (or textured). Read Basics of WebGL (Drawing a Cube) first.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Fragment shaders describe "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"how polygons are painted"}]},{"type":"text","value":" (or textured). Read "},{"type":"element","tag":"a","props":{"href":"Basics%20of%20WebGL%20(Drawing%20a%20Cube)"},"children":[{"type":"text","value":"Basics of WebGL (Drawing a Cube)"}]},{"type":"text","value":" first."}]},{"type":"element","tag":"h2","props":{"id":"sample-fragment-vertex"},"children":[{"type":"text","value":"Sample fragment vertex"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Parameters could be passed here as written at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n// parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}```\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n// parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}```\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Fragment shaders describe "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"how polygons are painted"}]},{"type":"text","value":" (or textured). Read "},{"type":"element","tag":"a","props":{"href":"Basics%20of%20WebGL%20(Drawing%20a%20Cube)"},"children":[{"type":"text","value":"Basics of WebGL (Drawing a Cube)"}]},{"type":"text","value":" first."}]},{"type":"element","tag":"h2","props":{"id":"sample-fragment-vertex"},"children":[{"type":"text","value":"Sample fragment vertex"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Parameters could be passed here as written at "},{"type":"element","tag":"a","props":{"href":"Vertex%20Shaders"},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"precision highp float;\n\n// parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n// parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(void){\n // color, attached to current verticle {r,g,b,alpha}\n // same a[\n // v_positionWithOffset.x,\n // v_positionWithOffset.y, \n // v_positionWithOffset.z, \n // 1\n // ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}```\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":"precision highp "}]},{"type":"element","tag":"span","props":{"class":"ct-18640f"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f234e2"},"children":[{"type":"text","value":"// parameter from Vertex Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":"varying vec4 v_positionWithOffset;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f234e2"},"children":[{"type":"text","value":"// parameters passed from Javascript loop"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-18640f"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":" slide;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-18640f"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":" aspect;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-18640f"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-84f100"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-18640f"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":"){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f234e2"},"children":[{"type":"text","value":"// color, attached to current verticle {r,g,b,alpha}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f234e2"},"children":[{"type":"text","value":"// same a["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f234e2"},"children":[{"type":"text","value":"// v_positionWithOffset.x,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f234e2"},"children":[{"type":"text","value":"// v_positionWithOffset.y, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f234e2"},"children":[{"type":"text","value":"// v_positionWithOffset.z, "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f234e2"},"children":[{"type":"text","value":"// 1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f234e2"},"children":[{"type":"text","value":"// ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":" gl_FragColor"}]},{"type":"element","tag":"span","props":{"class":"ct-28a4d8"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-84f100"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b5ac9c"},"children":[{"type":"text","value":"v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b5ac9c"},"children":[{"type":"text","value":"xyz"}]},{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-6bb943"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-af55ca"},"children":[{"type":"text","value":"}```"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-6bb943{color:#79C0FF}.ct-b5ac9c{color:#C9D1D9}.ct-28a4d8{color:#FF7B72}.ct-84f100{color:#D2A8FF}.ct-f234e2{color:#8B949E}.ct-18640f{color:#FF7B72}.ct-af55ca{color:#C9D1D9}.light .ct-af55ca{color:#657B83}.light .ct-18640f{color:#073642}.light .ct-f234e2{color:#93A1A1}.light .ct-84f100{color:#268BD2}.light .ct-28a4d8{color:#859900}.light .ct-b5ac9c{color:#268BD2}.light .ct-6bb943{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"sample-fragment-vertex","depth":2,"text":"Sample fragment vertex"}]}},"_type":"markdown","_id":"content:Frontend:WebGL:Fragment Shaders.md","_source":"content","_file":"Frontend/WebGL/Fragment Shaders.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/eIcZslqPOz.json b/docs/api/_content/query/eIcZslqPOz.json index 5742962..15608b1 100644 --- a/docs/api/_content/query/eIcZslqPOz.json +++ b/docs/api/_content/query/eIcZslqPOz.json @@ -1 +1 @@ -{"_path":"/git/force-git-to-use-https","_dir":"git","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Force Git To Use HTTPS","description":"Forces #git to use https even if remote url is #SSH. Useful for the networks with blocked #ssh protocol.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Forces #git to use https even if remote url is #SSH. Useful for the networks with blocked #ssh protocol."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Put this inside your "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"~/.gitconfig"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"[url \"https://github.com\"]\n insteadOf = git://github.com\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"[url \"https://github.com\"]\n insteadOf = git://github.com\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Forces #git to use https even if remote url is #SSH. Useful for the networks with blocked #ssh protocol."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Put this inside your "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"~/.gitconfig"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"[url \"https://github.com\"]\n insteadOf = git://github.com\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2aa28a"},"children":[{"type":"text","value":"[url "}]},{"type":"element","tag":"span","props":{"class":"ct-67f284"},"children":[{"type":"text","value":"\"https://github.com\""}]},{"type":"element","tag":"span","props":{"class":"ct-2aa28a"},"children":[{"type":"text","value":"]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2aa28a"},"children":[{"type":"text","value":" insteadOf "}]},{"type":"element","tag":"span","props":{"class":"ct-75a348"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-2aa28a"},"children":[{"type":"text","value":" git:"}]},{"type":"element","tag":"span","props":{"class":"ct-17e9d4"},"children":[{"type":"text","value":"//github.com"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-17e9d4{color:#8B949E}.ct-75a348{color:#FF7B72}.ct-67f284{color:#A5D6FF}.ct-2aa28a{color:#C9D1D9}.light .ct-2aa28a{color:#657B83}.light .ct-67f284{color:#2AA198}.light .ct-75a348{color:#859900}.light .ct-17e9d4{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Git:Force git to use HTTPS.md","_source":"content","_file":"Git/Force git to use HTTPS.md","_extension":"md"} \ No newline at end of file +{"_path":"/git/force-git-to-use-https","_dir":"git","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Force Git To Use HTTPS","description":"Forces #git to use https even if remote url is #SSH. Useful for the networks with blocked #ssh protocol.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Forces #git to use https even if remote url is #SSH. Useful for the networks with blocked #ssh protocol."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Put this inside your "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"~/.gitconfig"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"[url \"https://github.com\"]\n insteadOf = git://github.com\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"[url \"https://github.com\"]\n insteadOf = git://github.com\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Forces #git to use https even if remote url is #SSH. Useful for the networks with blocked #ssh protocol."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Put this inside your "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"~/.gitconfig"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"[url \"https://github.com\"]\n insteadOf = git://github.com\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fbd0e3"},"children":[{"type":"text","value":"[url "}]},{"type":"element","tag":"span","props":{"class":"ct-22e710"},"children":[{"type":"text","value":"\"https://github.com\""}]},{"type":"element","tag":"span","props":{"class":"ct-fbd0e3"},"children":[{"type":"text","value":"]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-fbd0e3"},"children":[{"type":"text","value":" insteadOf "}]},{"type":"element","tag":"span","props":{"class":"ct-ea4b0a"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-fbd0e3"},"children":[{"type":"text","value":" git:"}]},{"type":"element","tag":"span","props":{"class":"ct-a22a26"},"children":[{"type":"text","value":"//github.com"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-a22a26{color:#8B949E}.ct-ea4b0a{color:#FF7B72}.ct-22e710{color:#A5D6FF}.ct-fbd0e3{color:#C9D1D9}.light .ct-fbd0e3{color:#657B83}.light .ct-22e710{color:#2AA198}.light .ct-ea4b0a{color:#859900}.light .ct-a22a26{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Git:Force git to use HTTPS.md","_source":"content","_file":"Git/Force git to use HTTPS.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/epeSDkttbj.json b/docs/api/_content/query/epeSDkttbj.json index 269784f..009e230 100644 --- a/docs/api/_content/query/epeSDkttbj.json +++ b/docs/api/_content/query/epeSDkttbj.json @@ -1 +1 @@ -{"_path":"/css/sass-nth-child-iterate-mixin","_dir":"css","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Sass Nth Child Iterate Mixin","description":"Say, we need to color n items by specific colors, which depend on its position. #SCSS supports iteration over lists for that purposes:","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say, we need to color "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"n"}]},{"type":"text","value":" items by specific colors, which depend on its position. #SCSS supports "},{"type":"element","tag":"a","props":{"href":"https://sass-lang.com/documentation/at-rules/control/each","rel":["nofollow"]},"children":[{"type":"text","value":"iteration over lists"}]},{"type":"text","value":" for that purposes:"}]},{"type":"element","tag":"code","props":{"code":"@mixin color-per-child($colors) {\n @each $color in $colors {\n &:nth-child(#{index(($colors), ($color))}) {\n color: $color;\n }\n }\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"@mixin color-per-child($colors) {\n @each $color in $colors {\n &:nth-child(#{index(($colors), ($color))}) {\n color: $color;\n }\n }\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Usage is simple:"}]},{"type":"element","tag":"code","props":{"code":".item {\n @include color_per_child((#ded187, #dbde87, #bade87, #9cde87, #87deaa));\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":".item {\n @include color_per_child((#ded187, #dbde87, #bade87, #9cde87, #87deaa));\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say, we need to color "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"n"}]},{"type":"text","value":" items by specific colors, which depend on its position. #SCSS supports "},{"type":"element","tag":"a","props":{"href":"https://sass-lang.com/documentation/at-rules/control/each","rel":["nofollow"]},"children":[{"type":"text","value":"iteration over lists"}]},{"type":"text","value":" for that purposes:"}]},{"type":"element","tag":"code","props":{"code":"@mixin color-per-child($colors) {\n @each $color in $colors {\n &:nth-child(#{index(($colors), ($color))}) {\n color: $color;\n }\n }\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-41b004"},"children":[{"type":"text","value":"@mixin"}]},{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-304886"},"children":[{"type":"text","value":"color-per-child"}]},{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-432e38"},"children":[{"type":"text","value":"$colors"}]},{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-41b004"},"children":[{"type":"text","value":"@each"}]},{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-432e38"},"children":[{"type":"text","value":"$color"}]},{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-41b004"},"children":[{"type":"text","value":"in"}]},{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-432e38"},"children":[{"type":"text","value":"$colors"}]},{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b6c16d"},"children":[{"type":"text","value":"&"}]},{"type":"element","tag":"span","props":{"class":"ct-ed78e4"},"children":[{"type":"text","value":":nth-child"}]},{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-432e38"},"children":[{"type":"text","value":"#{"}]},{"type":"element","tag":"span","props":{"class":"ct-577ace"},"children":[{"type":"text","value":"index"}]},{"type":"element","tag":"span","props":{"class":"ct-432e38"},"children":[{"type":"text","value":"(($colors), ($color))}"}]},{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a45440"},"children":[{"type":"text","value":"color"}]},{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-432e38"},"children":[{"type":"text","value":"$color"}]},{"type":"element","tag":"span","props":{"class":"ct-091587"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Usage is simple:"}]},{"type":"element","tag":"code","props":{"code":".item {\n @include color_per_child((#ded187, #dbde87, #bade87, #9cde87, #87deaa));\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-17b220"},"children":[{"type":"text","value":".item"}]},{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-889b48"},"children":[{"type":"text","value":"@include"}]},{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-93a1a4"},"children":[{"type":"text","value":"color_per_child"}]},{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-042456"},"children":[{"type":"text","value":"#ded187"}]},{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-042456"},"children":[{"type":"text","value":"#dbde87"}]},{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-042456"},"children":[{"type":"text","value":"#bade87"}]},{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-042456"},"children":[{"type":"text","value":"#9cde87"}]},{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-042456"},"children":[{"type":"text","value":"#87deaa"}]},{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f78f84"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-042456{color:#79C0FF}.ct-93a1a4{color:#D2A8FF}.ct-889b48{color:#FF7B72}.ct-17b220{color:#79C0FF}.ct-f78f84{color:#C9D1D9}.ct-a45440{color:#79C0FF}.ct-577ace{color:#79C0FF}.ct-ed78e4{color:#79C0FF}.ct-b6c16d{color:#7EE787}.ct-432e38{color:#FFA657}.ct-304886{color:#D2A8FF}.ct-091587{color:#C9D1D9}.ct-41b004{color:#FF7B72}.light .ct-41b004{color:#859900}.light .ct-091587{color:#657B83}.light .ct-304886{color:#268BD2}.light .ct-432e38{color:#657B83}.light .ct-b6c16d{color:#268BD2}.light .ct-ed78e4{color:#93A1A1}.light .ct-577ace{color:#268BD2}.light .ct-a45440{color:#859900}.light .ct-f78f84{color:#657B83}.light .ct-17b220{color:#93A1A1}.light .ct-889b48{color:#859900}.light .ct-93a1a4{color:#268BD2}.light .ct-042456{color:#CB4B16}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:CSS:Sass nth-child iterate mixin.md","_source":"content","_file":"CSS/Sass nth-child iterate mixin.md","_extension":"md"} \ No newline at end of file +{"_path":"/css/sass-nth-child-iterate-mixin","_dir":"css","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Sass Nth Child Iterate Mixin","description":"Say, we need to color n items by specific colors, which depend on its position. #SCSS supports iteration over lists for that purposes:","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say, we need to color "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"n"}]},{"type":"text","value":" items by specific colors, which depend on its position. #SCSS supports "},{"type":"element","tag":"a","props":{"href":"https://sass-lang.com/documentation/at-rules/control/each","rel":["nofollow"]},"children":[{"type":"text","value":"iteration over lists"}]},{"type":"text","value":" for that purposes:"}]},{"type":"element","tag":"code","props":{"code":"@mixin color-per-child($colors) {\n @each $color in $colors {\n &:nth-child(#{index(($colors), ($color))}) {\n color: $color;\n }\n }\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"@mixin color-per-child($colors) {\n @each $color in $colors {\n &:nth-child(#{index(($colors), ($color))}) {\n color: $color;\n }\n }\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Usage is simple:"}]},{"type":"element","tag":"code","props":{"code":".item {\n @include color_per_child((#ded187, #dbde87, #bade87, #9cde87, #87deaa));\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":".item {\n @include color_per_child((#ded187, #dbde87, #bade87, #9cde87, #87deaa));\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Say, we need to color "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"n"}]},{"type":"text","value":" items by specific colors, which depend on its position. #SCSS supports "},{"type":"element","tag":"a","props":{"href":"https://sass-lang.com/documentation/at-rules/control/each","rel":["nofollow"]},"children":[{"type":"text","value":"iteration over lists"}]},{"type":"text","value":" for that purposes:"}]},{"type":"element","tag":"code","props":{"code":"@mixin color-per-child($colors) {\n @each $color in $colors {\n &:nth-child(#{index(($colors), ($color))}) {\n color: $color;\n }\n }\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cd9d85"},"children":[{"type":"text","value":"@mixin"}]},{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3da580"},"children":[{"type":"text","value":"color-per-child"}]},{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ba84b2"},"children":[{"type":"text","value":"$colors"}]},{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cd9d85"},"children":[{"type":"text","value":"@each"}]},{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba84b2"},"children":[{"type":"text","value":"$color"}]},{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cd9d85"},"children":[{"type":"text","value":"in"}]},{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba84b2"},"children":[{"type":"text","value":"$colors"}]},{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6b63c"},"children":[{"type":"text","value":"&"}]},{"type":"element","tag":"span","props":{"class":"ct-c81df3"},"children":[{"type":"text","value":":nth-child"}]},{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ba84b2"},"children":[{"type":"text","value":"#{"}]},{"type":"element","tag":"span","props":{"class":"ct-a33ddb"},"children":[{"type":"text","value":"index"}]},{"type":"element","tag":"span","props":{"class":"ct-ba84b2"},"children":[{"type":"text","value":"(($colors), ($color))}"}]},{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-204ad4"},"children":[{"type":"text","value":"color"}]},{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ba84b2"},"children":[{"type":"text","value":"$color"}]},{"type":"element","tag":"span","props":{"class":"ct-c05fcc"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Usage is simple:"}]},{"type":"element","tag":"code","props":{"code":".item {\n @include color_per_child((#ded187, #dbde87, #bade87, #9cde87, #87deaa));\n}\n","language":"scss"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-97f073"},"children":[{"type":"text","value":".item"}]},{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-56dec9"},"children":[{"type":"text","value":"@include"}]},{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bf611e"},"children":[{"type":"text","value":"color_per_child"}]},{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-4ac007"},"children":[{"type":"text","value":"#ded187"}]},{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-4ac007"},"children":[{"type":"text","value":"#dbde87"}]},{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-4ac007"},"children":[{"type":"text","value":"#bade87"}]},{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-4ac007"},"children":[{"type":"text","value":"#9cde87"}]},{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-4ac007"},"children":[{"type":"text","value":"#87deaa"}]},{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-59d711"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-4ac007{color:#79C0FF}.ct-bf611e{color:#D2A8FF}.ct-56dec9{color:#FF7B72}.ct-97f073{color:#79C0FF}.ct-59d711{color:#C9D1D9}.ct-204ad4{color:#79C0FF}.ct-a33ddb{color:#79C0FF}.ct-c81df3{color:#79C0FF}.ct-c6b63c{color:#7EE787}.ct-ba84b2{color:#FFA657}.ct-3da580{color:#D2A8FF}.ct-c05fcc{color:#C9D1D9}.ct-cd9d85{color:#FF7B72}.light .ct-cd9d85{color:#859900}.light .ct-c05fcc{color:#657B83}.light .ct-3da580{color:#268BD2}.light .ct-ba84b2{color:#657B83}.light .ct-c6b63c{color:#268BD2}.light .ct-c81df3{color:#93A1A1}.light .ct-a33ddb{color:#268BD2}.light .ct-204ad4{color:#859900}.light .ct-59d711{color:#657B83}.light .ct-97f073{color:#93A1A1}.light .ct-56dec9{color:#859900}.light .ct-bf611e{color:#268BD2}.light .ct-4ac007{color:#CB4B16}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:CSS:Sass nth-child iterate mixin.md","_source":"content","_file":"CSS/Sass nth-child iterate mixin.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/fXI9pPDQUP.json b/docs/api/_content/query/fXI9pPDQUP.json index 4a39b3e..1685147 100644 --- a/docs/api/_content/query/fXI9pPDQUP.json +++ b/docs/api/_content/query/fXI9pPDQUP.json @@ -1 +1 @@ -{"_path":"/golang/i18n-in-golang","_dir":"golang","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"I18n In Golang","description":"There are no good examples of golang.org/x/text uses and description of how pluralization made. So, this is it.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There are no good examples of "},{"type":"element","tag":"a","props":{"href":"https://golang.org/x/text","rel":["nofollow"]},"children":[{"type":"text","value":"golang.org/x/text"}]},{"type":"text","value":" uses and description of how pluralization made. So, this is it."}]},{"type":"element","tag":"h4","props":{"id":"generating-translations"},"children":[{"type":"text","value":"Generating translations"}]},{"type":"element","tag":"blockquote","props":{},"children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should specify valid "},{"type":"element","tag":"a","props":{"href":"https://www.iso.org/obp/ui/#iso:code:3166","rel":["nofollow"]},"children":[{"type":"text","value":"ISO-3166 locale code"}]},{"type":"text","value":" to get plurals working!"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Write your code:"}]},{"type":"element","tag":"code","props":{"code":"import (\n \"golang.org/x/text/language\"\n \"golang.org/x/text/message\"\n)\n\nlang := language.MustParse('ru-RU')\nprinter := message.NewPrinter(lang)\n\ncount := 1\nprinter.Sprintf(\"%d butterflies\", count)\n","language":"go"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import (\n \"golang.org/x/text/language\"\n \"golang.org/x/text/message\"\n)\n\nlang := language.MustParse('ru-RU')\nprinter := message.NewPrinter(lang)\n\ncount := 1\nprinter.Sprintf(\"%d butterflies\", count)\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run generator for your locale (mine is "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"ru-RU"}]},{"type":"text","value":"):"}]},{"type":"element","tag":"code","props":{"code":"gotext -srclang=en-GB update -lang=ru-RU \\\n -out=translations.go github.com/path/to-output-folder\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"gotext -srclang=en-GB update -lang=ru-RU \\\n -out=translations.go github.com/path/to-output-folder\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This will generate "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"out.gotext.json"}]},{"type":"text","value":" in "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/path/to-output-folder/ru-RU"}]},{"type":"text","value":" of your project. Copy it to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"messages.out.json"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h4","props":{"id":"translating-and-adding-plural-forms"},"children":[{"type":"text","value":"Translating and adding plural forms"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"\"translation\""}]},{"type":"text","value":" value in generated "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"messages.gotext.json"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"string"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"object"}]},{"type":"text","value":" of the form shown below if you want pluralize strings, "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"then run gotext command again"}]},{"type":"text","value":", it will generate "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".go files with translations"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"According to "},{"type":"element","tag":"a","props":{"href":"https://github.com/golang/text/blob/master/feature/plural/gen_common.go#L19","rel":["nofollow"]},"children":[{"type":"text","value":"source files of gen_common"}]},{"type":"text","value":", there's a couple of forms:"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"=N"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"!=N"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"%N"}]},{"type":"text","value":" for exact matches"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"zero"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"one"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"two"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"few"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"many"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"other"}]},{"type":"text","value":" - they're different for each language, so,"}]}]},{"type":"element","tag":"code","props":{"code":"{\n \"id\": \"{Count} butterflies\",\n \"message\": \"{Count} butterflies\",\n \"translation\": {\n \"select\": {\n \"feature\": \"plural\",\n \"arg\": \"Count\",\n \"cases\": {\n \"one\": {\n \"msg\": \"{Count} бабочка\"\n },\n \"few\": {\n \"msg\": \"{Count} бабочки\"\n },\n \"many\": {\n \"msg\": \"{Count} бабочек\"\n },\n \"other\": {\n \"msg\": \"{Count} бабочуль\"\n }\n }\n }\n },\n \"placeholders\": [\n {\n \"id\": \"Count\",\n \"string\": \"%[1]d\",\n \"type\": \"int\",\n \"underlyingType\": \"int\",\n \"argNum\": 1,\n \"expr\": \"count\"\n }\n ]\n},\n","language":"json"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"{\n \"id\": \"{Count} butterflies\",\n \"message\": \"{Count} butterflies\",\n \"translation\": {\n \"select\": {\n \"feature\": \"plural\",\n \"arg\": \"Count\",\n \"cases\": {\n \"one\": {\n \"msg\": \"{Count} бабочка\"\n },\n \"few\": {\n \"msg\": \"{Count} бабочки\"\n },\n \"many\": {\n \"msg\": \"{Count} бабочек\"\n },\n \"other\": {\n \"msg\": \"{Count} бабочуль\"\n }\n }\n }\n },\n \"placeholders\": [\n {\n \"id\": \"Count\",\n \"string\": \"%[1]d\",\n \"type\": \"int\",\n \"underlyingType\": \"int\",\n \"argNum\": 1,\n \"expr\": \"count\"\n }\n ]\n},\n"}]}]}]},{"type":"element","tag":"h4","props":{"id":"using-go-generate"},"children":[{"type":"text","value":"Using go-generate"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Write this at some "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".go"}]},{"type":"text","value":" file:"}]},{"type":"element","tag":"code","props":{"code":"//go:generate gotext -srclang=en-GB update -out=translations.go -lang=ru-RU github.com/muerwre/vault-golang/internal/api\n","language":"go"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"//go:generate gotext -srclang=en-GB update -out=translations.go -lang=ru-RU github.com/muerwre/vault-golang/internal/api\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run go generation:"}]},{"type":"element","tag":"code","props":{"code":"go generate ./...\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"go generate ./...\n"}]}]}]},{"type":"element","tag":"h4","props":{"id":"useful-links"},"children":[{"type":"text","value":"Useful links"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/golang/text/blob/master/feature/plural/gen_common.go#L19","rel":["nofollow"]},"children":[{"type":"text","value":"All available forms in this .go file"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://community.crowdin.com/t/plurals-in-gotext-json-files/600","rel":["nofollow"]},"children":[{"type":"text","value":"Answer, that solved it for me"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There are no good examples of "},{"type":"element","tag":"a","props":{"href":"https://golang.org/x/text","rel":["nofollow"]},"children":[{"type":"text","value":"golang.org/x/text"}]},{"type":"text","value":" uses and description of how pluralization made. So, this is it."}]},{"type":"element","tag":"h4","props":{"id":"generating-translations"},"children":[{"type":"text","value":"Generating translations"}]},{"type":"element","tag":"blockquote","props":{},"children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should specify valid "},{"type":"element","tag":"a","props":{"href":"https://www.iso.org/obp/ui/#iso:code:3166","rel":["nofollow"]},"children":[{"type":"text","value":"ISO-3166 locale code"}]},{"type":"text","value":" to get plurals working!"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Write your code:"}]},{"type":"element","tag":"code","props":{"code":"import (\n \"golang.org/x/text/language\"\n \"golang.org/x/text/message\"\n)\n\nlang := language.MustParse('ru-RU')\nprinter := message.NewPrinter(lang)\n\ncount := 1\nprinter.Sprintf(\"%d butterflies\", count)\n","language":"go"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-806f41"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7c633d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1fc9ae"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-ba0dbd"},"children":[{"type":"text","value":"golang.org/x/text/language"}]},{"type":"element","tag":"span","props":{"class":"ct-1fc9ae"},"children":[{"type":"text","value":"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7c633d"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1fc9ae"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-ba0dbd"},"children":[{"type":"text","value":"golang.org/x/text/message"}]},{"type":"element","tag":"span","props":{"class":"ct-1fc9ae"},"children":[{"type":"text","value":"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f1cd32"},"children":[{"type":"text","value":"lang"}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-806f41"},"children":[{"type":"text","value":":="}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" language."}]},{"type":"element","tag":"span","props":{"class":"ct-843391"},"children":[{"type":"text","value":"MustParse"}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"'"}]},{"type":"element","tag":"span","props":{"class":"ct-9e0b55"},"children":[{"type":"text","value":"ru-RU"}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"'"}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f1cd32"},"children":[{"type":"text","value":"printer"}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-806f41"},"children":[{"type":"text","value":":="}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" message."}]},{"type":"element","tag":"span","props":{"class":"ct-843391"},"children":[{"type":"text","value":"NewPrinter"}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":"(lang)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f1cd32"},"children":[{"type":"text","value":"count"}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-806f41"},"children":[{"type":"text","value":":="}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-edb491"},"children":[{"type":"text","value":"1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":"printer."}]},{"type":"element","tag":"span","props":{"class":"ct-843391"},"children":[{"type":"text","value":"Sprintf"}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-f0c8ef"},"children":[{"type":"text","value":"%d"}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":" butterflies\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":", count)"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run generator for your locale (mine is "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"ru-RU"}]},{"type":"text","value":"):"}]},{"type":"element","tag":"code","props":{"code":"gotext -srclang=en-GB update -lang=ru-RU \\\n -out=translations.go github.com/path/to-output-folder\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":"gotext -srclang=en-GB update -lang=ru-RU \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" -out=translations.go github.com/path/to-output-folder"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This will generate "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"out.gotext.json"}]},{"type":"text","value":" in "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/path/to-output-folder/ru-RU"}]},{"type":"text","value":" of your project. Copy it to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"messages.out.json"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h4","props":{"id":"translating-and-adding-plural-forms"},"children":[{"type":"text","value":"Translating and adding plural forms"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"\"translation\""}]},{"type":"text","value":" value in generated "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"messages.gotext.json"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"string"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"object"}]},{"type":"text","value":" of the form shown below if you want pluralize strings, "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"then run gotext command again"}]},{"type":"text","value":", it will generate "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".go files with translations"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"According to "},{"type":"element","tag":"a","props":{"href":"https://github.com/golang/text/blob/master/feature/plural/gen_common.go#L19","rel":["nofollow"]},"children":[{"type":"text","value":"source files of gen_common"}]},{"type":"text","value":", there's a couple of forms:"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"=N"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"!=N"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"%N"}]},{"type":"text","value":" for exact matches"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"zero"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"one"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"two"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"few"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"many"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"other"}]},{"type":"text","value":" - they're different for each language, so,"}]}]},{"type":"element","tag":"code","props":{"code":"{\n \"id\": \"{Count} butterflies\",\n \"message\": \"{Count} butterflies\",\n \"translation\": {\n \"select\": {\n \"feature\": \"plural\",\n \"arg\": \"Count\",\n \"cases\": {\n \"one\": {\n \"msg\": \"{Count} бабочка\"\n },\n \"few\": {\n \"msg\": \"{Count} бабочки\"\n },\n \"many\": {\n \"msg\": \"{Count} бабочек\"\n },\n \"other\": {\n \"msg\": \"{Count} бабочуль\"\n }\n }\n }\n },\n \"placeholders\": [\n {\n \"id\": \"Count\",\n \"string\": \"%[1]d\",\n \"type\": \"int\",\n \"underlyingType\": \"int\",\n \"argNum\": 1,\n \"expr\": \"count\"\n }\n ]\n},\n","language":"json"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"id\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"{Count} butterflies\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"message\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"{Count} butterflies\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"translation\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"select\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"feature\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"plural\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"arg\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"Count\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"cases\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"one\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"{Count} бабочка\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"few\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"{Count} бабочки\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"many\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"{Count} бабочек\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"other\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"{Count} бабочуль\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"placeholders\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"id\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"Count\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"string\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"%[1]d\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"type\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"int\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"underlyingType\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"int\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"argNum\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-edb491"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ba7775"},"children":[{"type":"text","value":"\"expr\""}]},{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-c4c559"},"children":[{"type":"text","value":"\"count\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":" ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":"},"}]}]}]}]}]},{"type":"element","tag":"h4","props":{"id":"using-go-generate"},"children":[{"type":"text","value":"Using go-generate"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Write this at some "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".go"}]},{"type":"text","value":" file:"}]},{"type":"element","tag":"code","props":{"code":"//go:generate gotext -srclang=en-GB update -out=translations.go -lang=ru-RU github.com/muerwre/vault-golang/internal/api\n","language":"go"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7f7448"},"children":[{"type":"text","value":"//go:generate gotext -srclang=en-GB update -out=translations.go -lang=ru-RU github.com/muerwre/vault-golang/internal/api"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run go generation:"}]},{"type":"element","tag":"code","props":{"code":"go generate ./...\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4e9498"},"children":[{"type":"text","value":"go generate ./..."}]}]}]}]}]},{"type":"element","tag":"h4","props":{"id":"useful-links"},"children":[{"type":"text","value":"Useful links"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/golang/text/blob/master/feature/plural/gen_common.go#L19","rel":["nofollow"]},"children":[{"type":"text","value":"All available forms in this .go file"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://community.crowdin.com/t/plurals-in-gotext-json-files/600","rel":["nofollow"]},"children":[{"type":"text","value":"Answer, that solved it for me"}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-7f7448{color:#8B949E}.ct-ba7775{color:#79C0FF}.ct-f0c8ef{color:#79C0FF}.ct-edb491{color:#79C0FF}.ct-9e0b55{color:#FFA198}.ct-c4c559{color:#A5D6FF}.ct-843391{color:#79C0FF}.ct-f1cd32{color:#C9D1D9}.ct-ba0dbd{color:#FFA657}.ct-1fc9ae{color:#A5D6FF}.ct-7c633d{color:#C9D1D9}.ct-4e9498{color:#C9D1D9}.ct-806f41{color:#FF7B72}.light .ct-806f41{color:#859900}.light .ct-4e9498{color:#657B83}.light .ct-7c633d{color:#657B83}.light .ct-1fc9ae{color:#2AA198}.light .ct-ba0dbd{color:#2AA198}.light .ct-f1cd32{color:#268BD2}.light .ct-843391{color:#268BD2}.light .ct-c4c559{color:#2AA198}.light .ct-9e0b55{color:#CD3131}.light .ct-edb491{color:#D33682}.light .ct-f0c8ef{color:#CB4B16}.light .ct-ba7775{color:#859900}.light .ct-7f7448{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Golang:i18n in golang.md","_source":"content","_file":"Golang/i18n in golang.md","_extension":"md"} \ No newline at end of file +{"_path":"/golang/i18n-in-golang","_dir":"golang","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"I18n In Golang","description":"There are no good examples of golang.org/x/text uses and description of how pluralization made. So, this is it.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There are no good examples of "},{"type":"element","tag":"a","props":{"href":"https://golang.org/x/text","rel":["nofollow"]},"children":[{"type":"text","value":"golang.org/x/text"}]},{"type":"text","value":" uses and description of how pluralization made. So, this is it."}]},{"type":"element","tag":"h4","props":{"id":"generating-translations"},"children":[{"type":"text","value":"Generating translations"}]},{"type":"element","tag":"blockquote","props":{},"children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should specify valid "},{"type":"element","tag":"a","props":{"href":"https://www.iso.org/obp/ui/#iso:code:3166","rel":["nofollow"]},"children":[{"type":"text","value":"ISO-3166 locale code"}]},{"type":"text","value":" to get plurals working!"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Write your code:"}]},{"type":"element","tag":"code","props":{"code":"import (\n \"golang.org/x/text/language\"\n \"golang.org/x/text/message\"\n)\n\nlang := language.MustParse('ru-RU')\nprinter := message.NewPrinter(lang)\n\ncount := 1\nprinter.Sprintf(\"%d butterflies\", count)\n","language":"go"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import (\n \"golang.org/x/text/language\"\n \"golang.org/x/text/message\"\n)\n\nlang := language.MustParse('ru-RU')\nprinter := message.NewPrinter(lang)\n\ncount := 1\nprinter.Sprintf(\"%d butterflies\", count)\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run generator for your locale (mine is "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"ru-RU"}]},{"type":"text","value":"):"}]},{"type":"element","tag":"code","props":{"code":"gotext -srclang=en-GB update -lang=ru-RU \\\n -out=translations.go github.com/path/to-output-folder\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"gotext -srclang=en-GB update -lang=ru-RU \\\n -out=translations.go github.com/path/to-output-folder\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This will generate "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"out.gotext.json"}]},{"type":"text","value":" in "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/path/to-output-folder/ru-RU"}]},{"type":"text","value":" of your project. Copy it to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"messages.out.json"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h4","props":{"id":"translating-and-adding-plural-forms"},"children":[{"type":"text","value":"Translating and adding plural forms"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"\"translation\""}]},{"type":"text","value":" value in generated "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"messages.gotext.json"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"string"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"object"}]},{"type":"text","value":" of the form shown below if you want pluralize strings, "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"then run gotext command again"}]},{"type":"text","value":", it will generate "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".go files with translations"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"According to "},{"type":"element","tag":"a","props":{"href":"https://github.com/golang/text/blob/master/feature/plural/gen_common.go#L19","rel":["nofollow"]},"children":[{"type":"text","value":"source files of gen_common"}]},{"type":"text","value":", there's a couple of forms:"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"=N"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"!=N"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"%N"}]},{"type":"text","value":" for exact matches"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"zero"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"one"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"two"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"few"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"many"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"other"}]},{"type":"text","value":" - they're different for each language, so,"}]}]},{"type":"element","tag":"code","props":{"code":"{\n \"id\": \"{Count} butterflies\",\n \"message\": \"{Count} butterflies\",\n \"translation\": {\n \"select\": {\n \"feature\": \"plural\",\n \"arg\": \"Count\",\n \"cases\": {\n \"one\": {\n \"msg\": \"{Count} бабочка\"\n },\n \"few\": {\n \"msg\": \"{Count} бабочки\"\n },\n \"many\": {\n \"msg\": \"{Count} бабочек\"\n },\n \"other\": {\n \"msg\": \"{Count} бабочуль\"\n }\n }\n }\n },\n \"placeholders\": [\n {\n \"id\": \"Count\",\n \"string\": \"%[1]d\",\n \"type\": \"int\",\n \"underlyingType\": \"int\",\n \"argNum\": 1,\n \"expr\": \"count\"\n }\n ]\n},\n","language":"json"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"{\n \"id\": \"{Count} butterflies\",\n \"message\": \"{Count} butterflies\",\n \"translation\": {\n \"select\": {\n \"feature\": \"plural\",\n \"arg\": \"Count\",\n \"cases\": {\n \"one\": {\n \"msg\": \"{Count} бабочка\"\n },\n \"few\": {\n \"msg\": \"{Count} бабочки\"\n },\n \"many\": {\n \"msg\": \"{Count} бабочек\"\n },\n \"other\": {\n \"msg\": \"{Count} бабочуль\"\n }\n }\n }\n },\n \"placeholders\": [\n {\n \"id\": \"Count\",\n \"string\": \"%[1]d\",\n \"type\": \"int\",\n \"underlyingType\": \"int\",\n \"argNum\": 1,\n \"expr\": \"count\"\n }\n ]\n},\n"}]}]}]},{"type":"element","tag":"h4","props":{"id":"using-go-generate"},"children":[{"type":"text","value":"Using go-generate"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Write this at some "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".go"}]},{"type":"text","value":" file:"}]},{"type":"element","tag":"code","props":{"code":"//go:generate gotext -srclang=en-GB update -out=translations.go -lang=ru-RU github.com/muerwre/vault-golang/internal/api\n","language":"go"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"//go:generate gotext -srclang=en-GB update -out=translations.go -lang=ru-RU github.com/muerwre/vault-golang/internal/api\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run go generation:"}]},{"type":"element","tag":"code","props":{"code":"go generate ./...\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"go generate ./...\n"}]}]}]},{"type":"element","tag":"h4","props":{"id":"useful-links"},"children":[{"type":"text","value":"Useful links"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/golang/text/blob/master/feature/plural/gen_common.go#L19","rel":["nofollow"]},"children":[{"type":"text","value":"All available forms in this .go file"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://community.crowdin.com/t/plurals-in-gotext-json-files/600","rel":["nofollow"]},"children":[{"type":"text","value":"Answer, that solved it for me"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There are no good examples of "},{"type":"element","tag":"a","props":{"href":"https://golang.org/x/text","rel":["nofollow"]},"children":[{"type":"text","value":"golang.org/x/text"}]},{"type":"text","value":" uses and description of how pluralization made. So, this is it."}]},{"type":"element","tag":"h4","props":{"id":"generating-translations"},"children":[{"type":"text","value":"Generating translations"}]},{"type":"element","tag":"blockquote","props":{},"children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should specify valid "},{"type":"element","tag":"a","props":{"href":"https://www.iso.org/obp/ui/#iso:code:3166","rel":["nofollow"]},"children":[{"type":"text","value":"ISO-3166 locale code"}]},{"type":"text","value":" to get plurals working!"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Write your code:"}]},{"type":"element","tag":"code","props":{"code":"import (\n \"golang.org/x/text/language\"\n \"golang.org/x/text/message\"\n)\n\nlang := language.MustParse('ru-RU')\nprinter := message.NewPrinter(lang)\n\ncount := 1\nprinter.Sprintf(\"%d butterflies\", count)\n","language":"go"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e01c71"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3d6772"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d19b58"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-906b3a"},"children":[{"type":"text","value":"golang.org/x/text/language"}]},{"type":"element","tag":"span","props":{"class":"ct-d19b58"},"children":[{"type":"text","value":"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3d6772"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d19b58"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-906b3a"},"children":[{"type":"text","value":"golang.org/x/text/message"}]},{"type":"element","tag":"span","props":{"class":"ct-d19b58"},"children":[{"type":"text","value":"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b05caf"},"children":[{"type":"text","value":"lang"}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e01c71"},"children":[{"type":"text","value":":="}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" language."}]},{"type":"element","tag":"span","props":{"class":"ct-52b090"},"children":[{"type":"text","value":"MustParse"}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"'"}]},{"type":"element","tag":"span","props":{"class":"ct-601b0e"},"children":[{"type":"text","value":"ru-RU"}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"'"}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b05caf"},"children":[{"type":"text","value":"printer"}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e01c71"},"children":[{"type":"text","value":":="}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" message."}]},{"type":"element","tag":"span","props":{"class":"ct-52b090"},"children":[{"type":"text","value":"NewPrinter"}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":"(lang)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b05caf"},"children":[{"type":"text","value":"count"}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e01c71"},"children":[{"type":"text","value":":="}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-888095"},"children":[{"type":"text","value":"1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":"printer."}]},{"type":"element","tag":"span","props":{"class":"ct-52b090"},"children":[{"type":"text","value":"Sprintf"}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-37236e"},"children":[{"type":"text","value":"%d"}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":" butterflies\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":", count)"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run generator for your locale (mine is "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"ru-RU"}]},{"type":"text","value":"):"}]},{"type":"element","tag":"code","props":{"code":"gotext -srclang=en-GB update -lang=ru-RU \\\n -out=translations.go github.com/path/to-output-folder\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":"gotext -srclang=en-GB update -lang=ru-RU \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" -out=translations.go github.com/path/to-output-folder"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This will generate "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"out.gotext.json"}]},{"type":"text","value":" in "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/path/to-output-folder/ru-RU"}]},{"type":"text","value":" of your project. Copy it to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"messages.out.json"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h4","props":{"id":"translating-and-adding-plural-forms"},"children":[{"type":"text","value":"Translating and adding plural forms"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"\"translation\""}]},{"type":"text","value":" value in generated "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"messages.gotext.json"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"string"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"object"}]},{"type":"text","value":" of the form shown below if you want pluralize strings, "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"then run gotext command again"}]},{"type":"text","value":", it will generate "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".go files with translations"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"According to "},{"type":"element","tag":"a","props":{"href":"https://github.com/golang/text/blob/master/feature/plural/gen_common.go#L19","rel":["nofollow"]},"children":[{"type":"text","value":"source files of gen_common"}]},{"type":"text","value":", there's a couple of forms:"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"=N"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"!=N"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"%N"}]},{"type":"text","value":" for exact matches"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"zero"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"one"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"two"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"few"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"many"}]},{"type":"text","value":" | "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"other"}]},{"type":"text","value":" - they're different for each language, so,"}]}]},{"type":"element","tag":"code","props":{"code":"{\n \"id\": \"{Count} butterflies\",\n \"message\": \"{Count} butterflies\",\n \"translation\": {\n \"select\": {\n \"feature\": \"plural\",\n \"arg\": \"Count\",\n \"cases\": {\n \"one\": {\n \"msg\": \"{Count} бабочка\"\n },\n \"few\": {\n \"msg\": \"{Count} бабочки\"\n },\n \"many\": {\n \"msg\": \"{Count} бабочек\"\n },\n \"other\": {\n \"msg\": \"{Count} бабочуль\"\n }\n }\n }\n },\n \"placeholders\": [\n {\n \"id\": \"Count\",\n \"string\": \"%[1]d\",\n \"type\": \"int\",\n \"underlyingType\": \"int\",\n \"argNum\": 1,\n \"expr\": \"count\"\n }\n ]\n},\n","language":"json"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"id\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"{Count} butterflies\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"message\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"{Count} butterflies\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"translation\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"select\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"feature\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"plural\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"arg\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"Count\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"cases\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"one\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"{Count} бабочка\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"few\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"{Count} бабочки\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"many\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"{Count} бабочек\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"other\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"msg\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"{Count} бабочуль\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"placeholders\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"id\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"Count\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"string\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"%[1]d\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"type\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"int\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"underlyingType\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"int\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"argNum\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-888095"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f85543"},"children":[{"type":"text","value":"\"expr\""}]},{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-671abd"},"children":[{"type":"text","value":"\"count\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":" ]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":"},"}]}]}]}]}]},{"type":"element","tag":"h4","props":{"id":"using-go-generate"},"children":[{"type":"text","value":"Using go-generate"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Write this at some "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".go"}]},{"type":"text","value":" file:"}]},{"type":"element","tag":"code","props":{"code":"//go:generate gotext -srclang=en-GB update -out=translations.go -lang=ru-RU github.com/muerwre/vault-golang/internal/api\n","language":"go"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a3abcc"},"children":[{"type":"text","value":"//go:generate gotext -srclang=en-GB update -out=translations.go -lang=ru-RU github.com/muerwre/vault-golang/internal/api"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then run go generation:"}]},{"type":"element","tag":"code","props":{"code":"go generate ./...\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c9d8e7"},"children":[{"type":"text","value":"go generate ./..."}]}]}]}]}]},{"type":"element","tag":"h4","props":{"id":"useful-links"},"children":[{"type":"text","value":"Useful links"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.com/golang/text/blob/master/feature/plural/gen_common.go#L19","rel":["nofollow"]},"children":[{"type":"text","value":"All available forms in this .go file"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://community.crowdin.com/t/plurals-in-gotext-json-files/600","rel":["nofollow"]},"children":[{"type":"text","value":"Answer, that solved it for me"}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-a3abcc{color:#8B949E}.ct-f85543{color:#79C0FF}.ct-37236e{color:#79C0FF}.ct-888095{color:#79C0FF}.ct-601b0e{color:#FFA198}.ct-671abd{color:#A5D6FF}.ct-52b090{color:#79C0FF}.ct-b05caf{color:#C9D1D9}.ct-906b3a{color:#FFA657}.ct-d19b58{color:#A5D6FF}.ct-3d6772{color:#C9D1D9}.ct-c9d8e7{color:#C9D1D9}.ct-e01c71{color:#FF7B72}.light .ct-e01c71{color:#859900}.light .ct-c9d8e7{color:#657B83}.light .ct-3d6772{color:#657B83}.light .ct-d19b58{color:#2AA198}.light .ct-906b3a{color:#2AA198}.light .ct-b05caf{color:#268BD2}.light .ct-52b090{color:#268BD2}.light .ct-671abd{color:#2AA198}.light .ct-601b0e{color:#CD3131}.light .ct-888095{color:#D33682}.light .ct-37236e{color:#CB4B16}.light .ct-f85543{color:#859900}.light .ct-a3abcc{color:#93A1A1}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Golang:i18n in golang.md","_source":"content","_file":"Golang/i18n in golang.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/gviYR2nAXj.json b/docs/api/_content/query/gviYR2nAXj.json index d15a7c9..c17b5d9 100644 --- a/docs/api/_content/query/gviYR2nAXj.json +++ b/docs/api/_content/query/gviYR2nAXj.json @@ -1 +1 @@ -{"_path":"/linux/gitea-for-git-hosting","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Gitea For Git Hosting","description":"Self-hosted #git repositories with gitea and #docker.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Self-hosted #git repositories with "},{"type":"element","tag":"a","props":{"href":"https://gitea.io/ru-ru/","rel":["nofollow"]},"children":[{"type":"text","value":"gitea"}]},{"type":"text","value":" and #docker."}]},{"type":"element","tag":"h2","props":{"id":"setting-up-with-docker-compose"},"children":[{"type":"text","value":"Setting up with docker-compose"}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nnetworks:\n gitea:\n external: false\nservices:\n server:\n image: gitea/gitea:latest\n container_name: gitea\n environment:\n - USER_UID=1000\n - USER_GID=1000\n restart: always\n networks:\n - gitea\n volumes:\n - ./var/lib/gitea:/data\n - ./etc/gitea:/etc/gitea\n - /etc/timezone:/etc/timezone:ro\n - /etc/localtime:/etc/localtime:ro\n ports:\n - \"3000:3000\"\n - \"222:22\"\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: \"3\"\n\nnetworks:\n gitea:\n external: false\nservices:\n server:\n image: gitea/gitea:latest\n container_name: gitea\n environment:\n - USER_UID=1000\n - USER_GID=1000\n restart: always\n networks:\n - gitea\n volumes:\n - ./var/lib/gitea:/data\n - ./etc/gitea:/etc/gitea\n - /etc/timezone:/etc/timezone:ro\n - /etc/localtime:/etc/localtime:ro\n ports:\n - \"3000:3000\"\n - \"222:22\"\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Self-hosted #git repositories with "},{"type":"element","tag":"a","props":{"href":"https://gitea.io/ru-ru/","rel":["nofollow"]},"children":[{"type":"text","value":"gitea"}]},{"type":"text","value":" and #docker."}]},{"type":"element","tag":"h2","props":{"id":"setting-up-with-docker-compose"},"children":[{"type":"text","value":"Setting up with docker-compose"}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nnetworks:\n gitea:\n external: false\nservices:\n server:\n image: gitea/gitea:latest\n container_name: gitea\n environment:\n - USER_UID=1000\n - USER_GID=1000\n restart: always\n networks:\n - gitea\n volumes:\n - ./var/lib/gitea:/data\n - ./etc/gitea:/etc/gitea\n - /etc/timezone:/etc/timezone:ro\n - /etc/localtime:/etc/localtime:ro\n ports:\n - \"3000:3000\"\n - \"222:22\"\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"\"3\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"gitea"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"external"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-9f6859"},"children":[{"type":"text","value":"false"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"gitea/gitea:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"gitea"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"USER_UID=1000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"USER_GID=1000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"gitea"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"./var/lib/gitea:/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"./etc/gitea:/etc/gitea"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"/etc/timezone:/etc/timezone:ro"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"/etc/localtime:/etc/localtime:ro"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-03701d"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"\"3000:3000\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d2407a"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-fb340e"},"children":[{"type":"text","value":"\"222:22\""}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-9f6859{color:#79C0FF}.ct-fb340e{color:#A5D6FF}.ct-d2407a{color:#C9D1D9}.ct-03701d{color:#7EE787}.light .ct-03701d{color:#268BD2}.light .ct-d2407a{color:#657B83}.light .ct-fb340e{color:#2AA198}.light .ct-9f6859{color:#B58900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"setting-up-with-docker-compose","depth":2,"text":"Setting up with docker-compose"}]}},"_type":"markdown","_id":"content:Linux:Gitea for git hosting.md","_source":"content","_file":"Linux/Gitea for git hosting.md","_extension":"md"} \ No newline at end of file +{"_path":"/linux/gitea-for-git-hosting","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Gitea For Git Hosting","description":"Self-hosted #git repositories with gitea and #docker.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Self-hosted #git repositories with "},{"type":"element","tag":"a","props":{"href":"https://gitea.io/ru-ru/","rel":["nofollow"]},"children":[{"type":"text","value":"gitea"}]},{"type":"text","value":" and #docker."}]},{"type":"element","tag":"h2","props":{"id":"setting-up-with-docker-compose"},"children":[{"type":"text","value":"Setting up with docker-compose"}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nnetworks:\n gitea:\n external: false\nservices:\n server:\n image: gitea/gitea:latest\n container_name: gitea\n environment:\n - USER_UID=1000\n - USER_GID=1000\n restart: always\n networks:\n - gitea\n volumes:\n - ./var/lib/gitea:/data\n - ./etc/gitea:/etc/gitea\n - /etc/timezone:/etc/timezone:ro\n - /etc/localtime:/etc/localtime:ro\n ports:\n - \"3000:3000\"\n - \"222:22\"\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: \"3\"\n\nnetworks:\n gitea:\n external: false\nservices:\n server:\n image: gitea/gitea:latest\n container_name: gitea\n environment:\n - USER_UID=1000\n - USER_GID=1000\n restart: always\n networks:\n - gitea\n volumes:\n - ./var/lib/gitea:/data\n - ./etc/gitea:/etc/gitea\n - /etc/timezone:/etc/timezone:ro\n - /etc/localtime:/etc/localtime:ro\n ports:\n - \"3000:3000\"\n - \"222:22\"\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Self-hosted #git repositories with "},{"type":"element","tag":"a","props":{"href":"https://gitea.io/ru-ru/","rel":["nofollow"]},"children":[{"type":"text","value":"gitea"}]},{"type":"text","value":" and #docker."}]},{"type":"element","tag":"h2","props":{"id":"setting-up-with-docker-compose"},"children":[{"type":"text","value":"Setting up with docker-compose"}]},{"type":"element","tag":"code","props":{"code":"version: \"3\"\n\nnetworks:\n gitea:\n external: false\nservices:\n server:\n image: gitea/gitea:latest\n container_name: gitea\n environment:\n - USER_UID=1000\n - USER_GID=1000\n restart: always\n networks:\n - gitea\n volumes:\n - ./var/lib/gitea:/data\n - ./etc/gitea:/etc/gitea\n - /etc/timezone:/etc/timezone:ro\n - /etc/localtime:/etc/localtime:ro\n ports:\n - \"3000:3000\"\n - \"222:22\"\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"\"3\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"gitea"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"external"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-6e94ca"},"children":[{"type":"text","value":"false"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"server"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"gitea/gitea:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"gitea"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"USER_UID=1000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"USER_GID=1000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"always"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"gitea"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"./var/lib/gitea:/data"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"./etc/gitea:/etc/gitea"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"/etc/timezone:/etc/timezone:ro"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"/etc/localtime:/etc/localtime:ro"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-38d0af"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"\"3000:3000\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6227ac"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-09000e"},"children":[{"type":"text","value":"\"222:22\""}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-6e94ca{color:#79C0FF}.ct-09000e{color:#A5D6FF}.ct-6227ac{color:#C9D1D9}.ct-38d0af{color:#7EE787}.light .ct-38d0af{color:#268BD2}.light .ct-6227ac{color:#657B83}.light .ct-09000e{color:#2AA198}.light .ct-6e94ca{color:#B58900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"setting-up-with-docker-compose","depth":2,"text":"Setting up with docker-compose"}]}},"_type":"markdown","_id":"content:Linux:Gitea for git hosting.md","_source":"content","_file":"Linux/Gitea for git hosting.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/iZIUw8pCoM.json b/docs/api/_content/query/iZIUw8pCoM.json index f8d6030..f818073 100644 --- a/docs/api/_content/query/iZIUw8pCoM.json +++ b/docs/api/_content/query/iZIUw8pCoM.json @@ -1 +1 @@ -{"_path":"/typescript/type-guards","_dir":"typescript","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Type Guards","description":"Useful for type checking at compile and run time:","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful for type checking at compile and run time:"}]},{"type":"element","tag":"code","props":{"code":"function isFish(pet: Fish | Bird): pet is Fish {\n return (pet as Fish).swim !== undefined;\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"function isFish(pet: Fish | Bird): pet is Fish {\n return (pet as Fish).swim !== undefined;\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Usage:"}]},{"type":"element","tag":"code","props":{"code":"const pet = getSmallPet();\n \nif (isFish(pet)) {\n pet.swim();\n} else {\n pet.fly();\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const pet = getSmallPet();\n \nif (isFish(pet)) {\n pet.swim();\n} else {\n pet.fly();\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful for type checking at compile and run time:"}]},{"type":"element","tag":"code","props":{"code":"function isFish(pet: Fish | Bird): pet is Fish {\n return (pet as Fish).swim !== undefined;\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-71cb22"},"children":[{"type":"text","value":"function"}]},{"type":"element","tag":"span","props":{"class":"ct-d53be9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f7117e"},"children":[{"type":"text","value":"isFish"}]},{"type":"element","tag":"span","props":{"class":"ct-d53be9"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-193554"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-1b4c73"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-d53be9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ec387d"},"children":[{"type":"text","value":"Fish"}]},{"type":"element","tag":"span","props":{"class":"ct-d53be9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1b4c73"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-d53be9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ec387d"},"children":[{"type":"text","value":"Bird"}]},{"type":"element","tag":"span","props":{"class":"ct-d53be9"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-1b4c73"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-d53be9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-193554"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-d53be9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1b4c73"},"children":[{"type":"text","value":"is"}]},{"type":"element","tag":"span","props":{"class":"ct-d53be9"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ec387d"},"children":[{"type":"text","value":"Fish"}]},{"type":"element","tag":"span","props":{"class":"ct-d53be9"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2ee476"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-c6422e"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2ee476"},"children":[{"type":"text","value":"as"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c38f96"},"children":[{"type":"text","value":"Fish"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-c6422e"},"children":[{"type":"text","value":"swim"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2ee476"},"children":[{"type":"text","value":"!=="}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bdc00b"},"children":[{"type":"text","value":"undefined"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Usage:"}]},{"type":"element","tag":"code","props":{"code":"const pet = getSmallPet();\n \nif (isFish(pet)) {\n pet.swim();\n} else {\n pet.fly();\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-94eca3"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-825d9d"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2ee476"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-168a18"},"children":[{"type":"text","value":"getSmallPet"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2ee476"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-168a18"},"children":[{"type":"text","value":"isFish"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c6422e"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6422e"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-168a18"},"children":[{"type":"text","value":"swim"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":"} "}]},{"type":"element","tag":"span","props":{"class":"ct-2ee476"},"children":[{"type":"text","value":"else"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6422e"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-168a18"},"children":[{"type":"text","value":"fly"}]},{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b77be2"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-168a18{color:#D2A8FF}.ct-825d9d{color:#79C0FF}.ct-94eca3{color:#FF7B72}.ct-bdc00b{color:#79C0FF}.ct-c38f96{color:#FFA657}.ct-c6422e{color:#C9D1D9}.ct-2ee476{color:#FF7B72}.ct-b77be2{color:#C9D1D9}.ct-ec387d{color:#FFA657}.ct-1b4c73{color:#FF7B72}.ct-193554{color:#FFA657}.ct-f7117e{color:#D2A8FF}.ct-d53be9{color:#C9D1D9}.ct-71cb22{color:#FF7B72}.light .ct-71cb22{color:#073642}.light .ct-d53be9{color:#657B83}.light .ct-f7117e{color:#268BD2}.light .ct-193554{color:#657B83}.light .ct-1b4c73{color:#859900}.light .ct-ec387d{color:#268BD2}.light .ct-b77be2{color:#657B83}.light .ct-2ee476{color:#859900}.light .ct-c6422e{color:#268BD2}.light .ct-c38f96{color:#268BD2}.light .ct-bdc00b{color:#B58900}.light .ct-94eca3{color:#073642}.light .ct-825d9d{color:#268BD2}.light .ct-168a18{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Typescript:Type guards.md","_source":"content","_file":"Typescript/Type guards.md","_extension":"md"} \ No newline at end of file +{"_path":"/typescript/type-guards","_dir":"typescript","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Type Guards","description":"Useful for type checking at compile and run time:","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful for type checking at compile and run time:"}]},{"type":"element","tag":"code","props":{"code":"function isFish(pet: Fish | Bird): pet is Fish {\n return (pet as Fish).swim !== undefined;\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"function isFish(pet: Fish | Bird): pet is Fish {\n return (pet as Fish).swim !== undefined;\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Usage:"}]},{"type":"element","tag":"code","props":{"code":"const pet = getSmallPet();\n \nif (isFish(pet)) {\n pet.swim();\n} else {\n pet.fly();\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const pet = getSmallPet();\n \nif (isFish(pet)) {\n pet.swim();\n} else {\n pet.fly();\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Useful for type checking at compile and run time:"}]},{"type":"element","tag":"code","props":{"code":"function isFish(pet: Fish | Bird): pet is Fish {\n return (pet as Fish).swim !== undefined;\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5996ab"},"children":[{"type":"text","value":"function"}]},{"type":"element","tag":"span","props":{"class":"ct-18ca61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-85d161"},"children":[{"type":"text","value":"isFish"}]},{"type":"element","tag":"span","props":{"class":"ct-18ca61"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-373e6c"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-1b2855"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-18ca61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90ecad"},"children":[{"type":"text","value":"Fish"}]},{"type":"element","tag":"span","props":{"class":"ct-18ca61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1b2855"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-18ca61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90ecad"},"children":[{"type":"text","value":"Bird"}]},{"type":"element","tag":"span","props":{"class":"ct-18ca61"},"children":[{"type":"text","value":")"}]},{"type":"element","tag":"span","props":{"class":"ct-1b2855"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-18ca61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-373e6c"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-18ca61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1b2855"},"children":[{"type":"text","value":"is"}]},{"type":"element","tag":"span","props":{"class":"ct-18ca61"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-90ecad"},"children":[{"type":"text","value":"Fish"}]},{"type":"element","tag":"span","props":{"class":"ct-18ca61"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5abcba"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-e53464"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5abcba"},"children":[{"type":"text","value":"as"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a9a5e4"},"children":[{"type":"text","value":"Fish"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-e53464"},"children":[{"type":"text","value":"swim"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5abcba"},"children":[{"type":"text","value":"!=="}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6f9810"},"children":[{"type":"text","value":"undefined"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Usage:"}]},{"type":"element","tag":"code","props":{"code":"const pet = getSmallPet();\n \nif (isFish(pet)) {\n pet.swim();\n} else {\n pet.fly();\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3ecc1d"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-38cc9e"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5abcba"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6baa9"},"children":[{"type":"text","value":"getSmallPet"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5abcba"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-c6baa9"},"children":[{"type":"text","value":"isFish"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-e53464"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e53464"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c6baa9"},"children":[{"type":"text","value":"swim"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":"} "}]},{"type":"element","tag":"span","props":{"class":"ct-5abcba"},"children":[{"type":"text","value":"else"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e53464"},"children":[{"type":"text","value":"pet"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-c6baa9"},"children":[{"type":"text","value":"fly"}]},{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-812250"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-c6baa9{color:#D2A8FF}.ct-38cc9e{color:#79C0FF}.ct-3ecc1d{color:#FF7B72}.ct-6f9810{color:#79C0FF}.ct-a9a5e4{color:#FFA657}.ct-e53464{color:#C9D1D9}.ct-5abcba{color:#FF7B72}.ct-812250{color:#C9D1D9}.ct-90ecad{color:#FFA657}.ct-1b2855{color:#FF7B72}.ct-373e6c{color:#FFA657}.ct-85d161{color:#D2A8FF}.ct-18ca61{color:#C9D1D9}.ct-5996ab{color:#FF7B72}.light .ct-5996ab{color:#073642}.light .ct-18ca61{color:#657B83}.light .ct-85d161{color:#268BD2}.light .ct-373e6c{color:#657B83}.light .ct-1b2855{color:#859900}.light .ct-90ecad{color:#268BD2}.light .ct-812250{color:#657B83}.light .ct-5abcba{color:#859900}.light .ct-e53464{color:#268BD2}.light .ct-a9a5e4{color:#268BD2}.light .ct-6f9810{color:#B58900}.light .ct-3ecc1d{color:#073642}.light .ct-38cc9e{color:#268BD2}.light .ct-c6baa9{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Typescript:Type guards.md","_source":"content","_file":"Typescript/Type guards.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/ki2hTtdZ9z.json b/docs/api/_content/query/ki2hTtdZ9z.json index 50438d2..0596ed7 100644 --- a/docs/api/_content/query/ki2hTtdZ9z.json +++ b/docs/api/_content/query/ki2hTtdZ9z.json @@ -1 +1 @@ -{"_path":"/typescript/flatten-object-with-periods","_dir":"typescript","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Flatten Object With Periods","description":"This helper generates Typescript types for i18n dictionary json\nfiles by flattening it with period delimiter. Supports plural forms.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This helper generates Typescript types for i18n dictionary json\nfiles by flattening it with period delimiter. Supports plural forms."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Used for typing "},{"type":"element","tag":"a","props":{"href":"https://www.npmjs.com/package/i18n-js","rel":["nofollow"]},"children":[{"type":"text","value":"i18n.js"}]},{"type":"text","value":" dictionaries;"}]},{"type":"element","tag":"code","props":{"code":"import en from './en.json';\ntype TranslationPath = Flatten;\n\nconst t = (key: TranslationPath, options?: TranslateOptions) =>\n I18nLib.t(key, options);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import en from './en.json';\ntype TranslationPath = Flatten;\n\nconst t = (key: TranslationPath, options?: TranslateOptions) =>\n I18nLib.t(key, options);\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Flatten type defined here:"}]},{"type":"element","tag":"code","props":{"code":"// This one based on answer from StackOverflow:\n// https://stackoverflow.com/questions/58434389/typescript-deep-keyof-of-a-nested-object\n\nexport type Flatten = [D] extends [never]\n ? never\n : T extends PluralForm // plural object\n ? ''\n : T extends object\n ? { [K in keyof T]-?: Join> }[keyof T]\n : '';\n\n// Fix it for you plural form\ntype PluralForm = Record<'one' | 'few' | 'many', string>;\n\ntype Join = K extends string | number\n ? P extends string | number\n ? `${K}${'' extends P ? '' : '.'}${P}`\n : never\n : never;\n\ntype Prev = [never, 0, 1, 2, 3, 4, 5, ...Array<0>];\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// This one based on answer from StackOverflow:\n// https://stackoverflow.com/questions/58434389/typescript-deep-keyof-of-a-nested-object\n\nexport type Flatten = [D] extends [never]\n ? never\n : T extends PluralForm // plural object\n ? ''\n : T extends object\n ? { [K in keyof T]-?: Join> }[keyof T]\n : '';\n\n// Fix it for you plural form\ntype PluralForm = Record<'one' | 'few' | 'many', string>;\n\ntype Join = K extends string | number\n ? P extends string | number\n ? `${K}${'' extends P ? '' : '.'}${P}`\n : never\n : never;\n\ntype Prev = [never, 0, 1, 2, 3, 4, 5, ...Array<0>];\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This helper generates Typescript types for i18n dictionary json\nfiles by flattening it with period delimiter. Supports plural forms."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Used for typing "},{"type":"element","tag":"a","props":{"href":"https://www.npmjs.com/package/i18n-js","rel":["nofollow"]},"children":[{"type":"text","value":"i18n.js"}]},{"type":"text","value":" dictionaries;"}]},{"type":"element","tag":"code","props":{"code":"import en from './en.json';\ntype TranslationPath = Flatten;\n\nconst t = (key: TranslationPath, options?: TranslateOptions) =>\n I18nLib.t(key, options);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2e7a7"},"children":[{"type":"text","value":"en"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-59d1cb"},"children":[{"type":"text","value":"'./en.json'"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"TranslationPath"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"Flatten"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"typeof"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2e7a7"},"children":[{"type":"text","value":"en"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":">;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-3ba106"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5ae709"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8d3565"},"children":[{"type":"text","value":"t"}]},{"type":"element","tag":"span","props":{"class":"ct-5ae709"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1cdaff"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5ae709"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-c09440"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-1cdaff"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5ae709"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6436bb"},"children":[{"type":"text","value":"TranslationPath"}]},{"type":"element","tag":"span","props":{"class":"ct-5ae709"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c09440"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-1cdaff"},"children":[{"type":"text","value":"?:"}]},{"type":"element","tag":"span","props":{"class":"ct-5ae709"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6436bb"},"children":[{"type":"text","value":"TranslateOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-5ae709"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-3ba106"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c2e7a7"},"children":[{"type":"text","value":"I18nLib"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-b292a0"},"children":[{"type":"text","value":"t"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c2e7a7"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-c2e7a7"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Flatten type defined here:"}]},{"type":"element","tag":"code","props":{"code":"// This one based on answer from StackOverflow:\n// https://stackoverflow.com/questions/58434389/typescript-deep-keyof-of-a-nested-object\n\nexport type Flatten = [D] extends [never]\n ? never\n : T extends PluralForm // plural object\n ? ''\n : T extends object\n ? { [K in keyof T]-?: Join> }[keyof T]\n : '';\n\n// Fix it for you plural form\ntype PluralForm = Record<'one' | 'few' | 'many', string>;\n\ntype Join = K extends string | number\n ? P extends string | number\n ? `${K}${'' extends P ? '' : '.'}${P}`\n : never\n : never;\n\ntype Prev = [never, 0, 1, 2, 3, 4, 5, ...Array<0>];\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-76590f"},"children":[{"type":"text","value":"// This one based on answer from StackOverflow:"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-76590f"},"children":[{"type":"text","value":"// https://stackoverflow.com/questions/58434389/typescript-deep-keyof-of-a-nested-object"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"Flatten"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"D"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-028e32"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"D"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"] "}]},{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"never"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"never"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"PluralForm"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-76590f"},"children":[{"type":"text","value":"// plural object"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-59d1cb"},"children":[{"type":"text","value":"''"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"object"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" { ["}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"in"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"keyof"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"]"}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"-?:"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"Join"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"Flatten"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"], "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"Prev"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"D"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"]>> }["}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"keyof"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-59d1cb"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-76590f"},"children":[{"type":"text","value":"// Fix it for you plural form"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"PluralForm"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"Record"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-59d1cb"},"children":[{"type":"text","value":"'one'"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-59d1cb"},"children":[{"type":"text","value":"'few'"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-59d1cb"},"children":[{"type":"text","value":"'many'"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":">;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"Join"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"number"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"number"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-59d1cb"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-59d1cb"},"children":[{"type":"text","value":"}${''"}]},{"type":"element","tag":"span","props":{"class":"ct-19a7d8"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-19a7d8"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-19a7d8"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-19a7d8"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-59d1cb"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-19a7d8"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-19a7d8"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-59d1cb"},"children":[{"type":"text","value":"'.'}${"}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-59d1cb"},"children":[{"type":"text","value":"}`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"never"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"never"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0fd30f"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"Prev"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-6d81df"},"children":[{"type":"text","value":"never"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-028e32"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-028e32"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-028e32"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-028e32"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-028e32"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-028e32"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-64ac72"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-635bfc"},"children":[{"type":"text","value":"Array"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-028e32"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-347f56"},"children":[{"type":"text","value":">];"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-19a7d8{color:#A5D6FF}.ct-028e32{color:#79C0FF}.ct-6d81df{color:#79C0FF}.ct-76590f{color:#8B949E}.ct-b292a0{color:#D2A8FF}.ct-6436bb{color:#FFA657}.ct-c09440{color:#FFA657}.ct-1cdaff{color:#FF7B72}.ct-8d3565{color:#D2A8FF}.ct-5ae709{color:#C9D1D9}.ct-3ba106{color:#FF7B72}.ct-635bfc{color:#FFA657}.ct-0fd30f{color:#FF7B72}.ct-59d1cb{color:#A5D6FF}.ct-c2e7a7{color:#C9D1D9}.ct-347f56{color:#C9D1D9}.ct-64ac72{color:#FF7B72}.light .ct-64ac72{color:#859900}.light .ct-347f56{color:#657B83}.light .ct-c2e7a7{color:#268BD2}.light .ct-59d1cb{color:#2AA198}.light .ct-0fd30f{color:#073642}.light .ct-635bfc{color:#268BD2}.light .ct-3ba106{color:#073642}.light .ct-5ae709{color:#657B83}.light .ct-8d3565{color:#268BD2}.light .ct-1cdaff{color:#859900}.light .ct-c09440{color:#657B83}.light .ct-6436bb{color:#268BD2}.light .ct-b292a0{color:#268BD2}.light .ct-76590f{color:#93A1A1}.light .ct-6d81df{color:#859900}.light .ct-028e32{color:#D33682}.light .ct-19a7d8{color:#657B83}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Typescript:Flatten object with periods.md","_source":"content","_file":"Typescript/Flatten object with periods.md","_extension":"md"} \ No newline at end of file +{"_path":"/typescript/flatten-object-with-periods","_dir":"typescript","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Flatten Object With Periods","description":"This helper generates Typescript types for i18n dictionary json\nfiles by flattening it with period delimiter. Supports plural forms.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This helper generates Typescript types for i18n dictionary json\nfiles by flattening it with period delimiter. Supports plural forms."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Used for typing "},{"type":"element","tag":"a","props":{"href":"https://www.npmjs.com/package/i18n-js","rel":["nofollow"]},"children":[{"type":"text","value":"i18n.js"}]},{"type":"text","value":" dictionaries;"}]},{"type":"element","tag":"code","props":{"code":"import en from './en.json';\ntype TranslationPath = Flatten;\n\nconst t = (key: TranslationPath, options?: TranslateOptions) =>\n I18nLib.t(key, options);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import en from './en.json';\ntype TranslationPath = Flatten;\n\nconst t = (key: TranslationPath, options?: TranslateOptions) =>\n I18nLib.t(key, options);\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Flatten type defined here:"}]},{"type":"element","tag":"code","props":{"code":"// This one based on answer from StackOverflow:\n// https://stackoverflow.com/questions/58434389/typescript-deep-keyof-of-a-nested-object\n\nexport type Flatten = [D] extends [never]\n ? never\n : T extends PluralForm // plural object\n ? ''\n : T extends object\n ? { [K in keyof T]-?: Join> }[keyof T]\n : '';\n\n// Fix it for you plural form\ntype PluralForm = Record<'one' | 'few' | 'many', string>;\n\ntype Join = K extends string | number\n ? P extends string | number\n ? `${K}${'' extends P ? '' : '.'}${P}`\n : never\n : never;\n\ntype Prev = [never, 0, 1, 2, 3, 4, 5, ...Array<0>];\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// This one based on answer from StackOverflow:\n// https://stackoverflow.com/questions/58434389/typescript-deep-keyof-of-a-nested-object\n\nexport type Flatten = [D] extends [never]\n ? never\n : T extends PluralForm // plural object\n ? ''\n : T extends object\n ? { [K in keyof T]-?: Join> }[keyof T]\n : '';\n\n// Fix it for you plural form\ntype PluralForm = Record<'one' | 'few' | 'many', string>;\n\ntype Join = K extends string | number\n ? P extends string | number\n ? `${K}${'' extends P ? '' : '.'}${P}`\n : never\n : never;\n\ntype Prev = [never, 0, 1, 2, 3, 4, 5, ...Array<0>];\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This helper generates Typescript types for i18n dictionary json\nfiles by flattening it with period delimiter. Supports plural forms."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Used for typing "},{"type":"element","tag":"a","props":{"href":"https://www.npmjs.com/package/i18n-js","rel":["nofollow"]},"children":[{"type":"text","value":"i18n.js"}]},{"type":"text","value":" dictionaries;"}]},{"type":"element","tag":"code","props":{"code":"import en from './en.json';\ntype TranslationPath = Flatten;\n\nconst t = (key: TranslationPath, options?: TranslateOptions) =>\n I18nLib.t(key, options);\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-441a98"},"children":[{"type":"text","value":"en"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d390b"},"children":[{"type":"text","value":"'./en.json'"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"TranslationPath"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"Flatten"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"typeof"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-441a98"},"children":[{"type":"text","value":"en"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":">;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-e2c7eb"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-36fa95"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-30dc91"},"children":[{"type":"text","value":"t"}]},{"type":"element","tag":"span","props":{"class":"ct-36fa95"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4540c4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-36fa95"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-ca3455"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-4540c4"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-36fa95"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4d74f9"},"children":[{"type":"text","value":"TranslationPath"}]},{"type":"element","tag":"span","props":{"class":"ct-36fa95"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-ca3455"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-4540c4"},"children":[{"type":"text","value":"?:"}]},{"type":"element","tag":"span","props":{"class":"ct-36fa95"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4d74f9"},"children":[{"type":"text","value":"TranslateOptions"}]},{"type":"element","tag":"span","props":{"class":"ct-36fa95"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-e2c7eb"},"children":[{"type":"text","value":"=>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-441a98"},"children":[{"type":"text","value":"I18nLib"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-394af7"},"children":[{"type":"text","value":"t"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-441a98"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-441a98"},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":");"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Flatten type defined here:"}]},{"type":"element","tag":"code","props":{"code":"// This one based on answer from StackOverflow:\n// https://stackoverflow.com/questions/58434389/typescript-deep-keyof-of-a-nested-object\n\nexport type Flatten = [D] extends [never]\n ? never\n : T extends PluralForm // plural object\n ? ''\n : T extends object\n ? { [K in keyof T]-?: Join> }[keyof T]\n : '';\n\n// Fix it for you plural form\ntype PluralForm = Record<'one' | 'few' | 'many', string>;\n\ntype Join = K extends string | number\n ? P extends string | number\n ? `${K}${'' extends P ? '' : '.'}${P}`\n : never\n : never;\n\ntype Prev = [never, 0, 1, 2, 3, 4, 5, ...Array<0>];\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bc4f67"},"children":[{"type":"text","value":"// This one based on answer from StackOverflow:"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bc4f67"},"children":[{"type":"text","value":"// https://stackoverflow.com/questions/58434389/typescript-deep-keyof-of-a-nested-object"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"Flatten"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"D"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-059763"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"D"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"] "}]},{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"never"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"never"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"PluralForm"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-bc4f67"},"children":[{"type":"text","value":"// plural object"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d390b"},"children":[{"type":"text","value":"''"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"object"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" { ["}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"in"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"keyof"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"]"}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"-?:"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"Join"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"Flatten"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"], "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"Prev"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"["}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"D"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"]>> }["}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"keyof"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"T"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d390b"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bc4f67"},"children":[{"type":"text","value":"// Fix it for you plural form"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"PluralForm"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"Record"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-6d390b"},"children":[{"type":"text","value":"'one'"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d390b"},"children":[{"type":"text","value":"'few'"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d390b"},"children":[{"type":"text","value":"'many'"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":">;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"Join"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"number"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"number"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d390b"},"children":[{"type":"text","value":"`${"}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"K"}]},{"type":"element","tag":"span","props":{"class":"ct-6d390b"},"children":[{"type":"text","value":"}${''"}]},{"type":"element","tag":"span","props":{"class":"ct-c0bc31"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"extends"}]},{"type":"element","tag":"span","props":{"class":"ct-c0bc31"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-c0bc31"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"?"}]},{"type":"element","tag":"span","props":{"class":"ct-c0bc31"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d390b"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-c0bc31"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-c0bc31"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6d390b"},"children":[{"type":"text","value":"'.'}${"}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"P"}]},{"type":"element","tag":"span","props":{"class":"ct-6d390b"},"children":[{"type":"text","value":"}`"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"never"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"never"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1cf06c"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"Prev"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-5be865"},"children":[{"type":"text","value":"never"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-059763"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-059763"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-059763"},"children":[{"type":"text","value":"2"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-059763"},"children":[{"type":"text","value":"3"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-059763"},"children":[{"type":"text","value":"4"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-059763"},"children":[{"type":"text","value":"5"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-cf7037"},"children":[{"type":"text","value":"..."}]},{"type":"element","tag":"span","props":{"class":"ct-098f84"},"children":[{"type":"text","value":"Array"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-059763"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-bb5dba"},"children":[{"type":"text","value":">];"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-c0bc31{color:#A5D6FF}.ct-059763{color:#79C0FF}.ct-5be865{color:#79C0FF}.ct-bc4f67{color:#8B949E}.ct-394af7{color:#D2A8FF}.ct-4d74f9{color:#FFA657}.ct-ca3455{color:#FFA657}.ct-4540c4{color:#FF7B72}.ct-30dc91{color:#D2A8FF}.ct-36fa95{color:#C9D1D9}.ct-e2c7eb{color:#FF7B72}.ct-098f84{color:#FFA657}.ct-1cf06c{color:#FF7B72}.ct-6d390b{color:#A5D6FF}.ct-441a98{color:#C9D1D9}.ct-bb5dba{color:#C9D1D9}.ct-cf7037{color:#FF7B72}.light .ct-cf7037{color:#859900}.light .ct-bb5dba{color:#657B83}.light .ct-441a98{color:#268BD2}.light .ct-6d390b{color:#2AA198}.light .ct-1cf06c{color:#073642}.light .ct-098f84{color:#268BD2}.light .ct-e2c7eb{color:#073642}.light .ct-36fa95{color:#657B83}.light .ct-30dc91{color:#268BD2}.light .ct-4540c4{color:#859900}.light .ct-ca3455{color:#657B83}.light .ct-4d74f9{color:#268BD2}.light .ct-394af7{color:#268BD2}.light .ct-bc4f67{color:#93A1A1}.light .ct-5be865{color:#859900}.light .ct-059763{color:#D33682}.light .ct-c0bc31{color:#657B83}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Typescript:Flatten object with periods.md","_source":"content","_file":"Typescript/Flatten object with periods.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/kmbybMtElx.json b/docs/api/_content/query/kmbybMtElx.json index 60421d3..afede40 100644 --- a/docs/api/_content/query/kmbybMtElx.json +++ b/docs/api/_content/query/kmbybMtElx.json @@ -1 +1 @@ -{"_path":"/linux/google-photos-alternative-with-photoprism","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Google Photos Alternative With Photoprism","description":"Photo Prism is a free alternative to Google photos, can be set up with #docker.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://photoprism.app/","rel":["nofollow"]},"children":[{"type":"text","value":"Photo Prism"}]},{"type":"text","value":" is a free alternative to Google photos, can be set up with #docker."}]},{"type":"element","tag":"h2","props":{"id":"docker-compose-file-to-run-it"},"children":[{"type":"text","value":"Docker compose file to run it"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Check out current "},{"type":"element","tag":"a","props":{"href":"https://dl.photoprism.app/docker/docker-compose.yml","rel":["nofollow"]},"children":[{"type":"text","value":"example"}]},{"type":"text","value":" at photoprism's "},{"type":"element","tag":"a","props":{"href":"https://docs.photoprism.app/getting-started/docker-compose/","rel":["nofollow"]},"children":[{"type":"text","value":"documentation"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"version: '3.5'\n\nservices:\n photoprism:\n container_name: photoprism__app\n image: photoprism/photoprism:latest\n depends_on:\n - mariadb\n restart: unless-stopped\n security_opt:\n - seccomp:unconfined\n - apparmor:unconfined\n ports:\n - 2342:2342 # HTTP port (host:container)\n environment:\n PHOTOPRISM_ADMIN_PASSWORD: \"password\"\n PHOTOPRISM_SITE_URL: \"https://service.url/\"\n PHOTOPRISM_ORIGINALS_LIMIT: 5000\n PHOTOPRISM_HTTP_COMPRESSION: \"gzip\"\n PHOTOPRISM_DEBUG: \"false\" \n PHOTOPRISM_PUBLIC: \"false\" \n PHOTOPRISM_READONLY: \"false\" \n PHOTOPRISM_EXPERIMENTAL: \"false\"\n PHOTOPRISM_DISABLE_CHOWN: \"false\"\n PHOTOPRISM_DISABLE_WEBDAV: \"false\" \n PHOTOPRISM_DISABLE_SETTINGS: \"false\"\n PHOTOPRISM_DISABLE_TENSORFLOW: \"false\"\n PHOTOPRISM_DISABLE_FACES: \"false\" \n PHOTOPRISM_DISABLE_CLASSIFICATION: \"false\"\n PHOTOPRISM_DARKTABLE_PRESETS: \"false\" \n PHOTOPRISM_DETECT_NSFW: \"false\" \n PHOTOPRISM_UPLOAD_NSFW: \"true\" \n PHOTOPRISM_DATABASE_DRIVER: \"mysql\" \n PHOTOPRISM_DATABASE_SERVER: \"mariadb:3306\"\n PHOTOPRISM_DATABASE_NAME: \"photoprism\" \n PHOTOPRISM_DATABASE_USER: \"root\" \n PHOTOPRISM_DATABASE_PASSWORD: \"insecure\" \n PHOTOPRISM_SITE_TITLE: \"PhotoPrism\"\n PHOTOPRISM_SITE_CAPTION: \"Browse Your Life\"\n PHOTOPRISM_SITE_DESCRIPTION: \"\"\n      PHOTOPRISM_SITE_AUTHOR: \"\"\n      HOME: \"/photoprism\"\n    working_dir: \"/photoprism\"\n    volumes:\n      - \"./data/originals:/photoprism/originals\"    \n      - \"./data/imports:/photoprism/import\"\n      - \"./data/storage:/photoprism/storage\"\n  mariadb:\n    container_name: photoprism__db\n    restart: unless-stopped\n    image: mariadb:10.6\n    security_opt:\n      - seccomp:unconfined\n      - apparmor:unconfined\n    command: mysqld --innodb-buffer-pool-size=128M --transaction-isolation=READ-COMMITTED --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci --max-connections=512 --innodb-rollback-on-timeout=OFF --innodb-lock-wait-timeout=120\n    volumes:\n      - \"./database:/var/lib/mysql\" # Important, don't remove\n    environment:\n      MYSQL_ROOT_PASSWORD: insecure\n      MYSQL_DATABASE: photoprism\n      MYSQL_USER: photoprism\n      MYSQL_PASSWORD: insecure\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: '3.5'\n\nservices:\n photoprism:\n container_name: photoprism__app\n image: photoprism/photoprism:latest\n depends_on:\n - mariadb\n restart: unless-stopped\n security_opt:\n - seccomp:unconfined\n - apparmor:unconfined\n ports:\n - 2342:2342 # HTTP port (host:container)\n environment:\n PHOTOPRISM_ADMIN_PASSWORD: \"password\"\n PHOTOPRISM_SITE_URL: \"https://service.url/\"\n PHOTOPRISM_ORIGINALS_LIMIT: 5000\n PHOTOPRISM_HTTP_COMPRESSION: \"gzip\"\n PHOTOPRISM_DEBUG: \"false\" \n PHOTOPRISM_PUBLIC: \"false\" \n PHOTOPRISM_READONLY: \"false\" \n PHOTOPRISM_EXPERIMENTAL: \"false\"\n PHOTOPRISM_DISABLE_CHOWN: \"false\"\n PHOTOPRISM_DISABLE_WEBDAV: \"false\" \n PHOTOPRISM_DISABLE_SETTINGS: \"false\"\n PHOTOPRISM_DISABLE_TENSORFLOW: \"false\"\n PHOTOPRISM_DISABLE_FACES: \"false\" \n PHOTOPRISM_DISABLE_CLASSIFICATION: \"false\"\n PHOTOPRISM_DARKTABLE_PRESETS: \"false\" \n PHOTOPRISM_DETECT_NSFW: \"false\" \n PHOTOPRISM_UPLOAD_NSFW: \"true\" \n PHOTOPRISM_DATABASE_DRIVER: \"mysql\" \n PHOTOPRISM_DATABASE_SERVER: \"mariadb:3306\"\n PHOTOPRISM_DATABASE_NAME: \"photoprism\" \n PHOTOPRISM_DATABASE_USER: \"root\" \n PHOTOPRISM_DATABASE_PASSWORD: \"insecure\" \n PHOTOPRISM_SITE_TITLE: \"PhotoPrism\"\n PHOTOPRISM_SITE_CAPTION: \"Browse Your Life\"\n PHOTOPRISM_SITE_DESCRIPTION: \"\"\n      PHOTOPRISM_SITE_AUTHOR: \"\"\n      HOME: \"/photoprism\"\n    working_dir: \"/photoprism\"\n    volumes:\n      - \"./data/originals:/photoprism/originals\"    \n      - \"./data/imports:/photoprism/import\"\n      - \"./data/storage:/photoprism/storage\"\n  mariadb:\n    container_name: photoprism__db\n    restart: unless-stopped\n    image: mariadb:10.6\n    security_opt:\n      - seccomp:unconfined\n      - apparmor:unconfined\n    command: mysqld --innodb-buffer-pool-size=128M --transaction-isolation=READ-COMMITTED --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci --max-connections=512 --innodb-rollback-on-timeout=OFF --innodb-lock-wait-timeout=120\n    volumes:\n      - \"./database:/var/lib/mysql\" # Important, don't remove\n    environment:\n      MYSQL_ROOT_PASSWORD: insecure\n      MYSQL_DATABASE: photoprism\n      MYSQL_USER: photoprism\n      MYSQL_PASSWORD: insecure\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://photoprism.app/","rel":["nofollow"]},"children":[{"type":"text","value":"Photo Prism"}]},{"type":"text","value":" is a free alternative to Google photos, can be set up with #docker."}]},{"type":"element","tag":"h2","props":{"id":"docker-compose-file-to-run-it"},"children":[{"type":"text","value":"Docker compose file to run it"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Check out current "},{"type":"element","tag":"a","props":{"href":"https://dl.photoprism.app/docker/docker-compose.yml","rel":["nofollow"]},"children":[{"type":"text","value":"example"}]},{"type":"text","value":" at photoprism's "},{"type":"element","tag":"a","props":{"href":"https://docs.photoprism.app/getting-started/docker-compose/","rel":["nofollow"]},"children":[{"type":"text","value":"documentation"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"version: '3.5'\n\nservices:\n photoprism:\n container_name: photoprism__app\n image: photoprism/photoprism:latest\n depends_on:\n - mariadb\n restart: unless-stopped\n security_opt:\n - seccomp:unconfined\n - apparmor:unconfined\n ports:\n - 2342:2342 # HTTP port (host:container)\n environment:\n PHOTOPRISM_ADMIN_PASSWORD: \"password\"\n PHOTOPRISM_SITE_URL: \"https://service.url/\"\n PHOTOPRISM_ORIGINALS_LIMIT: 5000\n PHOTOPRISM_HTTP_COMPRESSION: \"gzip\"\n PHOTOPRISM_DEBUG: \"false\" \n PHOTOPRISM_PUBLIC: \"false\" \n PHOTOPRISM_READONLY: \"false\" \n PHOTOPRISM_EXPERIMENTAL: \"false\"\n PHOTOPRISM_DISABLE_CHOWN: \"false\"\n PHOTOPRISM_DISABLE_WEBDAV: \"false\" \n PHOTOPRISM_DISABLE_SETTINGS: \"false\"\n PHOTOPRISM_DISABLE_TENSORFLOW: \"false\"\n PHOTOPRISM_DISABLE_FACES: \"false\" \n PHOTOPRISM_DISABLE_CLASSIFICATION: \"false\"\n PHOTOPRISM_DARKTABLE_PRESETS: \"false\" \n PHOTOPRISM_DETECT_NSFW: \"false\" \n PHOTOPRISM_UPLOAD_NSFW: \"true\" \n PHOTOPRISM_DATABASE_DRIVER: \"mysql\" \n PHOTOPRISM_DATABASE_SERVER: \"mariadb:3306\"\n PHOTOPRISM_DATABASE_NAME: \"photoprism\" \n PHOTOPRISM_DATABASE_USER: \"root\" \n PHOTOPRISM_DATABASE_PASSWORD: \"insecure\" \n PHOTOPRISM_SITE_TITLE: \"PhotoPrism\"\n PHOTOPRISM_SITE_CAPTION: \"Browse Your Life\"\n PHOTOPRISM_SITE_DESCRIPTION: \"\"\n      PHOTOPRISM_SITE_AUTHOR: \"\"\n      HOME: \"/photoprism\"\n    working_dir: \"/photoprism\"\n    volumes:\n      - \"./data/originals:/photoprism/originals\"    \n      - \"./data/imports:/photoprism/import\"\n      - \"./data/storage:/photoprism/storage\"\n  mariadb:\n    container_name: photoprism__db\n    restart: unless-stopped\n    image: mariadb:10.6\n    security_opt:\n      - seccomp:unconfined\n      - apparmor:unconfined\n    command: mysqld --innodb-buffer-pool-size=128M --transaction-isolation=READ-COMMITTED --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci --max-connections=512 --innodb-rollback-on-timeout=OFF --innodb-lock-wait-timeout=120\n    volumes:\n      - \"./database:/var/lib/mysql\" # Important, don't remove\n    environment:\n      MYSQL_ROOT_PASSWORD: insecure\n      MYSQL_DATABASE: photoprism\n      MYSQL_USER: photoprism\n      MYSQL_PASSWORD: insecure\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"'3.5'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"photoprism"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"photoprism__app"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"photoprism/photoprism:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"depends_on"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"mariadb"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"unless-stopped"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"security_opt"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"seccomp:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"apparmor:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"2342:2342"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f03ff"},"children":[{"type":"text","value":"# HTTP port (host:container)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_ADMIN_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"password\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"https://service.url/\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_ORIGINALS_LIMIT"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-074800"},"children":[{"type":"text","value":"5000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_HTTP_COMPRESSION"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"gzip\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DEBUG"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_PUBLIC"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_READONLY"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_EXPERIMENTAL"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_CHOWN"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_WEBDAV"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_SETTINGS"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_TENSORFLOW"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_FACES"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_CLASSIFICATION"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DARKTABLE_PRESETS"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DETECT_NSFW"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_UPLOAD_NSFW"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"true\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_DRIVER"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"mysql\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_SERVER"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"mariadb:3306\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_NAME"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"photoprism\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_USER"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"root\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"insecure\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_TITLE"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"PhotoPrism\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_CAPTION"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"Browse Your Life\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_DESCRIPTION"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_AUTHOR"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"HOME"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"/photoprism\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"working_dir"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"/photoprism\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"./data/originals:/photoprism/originals\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"    "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"./data/imports:/photoprism/import\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"./data/storage:/photoprism/storage\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"mariadb"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"photoprism__db"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"unless-stopped"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"mariadb:10.6"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"security_opt"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"seccomp:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"apparmor:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"command"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"mysqld --innodb-buffer-pool-size=128M --transaction-isolation=READ-COMMITTED --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci --max-connections=512 --innodb-rollback-on-timeout=OFF --innodb-lock-wait-timeout=120"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"\"./database:/var/lib/mysql\""}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5f03ff"},"children":[{"type":"text","value":"# Important, don't remove"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"MYSQL_ROOT_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"insecure"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"MYSQL_DATABASE"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"photoprism"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"MYSQL_USER"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"photoprism"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-6b85fe"},"children":[{"type":"text","value":"MYSQL_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-9aaab4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-608ab5"},"children":[{"type":"text","value":"insecure"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-074800{color:#79C0FF}.ct-5f03ff{color:#8B949E}.ct-608ab5{color:#A5D6FF}.ct-9aaab4{color:#C9D1D9}.ct-6b85fe{color:#7EE787}.light .ct-6b85fe{color:#268BD2}.light .ct-9aaab4{color:#657B83}.light .ct-608ab5{color:#2AA198}.light .ct-5f03ff{color:#93A1A1}.light .ct-074800{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"docker-compose-file-to-run-it","depth":2,"text":"Docker compose file to run it"}]}},"_type":"markdown","_id":"content:Linux:Google photos alternative with Photoprism.md","_source":"content","_file":"Linux/Google photos alternative with Photoprism.md","_extension":"md"} \ No newline at end of file +{"_path":"/linux/google-photos-alternative-with-photoprism","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Google Photos Alternative With Photoprism","description":"Photo Prism is a free alternative to Google photos, can be set up with #docker.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://photoprism.app/","rel":["nofollow"]},"children":[{"type":"text","value":"Photo Prism"}]},{"type":"text","value":" is a free alternative to Google photos, can be set up with #docker."}]},{"type":"element","tag":"h2","props":{"id":"docker-compose-file-to-run-it"},"children":[{"type":"text","value":"Docker compose file to run it"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Check out current "},{"type":"element","tag":"a","props":{"href":"https://dl.photoprism.app/docker/docker-compose.yml","rel":["nofollow"]},"children":[{"type":"text","value":"example"}]},{"type":"text","value":" at photoprism's "},{"type":"element","tag":"a","props":{"href":"https://docs.photoprism.app/getting-started/docker-compose/","rel":["nofollow"]},"children":[{"type":"text","value":"documentation"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"version: '3.5'\n\nservices:\n photoprism:\n container_name: photoprism__app\n image: photoprism/photoprism:latest\n depends_on:\n - mariadb\n restart: unless-stopped\n security_opt:\n - seccomp:unconfined\n - apparmor:unconfined\n ports:\n - 2342:2342 # HTTP port (host:container)\n environment:\n PHOTOPRISM_ADMIN_PASSWORD: \"password\"\n PHOTOPRISM_SITE_URL: \"https://service.url/\"\n PHOTOPRISM_ORIGINALS_LIMIT: 5000\n PHOTOPRISM_HTTP_COMPRESSION: \"gzip\"\n PHOTOPRISM_DEBUG: \"false\" \n PHOTOPRISM_PUBLIC: \"false\" \n PHOTOPRISM_READONLY: \"false\" \n PHOTOPRISM_EXPERIMENTAL: \"false\"\n PHOTOPRISM_DISABLE_CHOWN: \"false\"\n PHOTOPRISM_DISABLE_WEBDAV: \"false\" \n PHOTOPRISM_DISABLE_SETTINGS: \"false\"\n PHOTOPRISM_DISABLE_TENSORFLOW: \"false\"\n PHOTOPRISM_DISABLE_FACES: \"false\" \n PHOTOPRISM_DISABLE_CLASSIFICATION: \"false\"\n PHOTOPRISM_DARKTABLE_PRESETS: \"false\" \n PHOTOPRISM_DETECT_NSFW: \"false\" \n PHOTOPRISM_UPLOAD_NSFW: \"true\" \n PHOTOPRISM_DATABASE_DRIVER: \"mysql\" \n PHOTOPRISM_DATABASE_SERVER: \"mariadb:3306\"\n PHOTOPRISM_DATABASE_NAME: \"photoprism\" \n PHOTOPRISM_DATABASE_USER: \"root\" \n PHOTOPRISM_DATABASE_PASSWORD: \"insecure\" \n PHOTOPRISM_SITE_TITLE: \"PhotoPrism\"\n PHOTOPRISM_SITE_CAPTION: \"Browse Your Life\"\n PHOTOPRISM_SITE_DESCRIPTION: \"\"\n      PHOTOPRISM_SITE_AUTHOR: \"\"\n      HOME: \"/photoprism\"\n    working_dir: \"/photoprism\"\n    volumes:\n      - \"./data/originals:/photoprism/originals\"    \n      - \"./data/imports:/photoprism/import\"\n      - \"./data/storage:/photoprism/storage\"\n  mariadb:\n    container_name: photoprism__db\n    restart: unless-stopped\n    image: mariadb:10.6\n    security_opt:\n      - seccomp:unconfined\n      - apparmor:unconfined\n    command: mysqld --innodb-buffer-pool-size=128M --transaction-isolation=READ-COMMITTED --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci --max-connections=512 --innodb-rollback-on-timeout=OFF --innodb-lock-wait-timeout=120\n    volumes:\n      - \"./database:/var/lib/mysql\" # Important, don't remove\n    environment:\n      MYSQL_ROOT_PASSWORD: insecure\n      MYSQL_DATABASE: photoprism\n      MYSQL_USER: photoprism\n      MYSQL_PASSWORD: insecure\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"version: '3.5'\n\nservices:\n photoprism:\n container_name: photoprism__app\n image: photoprism/photoprism:latest\n depends_on:\n - mariadb\n restart: unless-stopped\n security_opt:\n - seccomp:unconfined\n - apparmor:unconfined\n ports:\n - 2342:2342 # HTTP port (host:container)\n environment:\n PHOTOPRISM_ADMIN_PASSWORD: \"password\"\n PHOTOPRISM_SITE_URL: \"https://service.url/\"\n PHOTOPRISM_ORIGINALS_LIMIT: 5000\n PHOTOPRISM_HTTP_COMPRESSION: \"gzip\"\n PHOTOPRISM_DEBUG: \"false\" \n PHOTOPRISM_PUBLIC: \"false\" \n PHOTOPRISM_READONLY: \"false\" \n PHOTOPRISM_EXPERIMENTAL: \"false\"\n PHOTOPRISM_DISABLE_CHOWN: \"false\"\n PHOTOPRISM_DISABLE_WEBDAV: \"false\" \n PHOTOPRISM_DISABLE_SETTINGS: \"false\"\n PHOTOPRISM_DISABLE_TENSORFLOW: \"false\"\n PHOTOPRISM_DISABLE_FACES: \"false\" \n PHOTOPRISM_DISABLE_CLASSIFICATION: \"false\"\n PHOTOPRISM_DARKTABLE_PRESETS: \"false\" \n PHOTOPRISM_DETECT_NSFW: \"false\" \n PHOTOPRISM_UPLOAD_NSFW: \"true\" \n PHOTOPRISM_DATABASE_DRIVER: \"mysql\" \n PHOTOPRISM_DATABASE_SERVER: \"mariadb:3306\"\n PHOTOPRISM_DATABASE_NAME: \"photoprism\" \n PHOTOPRISM_DATABASE_USER: \"root\" \n PHOTOPRISM_DATABASE_PASSWORD: \"insecure\" \n PHOTOPRISM_SITE_TITLE: \"PhotoPrism\"\n PHOTOPRISM_SITE_CAPTION: \"Browse Your Life\"\n PHOTOPRISM_SITE_DESCRIPTION: \"\"\n      PHOTOPRISM_SITE_AUTHOR: \"\"\n      HOME: \"/photoprism\"\n    working_dir: \"/photoprism\"\n    volumes:\n      - \"./data/originals:/photoprism/originals\"    \n      - \"./data/imports:/photoprism/import\"\n      - \"./data/storage:/photoprism/storage\"\n  mariadb:\n    container_name: photoprism__db\n    restart: unless-stopped\n    image: mariadb:10.6\n    security_opt:\n      - seccomp:unconfined\n      - apparmor:unconfined\n    command: mysqld --innodb-buffer-pool-size=128M --transaction-isolation=READ-COMMITTED --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci --max-connections=512 --innodb-rollback-on-timeout=OFF --innodb-lock-wait-timeout=120\n    volumes:\n      - \"./database:/var/lib/mysql\" # Important, don't remove\n    environment:\n      MYSQL_ROOT_PASSWORD: insecure\n      MYSQL_DATABASE: photoprism\n      MYSQL_USER: photoprism\n      MYSQL_PASSWORD: insecure\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://photoprism.app/","rel":["nofollow"]},"children":[{"type":"text","value":"Photo Prism"}]},{"type":"text","value":" is a free alternative to Google photos, can be set up with #docker."}]},{"type":"element","tag":"h2","props":{"id":"docker-compose-file-to-run-it"},"children":[{"type":"text","value":"Docker compose file to run it"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Check out current "},{"type":"element","tag":"a","props":{"href":"https://dl.photoprism.app/docker/docker-compose.yml","rel":["nofollow"]},"children":[{"type":"text","value":"example"}]},{"type":"text","value":" at photoprism's "},{"type":"element","tag":"a","props":{"href":"https://docs.photoprism.app/getting-started/docker-compose/","rel":["nofollow"]},"children":[{"type":"text","value":"documentation"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"version: '3.5'\n\nservices:\n photoprism:\n container_name: photoprism__app\n image: photoprism/photoprism:latest\n depends_on:\n - mariadb\n restart: unless-stopped\n security_opt:\n - seccomp:unconfined\n - apparmor:unconfined\n ports:\n - 2342:2342 # HTTP port (host:container)\n environment:\n PHOTOPRISM_ADMIN_PASSWORD: \"password\"\n PHOTOPRISM_SITE_URL: \"https://service.url/\"\n PHOTOPRISM_ORIGINALS_LIMIT: 5000\n PHOTOPRISM_HTTP_COMPRESSION: \"gzip\"\n PHOTOPRISM_DEBUG: \"false\" \n PHOTOPRISM_PUBLIC: \"false\" \n PHOTOPRISM_READONLY: \"false\" \n PHOTOPRISM_EXPERIMENTAL: \"false\"\n PHOTOPRISM_DISABLE_CHOWN: \"false\"\n PHOTOPRISM_DISABLE_WEBDAV: \"false\" \n PHOTOPRISM_DISABLE_SETTINGS: \"false\"\n PHOTOPRISM_DISABLE_TENSORFLOW: \"false\"\n PHOTOPRISM_DISABLE_FACES: \"false\" \n PHOTOPRISM_DISABLE_CLASSIFICATION: \"false\"\n PHOTOPRISM_DARKTABLE_PRESETS: \"false\" \n PHOTOPRISM_DETECT_NSFW: \"false\" \n PHOTOPRISM_UPLOAD_NSFW: \"true\" \n PHOTOPRISM_DATABASE_DRIVER: \"mysql\" \n PHOTOPRISM_DATABASE_SERVER: \"mariadb:3306\"\n PHOTOPRISM_DATABASE_NAME: \"photoprism\" \n PHOTOPRISM_DATABASE_USER: \"root\" \n PHOTOPRISM_DATABASE_PASSWORD: \"insecure\" \n PHOTOPRISM_SITE_TITLE: \"PhotoPrism\"\n PHOTOPRISM_SITE_CAPTION: \"Browse Your Life\"\n PHOTOPRISM_SITE_DESCRIPTION: \"\"\n      PHOTOPRISM_SITE_AUTHOR: \"\"\n      HOME: \"/photoprism\"\n    working_dir: \"/photoprism\"\n    volumes:\n      - \"./data/originals:/photoprism/originals\"    \n      - \"./data/imports:/photoprism/import\"\n      - \"./data/storage:/photoprism/storage\"\n  mariadb:\n    container_name: photoprism__db\n    restart: unless-stopped\n    image: mariadb:10.6\n    security_opt:\n      - seccomp:unconfined\n      - apparmor:unconfined\n    command: mysqld --innodb-buffer-pool-size=128M --transaction-isolation=READ-COMMITTED --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci --max-connections=512 --innodb-rollback-on-timeout=OFF --innodb-lock-wait-timeout=120\n    volumes:\n      - \"./database:/var/lib/mysql\" # Important, don't remove\n    environment:\n      MYSQL_ROOT_PASSWORD: insecure\n      MYSQL_DATABASE: photoprism\n      MYSQL_USER: photoprism\n      MYSQL_PASSWORD: insecure\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"version"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"'3.5'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"services"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"photoprism"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"photoprism__app"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"photoprism/photoprism:latest"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"depends_on"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"mariadb"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"unless-stopped"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"security_opt"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"seccomp:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"apparmor:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"2342:2342"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9477a5"},"children":[{"type":"text","value":"# HTTP port (host:container)"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_ADMIN_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"password\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_URL"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"https://service.url/\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_ORIGINALS_LIMIT"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-db7588"},"children":[{"type":"text","value":"5000"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_HTTP_COMPRESSION"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"gzip\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DEBUG"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_PUBLIC"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_READONLY"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_EXPERIMENTAL"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_CHOWN"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_WEBDAV"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_SETTINGS"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_TENSORFLOW"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_FACES"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DISABLE_CLASSIFICATION"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DARKTABLE_PRESETS"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DETECT_NSFW"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"false\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_UPLOAD_NSFW"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"true\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_DRIVER"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"mysql\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_SERVER"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"mariadb:3306\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_NAME"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"photoprism\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_USER"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"root\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_DATABASE_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"insecure\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_TITLE"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"PhotoPrism\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_CAPTION"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"Browse Your Life\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_DESCRIPTION"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"PHOTOPRISM_SITE_AUTHOR"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"HOME"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"/photoprism\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"working_dir"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"/photoprism\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"./data/originals:/photoprism/originals\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"    "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"./data/imports:/photoprism/import\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"./data/storage:/photoprism/storage\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"mariadb"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"container_name"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"photoprism__db"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"restart"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"unless-stopped"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"mariadb:10.6"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"security_opt"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"seccomp:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"apparmor:unconfined"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"command"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"mysqld --innodb-buffer-pool-size=128M --transaction-isolation=READ-COMMITTED --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci --max-connections=512 --innodb-rollback-on-timeout=OFF --innodb-lock-wait-timeout=120"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"volumes"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      - "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"\"./database:/var/lib/mysql\""}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9477a5"},"children":[{"type":"text","value":"# Important, don't remove"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"environment"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"MYSQL_ROOT_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"insecure"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"MYSQL_DATABASE"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"photoprism"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"MYSQL_USER"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"photoprism"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-18810c"},"children":[{"type":"text","value":"MYSQL_PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-4c91c4"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-525fbc"},"children":[{"type":"text","value":"insecure"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-db7588{color:#79C0FF}.ct-9477a5{color:#8B949E}.ct-525fbc{color:#A5D6FF}.ct-4c91c4{color:#C9D1D9}.ct-18810c{color:#7EE787}.light .ct-18810c{color:#268BD2}.light .ct-4c91c4{color:#657B83}.light .ct-525fbc{color:#2AA198}.light .ct-9477a5{color:#93A1A1}.light .ct-db7588{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"docker-compose-file-to-run-it","depth":2,"text":"Docker compose file to run it"}]}},"_type":"markdown","_id":"content:Linux:Google photos alternative with Photoprism.md","_source":"content","_file":"Linux/Google photos alternative with Photoprism.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/pVAGVLBNPu.json b/docs/api/_content/query/pVAGVLBNPu.json index 55da942..a3f8d43 100644 --- a/docs/api/_content/query/pVAGVLBNPu.json +++ b/docs/api/_content/query/pVAGVLBNPu.json @@ -1 +1 @@ -{"_path":"/linux/rsync-file-with-ssh","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Rsync File With SSH","description":"Downloads file from #SSH with rsync and puts it in current folder.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Downloads file from #SSH with rsync and puts it in current folder."}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\n\nPORT=22\nUSER=user\nHOST=example.com\nREMOTE_PATH=/tmp\nREMOTE_FILE=sample.text\nDEST_PATH=./\n\nrsync -a -e \"ssh -p $PORT\" -P -v \\\n \"$USER@$HOST:$REMOTE_PATH/$REMOTE_FILE\" \\\n \"$DEST_PATH\"\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"#!/bin/bash\n\nPORT=22\nUSER=user\nHOST=example.com\nREMOTE_PATH=/tmp\nREMOTE_FILE=sample.text\nDEST_PATH=./\n\nrsync -a -e \"ssh -p $PORT\" -P -v \\\n \"$USER@$HOST:$REMOTE_PATH/$REMOTE_FILE\" \\\n \"$DEST_PATH\"\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Downloads file from #SSH with rsync and puts it in current folder."}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\n\nPORT=22\nUSER=user\nHOST=example.com\nREMOTE_PATH=/tmp\nREMOTE_FILE=sample.text\nDEST_PATH=./\n\nrsync -a -e \"ssh -p $PORT\" -P -v \\\n \"$USER@$HOST:$REMOTE_PATH/$REMOTE_FILE\" \\\n \"$DEST_PATH\"\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-90ed2f"},"children":[{"type":"text","value":"#!/bin/bash"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ea4740"},"children":[{"type":"text","value":"PORT=22"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ea4740"},"children":[{"type":"text","value":"USER=user"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ea4740"},"children":[{"type":"text","value":"HOST=example.com"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ea4740"},"children":[{"type":"text","value":"REMOTE_PATH=/tmp"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ea4740"},"children":[{"type":"text","value":"REMOTE_FILE=sample.text"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ea4740"},"children":[{"type":"text","value":"DEST_PATH=./"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ea4740"},"children":[{"type":"text","value":"rsync -a -e "}]},{"type":"element","tag":"span","props":{"class":"ct-51c85e"},"children":[{"type":"text","value":"\"ssh -p "}]},{"type":"element","tag":"span","props":{"class":"ct-6e26d5"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7ae610"},"children":[{"type":"text","value":"PORT"}]},{"type":"element","tag":"span","props":{"class":"ct-51c85e"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-ea4740"},"children":[{"type":"text","value":" -P -v \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ea4740"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-51c85e"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-6e26d5"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7ae610"},"children":[{"type":"text","value":"USER"}]},{"type":"element","tag":"span","props":{"class":"ct-51c85e"},"children":[{"type":"text","value":"@"}]},{"type":"element","tag":"span","props":{"class":"ct-6e26d5"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7ae610"},"children":[{"type":"text","value":"HOST"}]},{"type":"element","tag":"span","props":{"class":"ct-51c85e"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-6e26d5"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7ae610"},"children":[{"type":"text","value":"REMOTE_PATH"}]},{"type":"element","tag":"span","props":{"class":"ct-51c85e"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-6e26d5"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7ae610"},"children":[{"type":"text","value":"REMOTE_FILE"}]},{"type":"element","tag":"span","props":{"class":"ct-51c85e"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-ea4740"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ea4740"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-51c85e"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-6e26d5"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-7ae610"},"children":[{"type":"text","value":"DEST_PATH"}]},{"type":"element","tag":"span","props":{"class":"ct-51c85e"},"children":[{"type":"text","value":"\""}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-7ae610{color:#C9D1D9}.ct-6e26d5{color:#C9D1D9}.ct-51c85e{color:#A5D6FF}.ct-ea4740{color:#C9D1D9}.ct-90ed2f{color:#8B949E}.light .ct-90ed2f{color:#93A1A1}.light .ct-ea4740{color:#657B83}.light .ct-51c85e{color:#2AA198}.light .ct-6e26d5{color:#859900}.light .ct-7ae610{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Linux:Rsync file with SSH.md","_source":"content","_file":"Linux/Rsync file with SSH.md","_extension":"md"} \ No newline at end of file +{"_path":"/linux/rsync-file-with-ssh","_dir":"linux","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Rsync File With SSH","description":"Downloads file from #SSH with rsync and puts it in current folder.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Downloads file from #SSH with rsync and puts it in current folder."}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\n\nPORT=22\nUSER=user\nHOST=example.com\nREMOTE_PATH=/tmp\nREMOTE_FILE=sample.text\nDEST_PATH=./\n\nrsync -a -e \"ssh -p $PORT\" -P -v \\\n \"$USER@$HOST:$REMOTE_PATH/$REMOTE_FILE\" \\\n \"$DEST_PATH\"\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"#!/bin/bash\n\nPORT=22\nUSER=user\nHOST=example.com\nREMOTE_PATH=/tmp\nREMOTE_FILE=sample.text\nDEST_PATH=./\n\nrsync -a -e \"ssh -p $PORT\" -P -v \\\n \"$USER@$HOST:$REMOTE_PATH/$REMOTE_FILE\" \\\n \"$DEST_PATH\"\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Downloads file from #SSH with rsync and puts it in current folder."}]},{"type":"element","tag":"code","props":{"code":"#!/bin/bash\n\nPORT=22\nUSER=user\nHOST=example.com\nREMOTE_PATH=/tmp\nREMOTE_FILE=sample.text\nDEST_PATH=./\n\nrsync -a -e \"ssh -p $PORT\" -P -v \\\n \"$USER@$HOST:$REMOTE_PATH/$REMOTE_FILE\" \\\n \"$DEST_PATH\"\n","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6bdabe"},"children":[{"type":"text","value":"#!/bin/bash"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-26e021"},"children":[{"type":"text","value":"PORT=22"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-26e021"},"children":[{"type":"text","value":"USER=user"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-26e021"},"children":[{"type":"text","value":"HOST=example.com"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-26e021"},"children":[{"type":"text","value":"REMOTE_PATH=/tmp"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-26e021"},"children":[{"type":"text","value":"REMOTE_FILE=sample.text"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-26e021"},"children":[{"type":"text","value":"DEST_PATH=./"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-26e021"},"children":[{"type":"text","value":"rsync -a -e "}]},{"type":"element","tag":"span","props":{"class":"ct-e634ef"},"children":[{"type":"text","value":"\"ssh -p "}]},{"type":"element","tag":"span","props":{"class":"ct-1f63bb"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-43fe0d"},"children":[{"type":"text","value":"PORT"}]},{"type":"element","tag":"span","props":{"class":"ct-e634ef"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-26e021"},"children":[{"type":"text","value":" -P -v \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-26e021"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e634ef"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-1f63bb"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-43fe0d"},"children":[{"type":"text","value":"USER"}]},{"type":"element","tag":"span","props":{"class":"ct-e634ef"},"children":[{"type":"text","value":"@"}]},{"type":"element","tag":"span","props":{"class":"ct-1f63bb"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-43fe0d"},"children":[{"type":"text","value":"HOST"}]},{"type":"element","tag":"span","props":{"class":"ct-e634ef"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-1f63bb"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-43fe0d"},"children":[{"type":"text","value":"REMOTE_PATH"}]},{"type":"element","tag":"span","props":{"class":"ct-e634ef"},"children":[{"type":"text","value":"/"}]},{"type":"element","tag":"span","props":{"class":"ct-1f63bb"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-43fe0d"},"children":[{"type":"text","value":"REMOTE_FILE"}]},{"type":"element","tag":"span","props":{"class":"ct-e634ef"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-26e021"},"children":[{"type":"text","value":" \\"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-26e021"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e634ef"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-1f63bb"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-43fe0d"},"children":[{"type":"text","value":"DEST_PATH"}]},{"type":"element","tag":"span","props":{"class":"ct-e634ef"},"children":[{"type":"text","value":"\""}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-43fe0d{color:#C9D1D9}.ct-1f63bb{color:#C9D1D9}.ct-e634ef{color:#A5D6FF}.ct-26e021{color:#C9D1D9}.ct-6bdabe{color:#8B949E}.light .ct-6bdabe{color:#93A1A1}.light .ct-26e021{color:#657B83}.light .ct-e634ef{color:#2AA198}.light .ct-1f63bb{color:#859900}.light .ct-43fe0d{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Linux:Rsync file with SSH.md","_source":"content","_file":"Linux/Rsync file with SSH.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/pv8ckH0an3.json b/docs/api/_content/query/pv8ckH0an3.json index 3eb6880..9bea5c0 100644 --- a/docs/api/_content/query/pv8ckH0an3.json +++ b/docs/api/_content/query/pv8ckH0an3.json @@ -1 +1 @@ -{"_path":"/frontend/react-native/preserve-flatlist-scroll-position-in-react-native","_dir":"react-native","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Preserve FlatList Scroll Position In React Native","description":"Sometimes you need to keep scroll position of FlatList in React Native after some user interactions.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you need to keep scroll position of "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"FlatList"}]},{"type":"text","value":" in React Native after some user interactions."}]},{"type":"element","tag":"code","props":{"code":"// interact() is doing some stuff, that changes FlatList scroll size\ntype Props = { interact: () => void; }\n\nconst SomeList: FC = ({ interact }) => {\n const scrollPosition = useRef(0);\n const scrollHeight = useRef(0);\n \n // set it to `true` before interaction and back to `false` right after\n const shouldKeepScrollPosition = useRef(false);\n\n const onScroll = useCallback(\n (event: NativeSyntheticEvent) => {\n scrollPosition.current = event.nativeEvent.contentOffset.y;\n },\n [],\n );\n\n const onContentSizeChange = useCallback((_: number, h: number) => {\n if (!shouldKeepScrollPosition.current) {\n scrollHeight.current = h;\n return;\n }\n\n ref.current?.scrollToOffset({\n offset: scrollPosition.current + (h - scrollHeight.current),\n animated: false,\n });\n\n scrollHeight.current = h;\n }, []);\n\n // onInteraction wraps interaction to preserve scroll position\n const onInteraction = useCallback(\n () => {\n shouldKeepScrollPosition.current = true;\n\n setTimeout(() => {\n interact();\n }, 0);\n\n setTimeout(() => {\n shouldKeepScrollPosition.current = false;\n }, 500);\n },\n [setSelectedSubThemes],\n );\n \n return (\n \n )\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// interact() is doing some stuff, that changes FlatList scroll size\ntype Props = { interact: () => void; }\n\nconst SomeList: FC = ({ interact }) => {\n const scrollPosition = useRef(0);\n const scrollHeight = useRef(0);\n \n // set it to `true` before interaction and back to `false` right after\n const shouldKeepScrollPosition = useRef(false);\n\n const onScroll = useCallback(\n (event: NativeSyntheticEvent) => {\n scrollPosition.current = event.nativeEvent.contentOffset.y;\n },\n [],\n );\n\n const onContentSizeChange = useCallback((_: number, h: number) => {\n if (!shouldKeepScrollPosition.current) {\n scrollHeight.current = h;\n return;\n }\n\n ref.current?.scrollToOffset({\n offset: scrollPosition.current + (h - scrollHeight.current),\n animated: false,\n });\n\n scrollHeight.current = h;\n }, []);\n\n // onInteraction wraps interaction to preserve scroll position\n const onInteraction = useCallback(\n () => {\n shouldKeepScrollPosition.current = true;\n\n setTimeout(() => {\n interact();\n }, 0);\n\n setTimeout(() => {\n shouldKeepScrollPosition.current = false;\n }, 500);\n },\n [setSelectedSubThemes],\n );\n \n return (\n \n )\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you need to keep scroll position of "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"FlatList"}]},{"type":"text","value":" in React Native after some user interactions."}]},{"type":"element","tag":"code","props":{"code":"// interact() is doing some stuff, that changes FlatList scroll size\ntype Props = { interact: () => void; }\n\nconst SomeList: FC = ({ interact }) => {\n const scrollPosition = useRef(0);\n const scrollHeight = useRef(0);\n \n // set it to `true` before interaction and back to `false` right after\n const shouldKeepScrollPosition = useRef(false);\n\n const onScroll = useCallback(\n (event: NativeSyntheticEvent) => {\n scrollPosition.current = event.nativeEvent.contentOffset.y;\n },\n [],\n );\n\n const onContentSizeChange = useCallback((_: number, h: number) => {\n if (!shouldKeepScrollPosition.current) {\n scrollHeight.current = h;\n return;\n }\n\n ref.current?.scrollToOffset({\n offset: scrollPosition.current + (h - scrollHeight.current),\n animated: false,\n });\n\n scrollHeight.current = h;\n }, []);\n\n // onInteraction wraps interaction to preserve scroll position\n const onInteraction = useCallback(\n () => {\n shouldKeepScrollPosition.current = true;\n\n setTimeout(() => {\n interact();\n }, 0);\n\n setTimeout(() => {\n shouldKeepScrollPosition.current = false;\n }, 500);\n },\n [setSelectedSubThemes],\n );\n \n return (\n \n )\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c6b575"},"children":[{"type":"text","value":"// interact() is doing some stuff, that changes FlatList scroll size"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a145b1"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-244c86"},"children":[{"type":"text","value":"Props"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-a7b241"},"children":[{"type":"text","value":"interact"}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-a145b1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-3ddc63"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"; }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-2557c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fb9d68"},"children":[{"type":"text","value":"SomeList"}]},{"type":"element","tag":"span","props":{"class":"ct-52106b"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-623bef"},"children":[{"type":"text","value":"FC"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-623bef"},"children":[{"type":"text","value":"Props"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-52106b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" ({ "}]},{"type":"element","tag":"span","props":{"class":"ct-b1edfd"},"children":[{"type":"text","value":"interact"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-2557c5"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a145b1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-482fe5"},"children":[{"type":"text","value":"scrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a7b241"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-87df16"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a145b1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-482fe5"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a7b241"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-87df16"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6b575"},"children":[{"type":"text","value":"// set it to `true` before interaction and back to `false` right after"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a145b1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-482fe5"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a7b241"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-df769e"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a145b1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-482fe5"},"children":[{"type":"text","value":"onScroll"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a7b241"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-b1edfd"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-52106b"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-623bef"},"children":[{"type":"text","value":"NativeSyntheticEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-623bef"},"children":[{"type":"text","value":"NativeScrollEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":">) "}]},{"type":"element","tag":"span","props":{"class":"ct-2557c5"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"scrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"nativeEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"contentOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"y"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" [],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2557c5"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-428713"},"children":[{"type":"text","value":"onContentSizeChange"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-52106b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fb9d68"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-b1edfd"},"children":[{"type":"text","value":"_"}]},{"type":"element","tag":"span","props":{"class":"ct-52106b"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-481e50"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-b1edfd"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-52106b"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-481e50"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-2557c5"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-86daaf"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"ref"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-a7b241"},"children":[{"type":"text","value":"scrollToOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" offset: "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"scrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" animated: "}]},{"type":"element","tag":"span","props":{"class":"ct-df769e"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" }, []);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6b575"},"children":[{"type":"text","value":"// onInteraction wraps interaction to preserve scroll position"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a145b1"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-482fe5"},"children":[{"type":"text","value":"onInteraction"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a7b241"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-a145b1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-df769e"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-482fe5"},"children":[{"type":"text","value":"setTimeout"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-a145b1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a7b241"},"children":[{"type":"text","value":"interact"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" }, "}]},{"type":"element","tag":"span","props":{"class":"ct-87df16"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-482fe5"},"children":[{"type":"text","value":"setTimeout"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-a145b1"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-df769e"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" }, "}]},{"type":"element","tag":"span","props":{"class":"ct-87df16"},"children":[{"type":"text","value":"500"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"setSelectedSubThemes"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-75fcd0"},"children":[{"type":"text","value":"FlatList"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c6b575"},"children":[{"type":"text","value":"// ...required FlatList options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"ref"}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"ref"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"onContentSizeChange"}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"onContentSizeChange"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"onRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"onRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"onScroll"}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-2686a0"},"children":[{"type":"text","value":"onScroll"}]},{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-61ac67"},"children":[{"type":"text","value":"/>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":" )"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f062c5"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-75fcd0{color:#FFA657}.ct-481e50{color:#79C0FF}.ct-428713{color:#79C0FF}.ct-2686a0{color:#C9D1D9}.ct-df769e{color:#79C0FF}.ct-87df16{color:#79C0FF}.ct-482fe5{color:#79C0FF}.ct-b1edfd{color:#FFA657}.ct-623bef{color:#FFA657}.ct-52106b{color:#FF7B72}.ct-fb9d68{color:#D2A8FF}.ct-86daaf{color:#C9D1D9}.ct-2557c5{color:#FF7B72}.ct-3ddc63{color:#79C0FF}.ct-a7b241{color:#D2A8FF}.ct-61ac67{color:#FF7B72}.ct-244c86{color:#FFA657}.ct-f062c5{color:#C9D1D9}.ct-a145b1{color:#FF7B72}.ct-c6b575{color:#8B949E}.light .ct-c6b575{color:#93A1A1}.light .ct-a145b1{color:#073642}.light .ct-f062c5{color:#657B83}.light .ct-244c86{color:#268BD2}.light .ct-61ac67{color:#859900}.light .ct-a7b241{color:#268BD2}.light .ct-3ddc63{color:#859900}.light .ct-2557c5{color:#073642}.light .ct-86daaf{color:#657B83}.light .ct-fb9d68{color:#268BD2}.light .ct-52106b{color:#859900}.light .ct-623bef{color:#268BD2}.light .ct-b1edfd{color:#657B83}.light .ct-482fe5{color:#268BD2}.light .ct-87df16{color:#D33682}.light .ct-df769e{color:#B58900}.light .ct-2686a0{color:#268BD2}.light .ct-428713{color:#268BD2}.light .ct-481e50{color:#859900}.light .ct-75fcd0{color:#657B83}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:React Native:Preserve FlatList scroll position in React Native.md","_source":"content","_file":"Frontend/React Native/Preserve FlatList scroll position in React Native.md","_extension":"md"} \ No newline at end of file +{"_path":"/frontend/react-native/preserve-flatlist-scroll-position-in-react-native","_dir":"react-native","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Preserve FlatList Scroll Position In React Native","description":"Sometimes you need to keep scroll position of FlatList in React Native after some user interactions.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you need to keep scroll position of "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"FlatList"}]},{"type":"text","value":" in React Native after some user interactions."}]},{"type":"element","tag":"code","props":{"code":"// interact() is doing some stuff, that changes FlatList scroll size\ntype Props = { interact: () => void; }\n\nconst SomeList: FC = ({ interact }) => {\n const scrollPosition = useRef(0);\n const scrollHeight = useRef(0);\n \n // set it to `true` before interaction and back to `false` right after\n const shouldKeepScrollPosition = useRef(false);\n\n const onScroll = useCallback(\n (event: NativeSyntheticEvent) => {\n scrollPosition.current = event.nativeEvent.contentOffset.y;\n },\n [],\n );\n\n const onContentSizeChange = useCallback((_: number, h: number) => {\n if (!shouldKeepScrollPosition.current) {\n scrollHeight.current = h;\n return;\n }\n\n ref.current?.scrollToOffset({\n offset: scrollPosition.current + (h - scrollHeight.current),\n animated: false,\n });\n\n scrollHeight.current = h;\n }, []);\n\n // onInteraction wraps interaction to preserve scroll position\n const onInteraction = useCallback(\n () => {\n shouldKeepScrollPosition.current = true;\n\n setTimeout(() => {\n interact();\n }, 0);\n\n setTimeout(() => {\n shouldKeepScrollPosition.current = false;\n }, 500);\n },\n [setSelectedSubThemes],\n );\n \n return (\n \n )\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// interact() is doing some stuff, that changes FlatList scroll size\ntype Props = { interact: () => void; }\n\nconst SomeList: FC = ({ interact }) => {\n const scrollPosition = useRef(0);\n const scrollHeight = useRef(0);\n \n // set it to `true` before interaction and back to `false` right after\n const shouldKeepScrollPosition = useRef(false);\n\n const onScroll = useCallback(\n (event: NativeSyntheticEvent) => {\n scrollPosition.current = event.nativeEvent.contentOffset.y;\n },\n [],\n );\n\n const onContentSizeChange = useCallback((_: number, h: number) => {\n if (!shouldKeepScrollPosition.current) {\n scrollHeight.current = h;\n return;\n }\n\n ref.current?.scrollToOffset({\n offset: scrollPosition.current + (h - scrollHeight.current),\n animated: false,\n });\n\n scrollHeight.current = h;\n }, []);\n\n // onInteraction wraps interaction to preserve scroll position\n const onInteraction = useCallback(\n () => {\n shouldKeepScrollPosition.current = true;\n\n setTimeout(() => {\n interact();\n }, 0);\n\n setTimeout(() => {\n shouldKeepScrollPosition.current = false;\n }, 500);\n },\n [setSelectedSubThemes],\n );\n \n return (\n \n )\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Sometimes you need to keep scroll position of "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"FlatList"}]},{"type":"text","value":" in React Native after some user interactions."}]},{"type":"element","tag":"code","props":{"code":"// interact() is doing some stuff, that changes FlatList scroll size\ntype Props = { interact: () => void; }\n\nconst SomeList: FC = ({ interact }) => {\n const scrollPosition = useRef(0);\n const scrollHeight = useRef(0);\n \n // set it to `true` before interaction and back to `false` right after\n const shouldKeepScrollPosition = useRef(false);\n\n const onScroll = useCallback(\n (event: NativeSyntheticEvent) => {\n scrollPosition.current = event.nativeEvent.contentOffset.y;\n },\n [],\n );\n\n const onContentSizeChange = useCallback((_: number, h: number) => {\n if (!shouldKeepScrollPosition.current) {\n scrollHeight.current = h;\n return;\n }\n\n ref.current?.scrollToOffset({\n offset: scrollPosition.current + (h - scrollHeight.current),\n animated: false,\n });\n\n scrollHeight.current = h;\n }, []);\n\n // onInteraction wraps interaction to preserve scroll position\n const onInteraction = useCallback(\n () => {\n shouldKeepScrollPosition.current = true;\n\n setTimeout(() => {\n interact();\n }, 0);\n\n setTimeout(() => {\n shouldKeepScrollPosition.current = false;\n }, 500);\n },\n [setSelectedSubThemes],\n );\n \n return (\n \n )\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8b01d3"},"children":[{"type":"text","value":"// interact() is doing some stuff, that changes FlatList scroll size"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0920bc"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2a35fc"},"children":[{"type":"text","value":"Props"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"class":"ct-27f128"},"children":[{"type":"text","value":"interact"}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-0920bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-96b611"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"; }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-57abf7"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2333e8"},"children":[{"type":"text","value":"SomeList"}]},{"type":"element","tag":"span","props":{"class":"ct-f3fc59"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9684c2"},"children":[{"type":"text","value":"FC"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-9684c2"},"children":[{"type":"text","value":"Props"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":"> "}]},{"type":"element","tag":"span","props":{"class":"ct-f3fc59"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" ({ "}]},{"type":"element","tag":"span","props":{"class":"ct-6a1dbc"},"children":[{"type":"text","value":"interact"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" }) "}]},{"type":"element","tag":"span","props":{"class":"ct-57abf7"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0920bc"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f8e248"},"children":[{"type":"text","value":"scrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27f128"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c7d63c"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0920bc"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f8e248"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27f128"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c7d63c"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8b01d3"},"children":[{"type":"text","value":"// set it to `true` before interaction and back to `false` right after"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0920bc"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f8e248"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27f128"},"children":[{"type":"text","value":"useRef"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-c502a7"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0920bc"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f8e248"},"children":[{"type":"text","value":"onScroll"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27f128"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-6a1dbc"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-f3fc59"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9684c2"},"children":[{"type":"text","value":"NativeSyntheticEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-9684c2"},"children":[{"type":"text","value":"NativeScrollEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":">) "}]},{"type":"element","tag":"span","props":{"class":"ct-57abf7"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"scrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"nativeEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"contentOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"y"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" [],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-57abf7"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-75adcf"},"children":[{"type":"text","value":"onContentSizeChange"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f3fc59"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2333e8"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":"(("}]},{"type":"element","tag":"span","props":{"class":"ct-6a1dbc"},"children":[{"type":"text","value":"_"}]},{"type":"element","tag":"span","props":{"class":"ct-f3fc59"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-628890"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-6a1dbc"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-f3fc59"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-628890"},"children":[{"type":"text","value":"number"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-57abf7"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-36565b"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"ref"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-27f128"},"children":[{"type":"text","value":"scrollToOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" offset: "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"scrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"-"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" animated: "}]},{"type":"element","tag":"span","props":{"class":"ct-c502a7"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"scrollHeight"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"h"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" }, []);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8b01d3"},"children":[{"type":"text","value":"// onInteraction wraps interaction to preserve scroll position"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0920bc"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f8e248"},"children":[{"type":"text","value":"onInteraction"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27f128"},"children":[{"type":"text","value":"useCallback"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-0920bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c502a7"},"children":[{"type":"text","value":"true"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f8e248"},"children":[{"type":"text","value":"setTimeout"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-0920bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-27f128"},"children":[{"type":"text","value":"interact"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" }, "}]},{"type":"element","tag":"span","props":{"class":"ct-c7d63c"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f8e248"},"children":[{"type":"text","value":"setTimeout"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"class":"ct-0920bc"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"shouldKeepScrollPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c502a7"},"children":[{"type":"text","value":"false"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" }, "}]},{"type":"element","tag":"span","props":{"class":"ct-c7d63c"},"children":[{"type":"text","value":"500"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" ["}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"setSelectedSubThemes"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" );"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" ("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"<"}]},{"type":"element","tag":"span","props":{"class":"ct-459b98"},"children":[{"type":"text","value":"FlatList"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8b01d3"},"children":[{"type":"text","value":"// ...required FlatList options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"ref"}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"ref"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"onContentSizeChange"}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"onContentSizeChange"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"onRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"onRefresh"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"onScroll"}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"{"}]},{"type":"element","tag":"span","props":{"class":"ct-592d02"},"children":[{"type":"text","value":"onScroll"}]},{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6295d2"},"children":[{"type":"text","value":"/>"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":" )"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-691188"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-459b98{color:#FFA657}.ct-628890{color:#79C0FF}.ct-75adcf{color:#79C0FF}.ct-592d02{color:#C9D1D9}.ct-c502a7{color:#79C0FF}.ct-c7d63c{color:#79C0FF}.ct-f8e248{color:#79C0FF}.ct-6a1dbc{color:#FFA657}.ct-9684c2{color:#FFA657}.ct-f3fc59{color:#FF7B72}.ct-2333e8{color:#D2A8FF}.ct-36565b{color:#C9D1D9}.ct-57abf7{color:#FF7B72}.ct-96b611{color:#79C0FF}.ct-27f128{color:#D2A8FF}.ct-6295d2{color:#FF7B72}.ct-2a35fc{color:#FFA657}.ct-691188{color:#C9D1D9}.ct-0920bc{color:#FF7B72}.ct-8b01d3{color:#8B949E}.light .ct-8b01d3{color:#93A1A1}.light .ct-0920bc{color:#073642}.light .ct-691188{color:#657B83}.light .ct-2a35fc{color:#268BD2}.light .ct-6295d2{color:#859900}.light .ct-27f128{color:#268BD2}.light .ct-96b611{color:#859900}.light .ct-57abf7{color:#073642}.light .ct-36565b{color:#657B83}.light .ct-2333e8{color:#268BD2}.light .ct-f3fc59{color:#859900}.light .ct-9684c2{color:#268BD2}.light .ct-6a1dbc{color:#657B83}.light .ct-f8e248{color:#268BD2}.light .ct-c7d63c{color:#D33682}.light .ct-c502a7{color:#B58900}.light .ct-592d02{color:#268BD2}.light .ct-75adcf{color:#268BD2}.light .ct-628890{color:#859900}.light .ct-459b98{color:#657B83}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:React Native:Preserve FlatList scroll position in React Native.md","_source":"content","_file":"Frontend/React Native/Preserve FlatList scroll position in React Native.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/rNRhET0KmZ.json b/docs/api/_content/query/rNRhET0KmZ.json index 1605267..7c6d6cf 100644 --- a/docs/api/_content/query/rNRhET0KmZ.json +++ b/docs/api/_content/query/rNRhET0KmZ.json @@ -1 +1 @@ -{"_path":"/docker/github-pages-with-drone-ci","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Github Pages With Drone Ci","description":"To deploy github pages with Drone-ci you will need .drone.yml as specified below. You also should define secrets github_username and github_token (get it here) in your drone's repository setup.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To deploy github pages with "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":" you will need "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".drone.yml"}]},{"type":"text","value":" as specified below. You also should define secrets "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"github_username"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"github_token"}]},{"type":"text","value":" (get it "},{"type":"element","tag":"a","props":{"href":"https://github.com/settings/tokens","rel":["nofollow"]},"children":[{"type":"text","value":"here"}]},{"type":"text","value":") in your drone's repository setup."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Github repository should be named as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"yourname.github.io"}]},{"type":"text","value":" and it could be accessed at "},{"type":"element","tag":"a","props":{"href":"https://yourname.github.io/","rel":["nofollow"]},"children":[{"type":"text","value":"https://yourname.github.io/"}]},{"type":"text","value":". Otherwise it'll be available at "},{"type":"element","tag":"a","props":{"href":"https://yourname.github.io/repo-name/","rel":["nofollow"]},"children":[{"type":"text","value":"https://yourname.github.io/repo-name/"}]},{"type":"text","value":", what you might not like."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should create branch named "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gh-pages"}]},{"type":"text","value":" in that repo and setup GH Pages at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https://github.com//.github.io/settings/pages"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This config will update "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gh-pages"}]},{"type":"text","value":" branch in your project, which will contain only generated content. I know, that's bad, but there's no better way to do that with generic drone plugins."}]},{"type":"element","tag":"code","props":{"code":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build\n image: node:16\n commands:\n - yarn\n - yarn generate\n - rm -rf ./docs\n - mv ./.output/public ./docs\n - touch ./docs/.nojekyll\n - name: publish\n image: plugins/gh-pages\n settings:\n target_branch: gh-pages\n username:\n from_secret: github_username\n password:\n from_secret: github_token\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build\n image: node:16\n commands:\n - yarn\n - yarn generate\n - rm -rf ./docs\n - mv ./.output/public ./docs\n - touch ./docs/.nojekyll\n - name: publish\n image: plugins/gh-pages\n settings:\n target_branch: gh-pages\n username:\n from_secret: github_username\n password:\n from_secret: github_token\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Here we're moving "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./.output/public"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./docs"}]},{"type":"text","value":", because #nuxt creates symlink for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docs"}]},{"type":"text","value":" and git can't work with that."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Also we create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".nojekyll"}]},{"type":"text","value":" at the root of repo, so github's internal engine won't "},{"type":"element","tag":"a","props":{"href":"https://github.blog/2009-12-29-bypassing-jekyll-on-github-pages/","rel":["nofollow"]},"children":[{"type":"text","value":"ignore files that start with underscore"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"additional-reading"},"children":[{"type":"text","value":"Additional reading"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://plugins.drone.io/plugins/gh-pages","rel":["nofollow"]},"children":[{"type":"text","value":"Drone Github Pages Documentation"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.blog/2009-12-29-bypassing-jekyll-on-github-pages/","rel":["nofollow"]},"children":[{"type":"text","value":"Bypassing Jekyll on GitHub Pages"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To deploy github pages with "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":" you will need "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".drone.yml"}]},{"type":"text","value":" as specified below. You also should define secrets "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"github_username"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"github_token"}]},{"type":"text","value":" (get it "},{"type":"element","tag":"a","props":{"href":"https://github.com/settings/tokens","rel":["nofollow"]},"children":[{"type":"text","value":"here"}]},{"type":"text","value":") in your drone's repository setup."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Github repository should be named as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"yourname.github.io"}]},{"type":"text","value":" and it could be accessed at "},{"type":"element","tag":"a","props":{"href":"https://yourname.github.io/","rel":["nofollow"]},"children":[{"type":"text","value":"https://yourname.github.io/"}]},{"type":"text","value":". Otherwise it'll be available at "},{"type":"element","tag":"a","props":{"href":"https://yourname.github.io/repo-name/","rel":["nofollow"]},"children":[{"type":"text","value":"https://yourname.github.io/repo-name/"}]},{"type":"text","value":", what you might not like."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should create branch named "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gh-pages"}]},{"type":"text","value":" in that repo and setup GH Pages at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https://github.com//.github.io/settings/pages"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This config will update "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gh-pages"}]},{"type":"text","value":" branch in your project, which will contain only generated content. I know, that's bad, but there's no better way to do that with generic drone plugins."}]},{"type":"element","tag":"code","props":{"code":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build\n image: node:16\n commands:\n - yarn\n - yarn generate\n - rm -rf ./docs\n - mv ./.output/public ./docs\n - touch ./docs/.nojekyll\n - name: publish\n image: plugins/gh-pages\n settings:\n target_branch: gh-pages\n username:\n from_secret: github_username\n password:\n from_secret: github_token\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"kind"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"pipeline"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"build"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"docker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"platform"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"os"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"linux"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"arch"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"amd64"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"steps"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"build"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"node:16"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"commands"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"yarn"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"yarn generate"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"rm -rf ./docs"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"mv ./.output/public ./docs"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"touch ./docs/.nojekyll"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"publish"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"plugins/gh-pages"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"settings"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"target_branch"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"gh-pages"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"username"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"github_username"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"password"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ff0620"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-7fc260"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-660a6f"},"children":[{"type":"text","value":"github_token"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Here we're moving "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./.output/public"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./docs"}]},{"type":"text","value":", because #nuxt creates symlink for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docs"}]},{"type":"text","value":" and git can't work with that."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Also we create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".nojekyll"}]},{"type":"text","value":" at the root of repo, so github's internal engine won't "},{"type":"element","tag":"a","props":{"href":"https://github.blog/2009-12-29-bypassing-jekyll-on-github-pages/","rel":["nofollow"]},"children":[{"type":"text","value":"ignore files that start with underscore"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"additional-reading"},"children":[{"type":"text","value":"Additional reading"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://plugins.drone.io/plugins/gh-pages","rel":["nofollow"]},"children":[{"type":"text","value":"Drone Github Pages Documentation"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.blog/2009-12-29-bypassing-jekyll-on-github-pages/","rel":["nofollow"]},"children":[{"type":"text","value":"Bypassing Jekyll on GitHub Pages"}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-660a6f{color:#A5D6FF}.ct-7fc260{color:#C9D1D9}.ct-ff0620{color:#7EE787}.light .ct-ff0620{color:#268BD2}.light .ct-7fc260{color:#657B83}.light .ct-660a6f{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"additional-reading","depth":2,"text":"Additional reading"}]}},"_type":"markdown","_id":"content:Docker:Github pages with drone-ci.md","_source":"content","_file":"Docker/Github pages with drone-ci.md","_extension":"md"} \ No newline at end of file +{"_path":"/docker/github-pages-with-drone-ci","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Github Pages With Drone Ci","description":"To deploy github pages with Drone-ci you will need .drone.yml as specified below. You also should define secrets github_username and github_token (get it here) in your drone's repository setup.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To deploy github pages with "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":" you will need "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".drone.yml"}]},{"type":"text","value":" as specified below. You also should define secrets "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"github_username"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"github_token"}]},{"type":"text","value":" (get it "},{"type":"element","tag":"a","props":{"href":"https://github.com/settings/tokens","rel":["nofollow"]},"children":[{"type":"text","value":"here"}]},{"type":"text","value":") in your drone's repository setup."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Github repository should be named as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"yourname.github.io"}]},{"type":"text","value":" and it could be accessed at "},{"type":"element","tag":"a","props":{"href":"https://yourname.github.io/","rel":["nofollow"]},"children":[{"type":"text","value":"https://yourname.github.io/"}]},{"type":"text","value":". Otherwise it'll be available at "},{"type":"element","tag":"a","props":{"href":"https://yourname.github.io/repo-name/","rel":["nofollow"]},"children":[{"type":"text","value":"https://yourname.github.io/repo-name/"}]},{"type":"text","value":", what you might not like."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should create branch named "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gh-pages"}]},{"type":"text","value":" in that repo and setup GH Pages at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https://github.com//.github.io/settings/pages"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This config will update "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gh-pages"}]},{"type":"text","value":" branch in your project, which will contain only generated content. I know, that's bad, but there's no better way to do that with generic drone plugins."}]},{"type":"element","tag":"code","props":{"code":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build\n image: node:16\n commands:\n - yarn\n - yarn generate\n - rm -rf ./docs\n - mv ./.output/public ./docs\n - touch ./docs/.nojekyll\n - name: publish\n image: plugins/gh-pages\n settings:\n target_branch: gh-pages\n username:\n from_secret: github_username\n password:\n from_secret: github_token\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build\n image: node:16\n commands:\n - yarn\n - yarn generate\n - rm -rf ./docs\n - mv ./.output/public ./docs\n - touch ./docs/.nojekyll\n - name: publish\n image: plugins/gh-pages\n settings:\n target_branch: gh-pages\n username:\n from_secret: github_username\n password:\n from_secret: github_token\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Here we're moving "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./.output/public"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./docs"}]},{"type":"text","value":", because #nuxt creates symlink for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docs"}]},{"type":"text","value":" and git can't work with that."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Also we create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".nojekyll"}]},{"type":"text","value":" at the root of repo, so github's internal engine won't "},{"type":"element","tag":"a","props":{"href":"https://github.blog/2009-12-29-bypassing-jekyll-on-github-pages/","rel":["nofollow"]},"children":[{"type":"text","value":"ignore files that start with underscore"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"additional-reading"},"children":[{"type":"text","value":"Additional reading"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://plugins.drone.io/plugins/gh-pages","rel":["nofollow"]},"children":[{"type":"text","value":"Drone Github Pages Documentation"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.blog/2009-12-29-bypassing-jekyll-on-github-pages/","rel":["nofollow"]},"children":[{"type":"text","value":"Bypassing Jekyll on GitHub Pages"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To deploy github pages with "},{"type":"element","tag":"a","props":{"href":"Drone-ci"},"children":[{"type":"text","value":"Drone-ci"}]},{"type":"text","value":" you will need "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".drone.yml"}]},{"type":"text","value":" as specified below. You also should define secrets "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"github_username"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"github_token"}]},{"type":"text","value":" (get it "},{"type":"element","tag":"a","props":{"href":"https://github.com/settings/tokens","rel":["nofollow"]},"children":[{"type":"text","value":"here"}]},{"type":"text","value":") in your drone's repository setup."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Github repository should be named as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"yourname.github.io"}]},{"type":"text","value":" and it could be accessed at "},{"type":"element","tag":"a","props":{"href":"https://yourname.github.io/","rel":["nofollow"]},"children":[{"type":"text","value":"https://yourname.github.io/"}]},{"type":"text","value":". Otherwise it'll be available at "},{"type":"element","tag":"a","props":{"href":"https://yourname.github.io/repo-name/","rel":["nofollow"]},"children":[{"type":"text","value":"https://yourname.github.io/repo-name/"}]},{"type":"text","value":", what you might not like."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You should create branch named "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gh-pages"}]},{"type":"text","value":" in that repo and setup GH Pages at "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https://github.com//.github.io/settings/pages"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This config will update "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gh-pages"}]},{"type":"text","value":" branch in your project, which will contain only generated content. I know, that's bad, but there's no better way to do that with generic drone plugins."}]},{"type":"element","tag":"code","props":{"code":"kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build\n image: node:16\n commands:\n - yarn\n - yarn generate\n - rm -rf ./docs\n - mv ./.output/public ./docs\n - touch ./docs/.nojekyll\n - name: publish\n image: plugins/gh-pages\n settings:\n target_branch: gh-pages\n username:\n from_secret: github_username\n password:\n from_secret: github_token\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"kind"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"pipeline"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"build"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"type"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"docker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"platform"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"os"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"linux"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"arch"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"amd64"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"steps"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"build"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"node:16"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"commands"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"yarn"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"yarn generate"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"rm -rf ./docs"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"mv ./.output/public ./docs"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"touch ./docs/.nojekyll"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"name"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"publish"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"plugins/gh-pages"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"settings"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"target_branch"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"gh-pages"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"username"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"github_username"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"password"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-c98cc9"},"children":[{"type":"text","value":"from_secret"}]},{"type":"element","tag":"span","props":{"class":"ct-b98996"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ebd133"},"children":[{"type":"text","value":"github_token"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Here we're moving "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./.output/public"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"./docs"}]},{"type":"text","value":", because #nuxt creates symlink for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docs"}]},{"type":"text","value":" and git can't work with that."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Also we create "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".nojekyll"}]},{"type":"text","value":" at the root of repo, so github's internal engine won't "},{"type":"element","tag":"a","props":{"href":"https://github.blog/2009-12-29-bypassing-jekyll-on-github-pages/","rel":["nofollow"]},"children":[{"type":"text","value":"ignore files that start with underscore"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"additional-reading"},"children":[{"type":"text","value":"Additional reading"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://plugins.drone.io/plugins/gh-pages","rel":["nofollow"]},"children":[{"type":"text","value":"Drone Github Pages Documentation"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://github.blog/2009-12-29-bypassing-jekyll-on-github-pages/","rel":["nofollow"]},"children":[{"type":"text","value":"Bypassing Jekyll on GitHub Pages"}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-ebd133{color:#A5D6FF}.ct-b98996{color:#C9D1D9}.ct-c98cc9{color:#7EE787}.light .ct-c98cc9{color:#268BD2}.light .ct-b98996{color:#657B83}.light .ct-ebd133{color:#2AA198}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"additional-reading","depth":2,"text":"Additional reading"}]}},"_type":"markdown","_id":"content:Docker:Github pages with drone-ci.md","_source":"content","_file":"Docker/Github pages with drone-ci.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/sxx5hHqDHF.json b/docs/api/_content/query/sxx5hHqDHF.json index 32e4d9c..0f70761 100644 --- a/docs/api/_content/query/sxx5hHqDHF.json +++ b/docs/api/_content/query/sxx5hHqDHF.json @@ -1 +1 @@ -{"_path":"/docker/common-things-with-docker-mailserver","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Common Things With Docker Mailserver","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"1-docker-mailserver-ssl-alert-number-42"},"children":[{"type":"text","value":"1. docker-mailserver SSL alert number 42"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"I was getting following error after setting up TLS certificates in docker-mailserver after setting it up with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"letsencrypt"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"TLS handshaking: SSL_accept() failed: error:14094412:SSL routines:ssl3_read_bytes:sslv3 alert bad certificate: SSL alert number 42\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"TLS handshaking: SSL_accept() failed: error:14094412:SSL routines:ssl3_read_bytes:sslv3 alert bad certificate: SSL alert number 42\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The problem was caused by two reasons"}]},{"type":"element","tag":"h3","props":{"id":"11-letsencrypt-and-wildcard-domains"},"children":[{"type":"text","value":"1.1. Letsencrypt and wildcard domains"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"My "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"MX"}]},{"type":"text","value":" domain was "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"example.com"}]},{"type":"text","value":", bu "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"letsencrypt"}]},{"type":"text","value":" have been set up with wildcard certificate on "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"*.example.com"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"So, specifying "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_MODE=letsencrypt"}]},{"type":"text","value":" made it searching for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/letsencrypt/mail.example.com"}]},{"type":"text","value":", when it was just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/letsencrypt/example.com"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION"}]},{"type":"text","value":":"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change .env file to:"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_MODE=manual"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_KEY_PATH=/etc/letsencrypt/example.com/fullchain.pem"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_KEY_PATH=/etc/letsencrypt/example.com/privkey.pem"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to modify "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-compose"}]},{"type":"text","value":" volumes and pass certs from host filesystem. Note: they're not "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail.example.com"}]},{"type":"text","value":", they're just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"example.com"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"a","props":{"href":"https://github.com/docker-mailserver/docker-mailserver/issues/1607","rel":["nofollow"]},"children":[{"type":"text","value":"ticket"}]},{"type":"text","value":" describes it well."}]},{"type":"element","tag":"h3","props":{"id":"12-docker-was-using-internal-hostname-of-docker-mailserver"},"children":[{"type":"text","value":"1.2. Docker was using internal hostname of docker-mailserver"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Internal hostname for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-mailserver"}]},{"type":"text","value":" was just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail"}]},{"type":"text","value":", and other container tried to send emails to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail:25"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION:"}]},{"type":"text","value":" change internal hostname in your app settings to actual, specified in your certificates and MX record."}]},{"type":"element","tag":"h3","props":{"id":"2-docker-mailserver-not-listening-on-25-port-smtp"},"children":[{"type":"text","value":"2. docker-mailserver not listening on 25 port (SMTP)"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Solution was to add quotes in your docker compose, just like that:"}]},{"type":"element","tag":"code","props":{"code":" ports:\n - \"25:25\"\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" ports:\n - \"25:25\"\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"a","props":{"href":"https://github.com/docker-mailserver/docker-mailserver/issues/684#issuecomment-322029794","rel":["nofollow"]},"children":[{"type":"text","value":"ticket"}]},{"type":"text","value":" solved it"}]},{"type":"element","tag":"h3","props":{"id":"3-connect-to-docker-mailserver-from-other-docker-compose"},"children":[{"type":"text","value":"3. Connect to docker-mailserver from other docker-compose"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"I've had "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mailserver/compose.yaml"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"application/compose.yaml"}]},{"type":"text","value":" and needed to connect "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"application"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mailserver"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"// application/compose.yaml\napp:\n networks:\n - shared\nnetworks:\n shared:\n driver: bridge\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// application/compose.yaml\napp:\n networks:\n - shared\nnetworks:\n shared:\n driver: bridge\n"}]}]}]},{"type":"element","tag":"code","props":{"code":"/// mailserver/compose.yaml\nmail:\n networks:\n - \"application_shared\"\nnetworks:\n application_shared:\n external: true\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"/// mailserver/compose.yaml\nmail:\n networks:\n - \"application_shared\"\nnetworks:\n application_shared:\n external: true\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"4-how-to-convert-dkim-mailtxt-to-dns-record"},"children":[{"type":"text","value":"4. How to convert DKIM mail.txt to DNS record"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"My "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail.txt"}]},{"type":"text","value":" was like:"}]},{"type":"element","tag":"code","props":{"code":"mail._domainkey IN TXT ( \"v=DKIM1; h=sha256; k=rsa; \"\n \"p=sOmEJuNkLiKeRaNdOmOrLikeThat\"\n \"eVeNmOrERANdOmStuFf\" ) ; ----- DKIM key mail for example.com\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"mail._domainkey IN TXT ( \"v=DKIM1; h=sha256; k=rsa; \"\n \"p=sOmEJuNkLiKeRaNdOmOrLikeThat\"\n \"eVeNmOrERANdOmStuFf\" ) ; ----- DKIM key mail for example.com\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION"}]},{"type":"text","value":": concatenate all strings inside round brackets:"}]},{"type":"element","tag":"code","props":{"code":"v=DKIM1; h=sha256; k=rsa; p=sOmEJuNkLiKeRaNdOmOrLikeThateVeNmOrERANdOmStuFf\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"v=DKIM1; h=sha256; k=rsa; p=sOmEJuNkLiKeRaNdOmOrLikeThateVeNmOrERANdOmStuFf\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"And add them as a "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"TXT"}]},{"type":"text","value":" record on my DNS provider control panel under "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail._domainkey"}]},{"type":"text","value":" record."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Solution was right in "},{"type":"element","tag":"a","props":{"href":"https://docker-mailserver.github.io/docker-mailserver/edge/config/best-practices/dkim_dmarc_spf/#dkim-dns","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]},{"type":"text","value":", just hidden a little bit."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"1-docker-mailserver-ssl-alert-number-42"},"children":[{"type":"text","value":"1. docker-mailserver SSL alert number 42"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"I was getting following error after setting up TLS certificates in docker-mailserver after setting it up with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"letsencrypt"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"TLS handshaking: SSL_accept() failed: error:14094412:SSL routines:ssl3_read_bytes:sslv3 alert bad certificate: SSL alert number 42\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"TLS handshaking: SSL_accept() failed: error:14094412:SSL routines:ssl3_read_bytes:sslv3 alert bad certificate: SSL alert number 42"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The problem was caused by two reasons"}]},{"type":"element","tag":"h3","props":{"id":"11-letsencrypt-and-wildcard-domains"},"children":[{"type":"text","value":"1.1. Letsencrypt and wildcard domains"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"My "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"MX"}]},{"type":"text","value":" domain was "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"example.com"}]},{"type":"text","value":", bu "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"letsencrypt"}]},{"type":"text","value":" have been set up with wildcard certificate on "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"*.example.com"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"So, specifying "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_MODE=letsencrypt"}]},{"type":"text","value":" made it searching for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/letsencrypt/mail.example.com"}]},{"type":"text","value":", when it was just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/letsencrypt/example.com"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION"}]},{"type":"text","value":":"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change .env file to:"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_MODE=manual"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_KEY_PATH=/etc/letsencrypt/example.com/fullchain.pem"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_KEY_PATH=/etc/letsencrypt/example.com/privkey.pem"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to modify "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-compose"}]},{"type":"text","value":" volumes and pass certs from host filesystem. Note: they're not "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail.example.com"}]},{"type":"text","value":", they're just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"example.com"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"a","props":{"href":"https://github.com/docker-mailserver/docker-mailserver/issues/1607","rel":["nofollow"]},"children":[{"type":"text","value":"ticket"}]},{"type":"text","value":" describes it well."}]},{"type":"element","tag":"h3","props":{"id":"12-docker-was-using-internal-hostname-of-docker-mailserver"},"children":[{"type":"text","value":"1.2. Docker was using internal hostname of docker-mailserver"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Internal hostname for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-mailserver"}]},{"type":"text","value":" was just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail"}]},{"type":"text","value":", and other container tried to send emails to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail:25"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION:"}]},{"type":"text","value":" change internal hostname in your app settings to actual, specified in your certificates and MX record."}]},{"type":"element","tag":"h3","props":{"id":"2-docker-mailserver-not-listening-on-25-port-smtp"},"children":[{"type":"text","value":"2. docker-mailserver not listening on 25 port (SMTP)"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Solution was to add quotes in your docker compose, just like that:"}]},{"type":"element","tag":"code","props":{"code":" ports:\n - \"25:25\"\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a3d48f"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-b4fc78"},"children":[{"type":"text","value":"\"25:25\""}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"a","props":{"href":"https://github.com/docker-mailserver/docker-mailserver/issues/684#issuecomment-322029794","rel":["nofollow"]},"children":[{"type":"text","value":"ticket"}]},{"type":"text","value":" solved it"}]},{"type":"element","tag":"h3","props":{"id":"3-connect-to-docker-mailserver-from-other-docker-compose"},"children":[{"type":"text","value":"3. Connect to docker-mailserver from other docker-compose"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"I've had "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mailserver/compose.yaml"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"application/compose.yaml"}]},{"type":"text","value":" and needed to connect "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"application"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mailserver"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"// application/compose.yaml\napp:\n networks:\n - shared\nnetworks:\n shared:\n driver: bridge\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b4fc78"},"children":[{"type":"text","value":"// application/compose.yaml"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a3d48f"},"children":[{"type":"text","value":"app"}]},{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a3d48f"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-b4fc78"},"children":[{"type":"text","value":"shared"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a3d48f"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a3d48f"},"children":[{"type":"text","value":"shared"}]},{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a3d48f"},"children":[{"type":"text","value":"driver"}]},{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-b4fc78"},"children":[{"type":"text","value":"bridge"}]}]}]}]}]},{"type":"element","tag":"code","props":{"code":"/// mailserver/compose.yaml\nmail:\n networks:\n - \"application_shared\"\nnetworks:\n application_shared:\n external: true\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b4fc78"},"children":[{"type":"text","value":"/// mailserver/compose.yaml"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a3d48f"},"children":[{"type":"text","value":"mail"}]},{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a3d48f"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-b4fc78"},"children":[{"type":"text","value":"\"application_shared\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a3d48f"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a3d48f"},"children":[{"type":"text","value":"application_shared"}]},{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a3d48f"},"children":[{"type":"text","value":"external"}]},{"type":"element","tag":"span","props":{"class":"ct-28f9a0"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-ed00fb"},"children":[{"type":"text","value":"true"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"4-how-to-convert-dkim-mailtxt-to-dns-record"},"children":[{"type":"text","value":"4. How to convert DKIM mail.txt to DNS record"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"My "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail.txt"}]},{"type":"text","value":" was like:"}]},{"type":"element","tag":"code","props":{"code":"mail._domainkey IN TXT ( \"v=DKIM1; h=sha256; k=rsa; \"\n \"p=sOmEJuNkLiKeRaNdOmOrLikeThat\"\n \"eVeNmOrERANdOmStuFf\" ) ; ----- DKIM key mail for example.com\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"mail._domainkey IN TXT ( \"v=DKIM1; h=sha256; k=rsa; \"\n \"p=sOmEJuNkLiKeRaNdOmOrLikeThat\"\n \"eVeNmOrERANdOmStuFf\" ) ; ----- DKIM key mail for example.com"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION"}]},{"type":"text","value":": concatenate all strings inside round brackets:"}]},{"type":"element","tag":"code","props":{"code":"v=DKIM1; h=sha256; k=rsa; p=sOmEJuNkLiKeRaNdOmOrLikeThateVeNmOrERANdOmStuFf\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"v=DKIM1; h=sha256; k=rsa; p=sOmEJuNkLiKeRaNdOmOrLikeThateVeNmOrERANdOmStuFf"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"And add them as a "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"TXT"}]},{"type":"text","value":" record on my DNS provider control panel under "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail._domainkey"}]},{"type":"text","value":" record."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Solution was right in "},{"type":"element","tag":"a","props":{"href":"https://docker-mailserver.github.io/docker-mailserver/edge/config/best-practices/dkim_dmarc_spf/#dkim-dns","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]},{"type":"text","value":", just hidden a little bit."}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-ed00fb{color:#79C0FF}.ct-b4fc78{color:#A5D6FF}.ct-a3d48f{color:#7EE787}.ct-28f9a0{color:#C9D1D9}.light .ct-28f9a0{color:#657B83}.light .ct-a3d48f{color:#268BD2}.light .ct-b4fc78{color:#2AA198}.light .ct-ed00fb{color:#B58900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"1-docker-mailserver-ssl-alert-number-42","depth":2,"text":"1. docker-mailserver SSL alert number 42","children":[{"id":"11-letsencrypt-and-wildcard-domains","depth":3,"text":"1.1. Letsencrypt and wildcard domains"},{"id":"12-docker-was-using-internal-hostname-of-docker-mailserver","depth":3,"text":"1.2. Docker was using internal hostname of docker-mailserver"},{"id":"2-docker-mailserver-not-listening-on-25-port-smtp","depth":3,"text":"2. docker-mailserver not listening on 25 port (SMTP)"},{"id":"3-connect-to-docker-mailserver-from-other-docker-compose","depth":3,"text":"3. Connect to docker-mailserver from other docker-compose"},{"id":"4-how-to-convert-dkim-mailtxt-to-dns-record","depth":3,"text":"4. How to convert DKIM mail.txt to DNS record"}]}]}},"_type":"markdown","_id":"content:Docker:Common things with docker-mailserver.md","_source":"content","_file":"Docker/Common things with docker-mailserver.md","_extension":"md"} \ No newline at end of file +{"_path":"/docker/common-things-with-docker-mailserver","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Common Things With Docker Mailserver","description":"","excerpt":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"1-docker-mailserver-ssl-alert-number-42"},"children":[{"type":"text","value":"1. docker-mailserver SSL alert number 42"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"I was getting following error after setting up TLS certificates in docker-mailserver after setting it up with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"letsencrypt"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"TLS handshaking: SSL_accept() failed: error:14094412:SSL routines:ssl3_read_bytes:sslv3 alert bad certificate: SSL alert number 42\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"TLS handshaking: SSL_accept() failed: error:14094412:SSL routines:ssl3_read_bytes:sslv3 alert bad certificate: SSL alert number 42\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The problem was caused by two reasons"}]},{"type":"element","tag":"h3","props":{"id":"11-letsencrypt-and-wildcard-domains"},"children":[{"type":"text","value":"1.1. Letsencrypt and wildcard domains"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"My "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"MX"}]},{"type":"text","value":" domain was "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"example.com"}]},{"type":"text","value":", bu "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"letsencrypt"}]},{"type":"text","value":" have been set up with wildcard certificate on "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"*.example.com"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"So, specifying "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_MODE=letsencrypt"}]},{"type":"text","value":" made it searching for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/letsencrypt/mail.example.com"}]},{"type":"text","value":", when it was just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/letsencrypt/example.com"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION"}]},{"type":"text","value":":"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change .env file to:"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_MODE=manual"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_KEY_PATH=/etc/letsencrypt/example.com/fullchain.pem"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_KEY_PATH=/etc/letsencrypt/example.com/privkey.pem"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to modify "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-compose"}]},{"type":"text","value":" volumes and pass certs from host filesystem. Note: they're not "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail.example.com"}]},{"type":"text","value":", they're just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"example.com"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"a","props":{"href":"https://github.com/docker-mailserver/docker-mailserver/issues/1607","rel":["nofollow"]},"children":[{"type":"text","value":"ticket"}]},{"type":"text","value":" describes it well."}]},{"type":"element","tag":"h3","props":{"id":"12-docker-was-using-internal-hostname-of-docker-mailserver"},"children":[{"type":"text","value":"1.2. Docker was using internal hostname of docker-mailserver"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Internal hostname for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-mailserver"}]},{"type":"text","value":" was just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail"}]},{"type":"text","value":", and other container tried to send emails to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail:25"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION:"}]},{"type":"text","value":" change internal hostname in your app settings to actual, specified in your certificates and MX record."}]},{"type":"element","tag":"h3","props":{"id":"2-docker-mailserver-not-listening-on-25-port-smtp"},"children":[{"type":"text","value":"2. docker-mailserver not listening on 25 port (SMTP)"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Solution was to add quotes in your docker compose, just like that:"}]},{"type":"element","tag":"code","props":{"code":" ports:\n - \"25:25\"\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":" ports:\n - \"25:25\"\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"a","props":{"href":"https://github.com/docker-mailserver/docker-mailserver/issues/684#issuecomment-322029794","rel":["nofollow"]},"children":[{"type":"text","value":"ticket"}]},{"type":"text","value":" solved it"}]},{"type":"element","tag":"h3","props":{"id":"3-connect-to-docker-mailserver-from-other-docker-compose"},"children":[{"type":"text","value":"3. Connect to docker-mailserver from other docker-compose"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"I've had "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mailserver/compose.yaml"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"application/compose.yaml"}]},{"type":"text","value":" and needed to connect "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"application"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mailserver"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"// application/compose.yaml\napp:\n networks:\n - shared\nnetworks:\n shared:\n driver: bridge\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// application/compose.yaml\napp:\n networks:\n - shared\nnetworks:\n shared:\n driver: bridge\n"}]}]}]},{"type":"element","tag":"code","props":{"code":"/// mailserver/compose.yaml\nmail:\n networks:\n - \"application_shared\"\nnetworks:\n application_shared:\n external: true\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"/// mailserver/compose.yaml\nmail:\n networks:\n - \"application_shared\"\nnetworks:\n application_shared:\n external: true\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"4-how-to-convert-dkim-mailtxt-to-dns-record"},"children":[{"type":"text","value":"4. How to convert DKIM mail.txt to DNS record"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"My "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail.txt"}]},{"type":"text","value":" was like:"}]},{"type":"element","tag":"code","props":{"code":"mail._domainkey IN TXT ( \"v=DKIM1; h=sha256; k=rsa; \"\n \"p=sOmEJuNkLiKeRaNdOmOrLikeThat\"\n \"eVeNmOrERANdOmStuFf\" ) ; ----- DKIM key mail for example.com\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"mail._domainkey IN TXT ( \"v=DKIM1; h=sha256; k=rsa; \"\n \"p=sOmEJuNkLiKeRaNdOmOrLikeThat\"\n \"eVeNmOrERANdOmStuFf\" ) ; ----- DKIM key mail for example.com\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION"}]},{"type":"text","value":": concatenate all strings inside round brackets:"}]},{"type":"element","tag":"code","props":{"code":"v=DKIM1; h=sha256; k=rsa; p=sOmEJuNkLiKeRaNdOmOrLikeThateVeNmOrERANdOmStuFf\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"v=DKIM1; h=sha256; k=rsa; p=sOmEJuNkLiKeRaNdOmOrLikeThateVeNmOrERANdOmStuFf\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"And add them as a "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"TXT"}]},{"type":"text","value":" record on my DNS provider control panel under "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail._domainkey"}]},{"type":"text","value":" record."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Solution was right in "},{"type":"element","tag":"a","props":{"href":"https://docker-mailserver.github.io/docker-mailserver/edge/config/best-practices/dkim_dmarc_spf/#dkim-dns","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]},{"type":"text","value":", just hidden a little bit."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"h2","props":{"id":"1-docker-mailserver-ssl-alert-number-42"},"children":[{"type":"text","value":"1. docker-mailserver SSL alert number 42"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"I was getting following error after setting up TLS certificates in docker-mailserver after setting it up with "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"letsencrypt"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"TLS handshaking: SSL_accept() failed: error:14094412:SSL routines:ssl3_read_bytes:sslv3 alert bad certificate: SSL alert number 42\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"TLS handshaking: SSL_accept() failed: error:14094412:SSL routines:ssl3_read_bytes:sslv3 alert bad certificate: SSL alert number 42"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The problem was caused by two reasons"}]},{"type":"element","tag":"h3","props":{"id":"11-letsencrypt-and-wildcard-domains"},"children":[{"type":"text","value":"1.1. Letsencrypt and wildcard domains"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"My "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"MX"}]},{"type":"text","value":" domain was "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"example.com"}]},{"type":"text","value":", bu "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"letsencrypt"}]},{"type":"text","value":" have been set up with wildcard certificate on "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"*.example.com"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"So, specifying "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_MODE=letsencrypt"}]},{"type":"text","value":" made it searching for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/letsencrypt/mail.example.com"}]},{"type":"text","value":", when it was just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"/etc/letsencrypt/example.com"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION"}]},{"type":"text","value":":"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Change .env file to:"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_MODE=manual"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_KEY_PATH=/etc/letsencrypt/example.com/fullchain.pem"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SSL_KEY_PATH=/etc/letsencrypt/example.com/privkey.pem"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Don't forget to modify "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-compose"}]},{"type":"text","value":" volumes and pass certs from host filesystem. Note: they're not "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail.example.com"}]},{"type":"text","value":", they're just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"example.com"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"a","props":{"href":"https://github.com/docker-mailserver/docker-mailserver/issues/1607","rel":["nofollow"]},"children":[{"type":"text","value":"ticket"}]},{"type":"text","value":" describes it well."}]},{"type":"element","tag":"h3","props":{"id":"12-docker-was-using-internal-hostname-of-docker-mailserver"},"children":[{"type":"text","value":"1.2. Docker was using internal hostname of docker-mailserver"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Internal hostname for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"docker-mailserver"}]},{"type":"text","value":" was just "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail"}]},{"type":"text","value":", and other container tried to send emails to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail:25"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION:"}]},{"type":"text","value":" change internal hostname in your app settings to actual, specified in your certificates and MX record."}]},{"type":"element","tag":"h3","props":{"id":"2-docker-mailserver-not-listening-on-25-port-smtp"},"children":[{"type":"text","value":"2. docker-mailserver not listening on 25 port (SMTP)"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Solution was to add quotes in your docker compose, just like that:"}]},{"type":"element","tag":"code","props":{"code":" ports:\n - \"25:25\"\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f60a1"},"children":[{"type":"text","value":"ports"}]},{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-f39305"},"children":[{"type":"text","value":"\"25:25\""}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This "},{"type":"element","tag":"a","props":{"href":"https://github.com/docker-mailserver/docker-mailserver/issues/684#issuecomment-322029794","rel":["nofollow"]},"children":[{"type":"text","value":"ticket"}]},{"type":"text","value":" solved it"}]},{"type":"element","tag":"h3","props":{"id":"3-connect-to-docker-mailserver-from-other-docker-compose"},"children":[{"type":"text","value":"3. Connect to docker-mailserver from other docker-compose"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"I've had "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mailserver/compose.yaml"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"application/compose.yaml"}]},{"type":"text","value":" and needed to connect "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"application"}]},{"type":"text","value":" to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mailserver"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"// application/compose.yaml\napp:\n networks:\n - shared\nnetworks:\n shared:\n driver: bridge\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f39305"},"children":[{"type":"text","value":"// application/compose.yaml"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0f60a1"},"children":[{"type":"text","value":"app"}]},{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f60a1"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-f39305"},"children":[{"type":"text","value":"shared"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0f60a1"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f60a1"},"children":[{"type":"text","value":"shared"}]},{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f60a1"},"children":[{"type":"text","value":"driver"}]},{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-f39305"},"children":[{"type":"text","value":"bridge"}]}]}]}]}]},{"type":"element","tag":"code","props":{"code":"/// mailserver/compose.yaml\nmail:\n networks:\n - \"application_shared\"\nnetworks:\n application_shared:\n external: true\n","language":"yaml"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f39305"},"children":[{"type":"text","value":"/// mailserver/compose.yaml"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0f60a1"},"children":[{"type":"text","value":"mail"}]},{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f60a1"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":" - "}]},{"type":"element","tag":"span","props":{"class":"ct-f39305"},"children":[{"type":"text","value":"\"application_shared\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0f60a1"},"children":[{"type":"text","value":"networks"}]},{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f60a1"},"children":[{"type":"text","value":"application_shared"}]},{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":":"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f60a1"},"children":[{"type":"text","value":"external"}]},{"type":"element","tag":"span","props":{"class":"ct-0706b6"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-51eecb"},"children":[{"type":"text","value":"true"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"4-how-to-convert-dkim-mailtxt-to-dns-record"},"children":[{"type":"text","value":"4. How to convert DKIM mail.txt to DNS record"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"My "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail.txt"}]},{"type":"text","value":" was like:"}]},{"type":"element","tag":"code","props":{"code":"mail._domainkey IN TXT ( \"v=DKIM1; h=sha256; k=rsa; \"\n \"p=sOmEJuNkLiKeRaNdOmOrLikeThat\"\n \"eVeNmOrERANdOmStuFf\" ) ; ----- DKIM key mail for example.com\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"mail._domainkey IN TXT ( \"v=DKIM1; h=sha256; k=rsa; \"\n \"p=sOmEJuNkLiKeRaNdOmOrLikeThat\"\n \"eVeNmOrERANdOmStuFf\" ) ; ----- DKIM key mail for example.com"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"SOLUTION"}]},{"type":"text","value":": concatenate all strings inside round brackets:"}]},{"type":"element","tag":"code","props":{"code":"v=DKIM1; h=sha256; k=rsa; p=sOmEJuNkLiKeRaNdOmOrLikeThateVeNmOrERANdOmStuFf\n"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{},"children":[{"type":"text","value":"v=DKIM1; h=sha256; k=rsa; p=sOmEJuNkLiKeRaNdOmOrLikeThateVeNmOrERANdOmStuFf"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"And add them as a "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"TXT"}]},{"type":"text","value":" record on my DNS provider control panel under "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"mail._domainkey"}]},{"type":"text","value":" record."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Solution was right in "},{"type":"element","tag":"a","props":{"href":"https://docker-mailserver.github.io/docker-mailserver/edge/config/best-practices/dkim_dmarc_spf/#dkim-dns","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]},{"type":"text","value":", just hidden a little bit."}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-51eecb{color:#79C0FF}.ct-f39305{color:#A5D6FF}.ct-0f60a1{color:#7EE787}.ct-0706b6{color:#C9D1D9}.light .ct-0706b6{color:#657B83}.light .ct-0f60a1{color:#268BD2}.light .ct-f39305{color:#2AA198}.light .ct-51eecb{color:#B58900}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"1-docker-mailserver-ssl-alert-number-42","depth":2,"text":"1. docker-mailserver SSL alert number 42","children":[{"id":"11-letsencrypt-and-wildcard-domains","depth":3,"text":"1.1. Letsencrypt and wildcard domains"},{"id":"12-docker-was-using-internal-hostname-of-docker-mailserver","depth":3,"text":"1.2. Docker was using internal hostname of docker-mailserver"},{"id":"2-docker-mailserver-not-listening-on-25-port-smtp","depth":3,"text":"2. docker-mailserver not listening on 25 port (SMTP)"},{"id":"3-connect-to-docker-mailserver-from-other-docker-compose","depth":3,"text":"3. Connect to docker-mailserver from other docker-compose"},{"id":"4-how-to-convert-dkim-mailtxt-to-dns-record","depth":3,"text":"4. How to convert DKIM mail.txt to DNS record"}]}]}},"_type":"markdown","_id":"content:Docker:Common things with docker-mailserver.md","_source":"content","_file":"Docker/Common things with docker-mailserver.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/v8MG1Q8wMg.json b/docs/api/_content/query/v8MG1Q8wMg.json index 8f101fa..e9a3947 100644 --- a/docs/api/_content/query/v8MG1Q8wMg.json +++ b/docs/api/_content/query/v8MG1Q8wMg.json @@ -1 +1 @@ -{"_path":"/docker/seed-dump-inside-docker","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Seed Dump Inside Docker","description":"If you need to seed .sql dump in #docker container, just run this command. Also you can try to rsync file with SSH to get it from remote host.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If you need to seed "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".sql"}]},{"type":"text","value":" dump in #docker container, just run this command. Also you can try to "},{"type":"element","tag":"a","props":{"href":"/linux/Rsync%20file%20with%20SSH"},"children":[{"type":"text","value":"rsync file with SSH"}]},{"type":"text","value":" to get it from remote host."}]},{"type":"element","tag":"code","props":{"code":"#####\n# usage: ./script.sh \"/path/to/dump.sql\"\n#####\n\nDUMP_PATH=$1\nCONTAINER=\"db\"\nUSER=root\nPASSWORD=password\nDB=database\n\ncat \"$DUMP_PATH\" | docker exec -i $CONTAINER mysql -u$USER -p$PASSWORD $DB\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"#####\n# usage: ./script.sh \"/path/to/dump.sql\"\n#####\n\nDUMP_PATH=$1\nCONTAINER=\"db\"\nUSER=root\nPASSWORD=password\nDB=database\n\ncat \"$DUMP_PATH\" | docker exec -i $CONTAINER mysql -u$USER -p$PASSWORD $DB\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If you need to seed "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".sql"}]},{"type":"text","value":" dump in #docker container, just run this command. Also you can try to "},{"type":"element","tag":"a","props":{"href":"/linux/Rsync%20file%20with%20SSH"},"children":[{"type":"text","value":"rsync file with SSH"}]},{"type":"text","value":" to get it from remote host."}]},{"type":"element","tag":"code","props":{"code":"#####\n# usage: ./script.sh \"/path/to/dump.sql\"\n#####\n\nDUMP_PATH=$1\nCONTAINER=\"db\"\nUSER=root\nPASSWORD=password\nDB=database\n\ncat \"$DUMP_PATH\" | docker exec -i $CONTAINER mysql -u$USER -p$PASSWORD $DB\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-835db9"},"children":[{"type":"text","value":"#####"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-835db9"},"children":[{"type":"text","value":"# usage: ./script.sh \"/path/to/dump.sql\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-835db9"},"children":[{"type":"text","value":"#####"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":"DUMP_PATH="}]},{"type":"element","tag":"span","props":{"class":"ct-fb993e"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-0d02f9"},"children":[{"type":"text","value":"1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":"CONTAINER="}]},{"type":"element","tag":"span","props":{"class":"ct-192c0b"},"children":[{"type":"text","value":"\"db\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":"USER=root"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":"PASSWORD=password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":"DB=database"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":"cat "}]},{"type":"element","tag":"span","props":{"class":"ct-192c0b"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-fb993e"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-0d02f9"},"children":[{"type":"text","value":"DUMP_PATH"}]},{"type":"element","tag":"span","props":{"class":"ct-192c0b"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6812d8"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":" docker "}]},{"type":"element","tag":"span","props":{"class":"ct-d59a0f"},"children":[{"type":"text","value":"exec"}]},{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":" -i "}]},{"type":"element","tag":"span","props":{"class":"ct-fb993e"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-0d02f9"},"children":[{"type":"text","value":"CONTAINER"}]},{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":" mysql -u"}]},{"type":"element","tag":"span","props":{"class":"ct-fb993e"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-0d02f9"},"children":[{"type":"text","value":"USER"}]},{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":" -p"}]},{"type":"element","tag":"span","props":{"class":"ct-fb993e"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-0d02f9"},"children":[{"type":"text","value":"PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-1df564"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-fb993e"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-0d02f9"},"children":[{"type":"text","value":"DB"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-d59a0f{color:#79C0FF}.ct-6812d8{color:#FF7B72}.ct-192c0b{color:#A5D6FF}.ct-0d02f9{color:#C9D1D9}.ct-fb993e{color:#C9D1D9}.ct-1df564{color:#C9D1D9}.ct-835db9{color:#8B949E}.light .ct-835db9{color:#93A1A1}.light .ct-1df564{color:#657B83}.light .ct-fb993e{color:#859900}.light .ct-0d02f9{color:#268BD2}.light .ct-192c0b{color:#2AA198}.light .ct-6812d8{color:#859900}.light .ct-d59a0f{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Docker:Seed dump inside docker.md","_source":"content","_file":"Docker/Seed dump inside docker.md","_extension":"md"} \ No newline at end of file +{"_path":"/docker/seed-dump-inside-docker","_dir":"docker","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Seed Dump Inside Docker","description":"If you need to seed .sql dump in #docker container, just run this command. Also you can try to rsync file with SSH to get it from remote host.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If you need to seed "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".sql"}]},{"type":"text","value":" dump in #docker container, just run this command. Also you can try to "},{"type":"element","tag":"a","props":{"href":"/linux/Rsync%20file%20with%20SSH"},"children":[{"type":"text","value":"rsync file with SSH"}]},{"type":"text","value":" to get it from remote host."}]},{"type":"element","tag":"code","props":{"code":"#####\n# usage: ./script.sh \"/path/to/dump.sql\"\n#####\n\nDUMP_PATH=$1\nCONTAINER=\"db\"\nUSER=root\nPASSWORD=password\nDB=database\n\ncat \"$DUMP_PATH\" | docker exec -i $CONTAINER mysql -u$USER -p$PASSWORD $DB\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"#####\n# usage: ./script.sh \"/path/to/dump.sql\"\n#####\n\nDUMP_PATH=$1\nCONTAINER=\"db\"\nUSER=root\nPASSWORD=password\nDB=database\n\ncat \"$DUMP_PATH\" | docker exec -i $CONTAINER mysql -u$USER -p$PASSWORD $DB\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If you need to seed "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".sql"}]},{"type":"text","value":" dump in #docker container, just run this command. Also you can try to "},{"type":"element","tag":"a","props":{"href":"/linux/Rsync%20file%20with%20SSH"},"children":[{"type":"text","value":"rsync file with SSH"}]},{"type":"text","value":" to get it from remote host."}]},{"type":"element","tag":"code","props":{"code":"#####\n# usage: ./script.sh \"/path/to/dump.sql\"\n#####\n\nDUMP_PATH=$1\nCONTAINER=\"db\"\nUSER=root\nPASSWORD=password\nDB=database\n\ncat \"$DUMP_PATH\" | docker exec -i $CONTAINER mysql -u$USER -p$PASSWORD $DB\n","language":"shell"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a24274"},"children":[{"type":"text","value":"#####"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a24274"},"children":[{"type":"text","value":"# usage: ./script.sh \"/path/to/dump.sql\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a24274"},"children":[{"type":"text","value":"#####"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":"DUMP_PATH="}]},{"type":"element","tag":"span","props":{"class":"ct-0f4d33"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-f3d07f"},"children":[{"type":"text","value":"1"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":"CONTAINER="}]},{"type":"element","tag":"span","props":{"class":"ct-919b14"},"children":[{"type":"text","value":"\"db\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":"USER=root"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":"PASSWORD=password"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":"DB=database"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":"cat "}]},{"type":"element","tag":"span","props":{"class":"ct-919b14"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-0f4d33"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-f3d07f"},"children":[{"type":"text","value":"DUMP_PATH"}]},{"type":"element","tag":"span","props":{"class":"ct-919b14"},"children":[{"type":"text","value":"\""}]},{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-e38e69"},"children":[{"type":"text","value":"|"}]},{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":" docker "}]},{"type":"element","tag":"span","props":{"class":"ct-010366"},"children":[{"type":"text","value":"exec"}]},{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":" -i "}]},{"type":"element","tag":"span","props":{"class":"ct-0f4d33"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-f3d07f"},"children":[{"type":"text","value":"CONTAINER"}]},{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":" mysql -u"}]},{"type":"element","tag":"span","props":{"class":"ct-0f4d33"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-f3d07f"},"children":[{"type":"text","value":"USER"}]},{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":" -p"}]},{"type":"element","tag":"span","props":{"class":"ct-0f4d33"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-f3d07f"},"children":[{"type":"text","value":"PASSWORD"}]},{"type":"element","tag":"span","props":{"class":"ct-7b2cb4"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0f4d33"},"children":[{"type":"text","value":"$"}]},{"type":"element","tag":"span","props":{"class":"ct-f3d07f"},"children":[{"type":"text","value":"DB"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-010366{color:#79C0FF}.ct-e38e69{color:#FF7B72}.ct-919b14{color:#A5D6FF}.ct-f3d07f{color:#C9D1D9}.ct-0f4d33{color:#C9D1D9}.ct-7b2cb4{color:#C9D1D9}.ct-a24274{color:#8B949E}.light .ct-a24274{color:#93A1A1}.light .ct-7b2cb4{color:#657B83}.light .ct-0f4d33{color:#859900}.light .ct-f3d07f{color:#268BD2}.light .ct-919b14{color:#2AA198}.light .ct-e38e69{color:#859900}.light .ct-010366{color:#268BD2}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Docker:Seed dump inside docker.md","_source":"content","_file":"Docker/Seed dump inside docker.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/wOOxKhEEuc.json b/docs/api/_content/query/wOOxKhEEuc.json index 940ae2c..9ff727b 100644 --- a/docs/api/_content/query/wOOxKhEEuc.json +++ b/docs/api/_content/query/wOOxKhEEuc.json @@ -1 +1 @@ -{"_path":"/frontend/webgl/rendering-without-blocking-in-a-worker","_dir":"webgl","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Rendering Without Blocking In A Worker","description":"Rendering items on #canvas in main loop might cause interface freezes, preventing render process from executing properly by flooding execution stack with operations.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Rendering items on #canvas in main loop "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"might cause interface freezes"}]},{"type":"text","value":", preventing render process from executing properly by flooding execution stack with operations."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To handle it properly, we can start separate #worker thread, that will handle rendering in its own event loop, so that won't affect the source tab's event loop."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Workers can have access to "},{"type":"element","tag":"a","props":{"href":"https://developer.mozilla.org/en-US/docs/Glossary/Transferable_objects","rel":["nofollow"]},"children":[{"type":"text","value":"Transferrable Objects"}]},{"type":"text","value":" from main thread by receiving memory address. "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"That's a lot faster than cloning"}]},{"type":"text","value":". In this case "},{"type":"element","tag":"a","props":{"href":"https://developer.mozilla.org/en-US/docs/Web/API/ImageBitmap","rel":["nofollow"]},"children":[{"type":"text","value":"ImageBitmap"}]},{"type":"text","value":" is transferrable."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Code for the main thread component:"}]},{"type":"element","tag":"code","props":{"code":"// main.ts\nconst instance = new Worker('./render-worker.ts');\nconst canvas = document.getElementById('view');\n\n// attaching event listener to worker\ninstance.onmessage = (event: MessageEvent) => {\n const ctx = canvas?.getContext(\"2d\");\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n \n ctx.drawImage(event.data as ImageBitmap, 0, 0);\n}\n\n// sending canvas contents to worker\nconst renderInCanvas = () => {\n if (!canvas.current) {\n return;\n }\n \n createImageBitmap(canvas.current).then(image => {\n instance.postMessage(image, { transfer: [image] })\n });\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// main.ts\nconst instance = new Worker('./render-worker.ts');\nconst canvas = document.getElementById('view');\n\n// attaching event listener to worker\ninstance.onmessage = (event: MessageEvent) => {\n const ctx = canvas?.getContext(\"2d\");\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n \n ctx.drawImage(event.data as ImageBitmap, 0, 0);\n}\n\n// sending canvas contents to worker\nconst renderInCanvas = () => {\n if (!canvas.current) {\n return;\n }\n \n createImageBitmap(canvas.current).then(image => {\n instance.postMessage(image, { transfer: [image] })\n });\n};\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Worker code:"}]},{"type":"element","tag":"code","props":{"code":"// render-worker.ts\nexport default () => {\n self.onmessage = (message: MessageEvent) => {\n const data = message.data;\n\n if (!(data instanceof ImageBitmap)) {\n throw new Error('Received unknown data')\n }\n\n // OffscreenCanvas can be set up inside workers\n const canvas = new OffscreenCanvas(data.width, data.height);\n const ctx = canvas.getContext(\"2d\");\n\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n\n ctx.drawImage(data, 0, 0);\n\n // That will block execution inside worker for \n // a couple of seconds\n doHardRenderingStuffHere(ctx, data.width, data.height);\n\n // Sending resulting image back to main thread\n createImageBitmap(canvas).then((image) => {\n self.postMessage(image, { transfer: [image] });\n });\n };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// render-worker.ts\nexport default () => {\n self.onmessage = (message: MessageEvent) => {\n const data = message.data;\n\n if (!(data instanceof ImageBitmap)) {\n throw new Error('Received unknown data')\n }\n\n // OffscreenCanvas can be set up inside workers\n const canvas = new OffscreenCanvas(data.width, data.height);\n const ctx = canvas.getContext(\"2d\");\n\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n\n ctx.drawImage(data, 0, 0);\n\n // That will block execution inside worker for \n // a couple of seconds\n doHardRenderingStuffHere(ctx, data.width, data.height);\n\n // Sending resulting image back to main thread\n createImageBitmap(canvas).then((image) => {\n self.postMessage(image, { transfer: [image] });\n });\n };\n};\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Rendering items on #canvas in main loop "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"might cause interface freezes"}]},{"type":"text","value":", preventing render process from executing properly by flooding execution stack with operations."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To handle it properly, we can start separate #worker thread, that will handle rendering in its own event loop, so that won't affect the source tab's event loop."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Workers can have access to "},{"type":"element","tag":"a","props":{"href":"https://developer.mozilla.org/en-US/docs/Glossary/Transferable_objects","rel":["nofollow"]},"children":[{"type":"text","value":"Transferrable Objects"}]},{"type":"text","value":" from main thread by receiving memory address. "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"That's a lot faster than cloning"}]},{"type":"text","value":". In this case "},{"type":"element","tag":"a","props":{"href":"https://developer.mozilla.org/en-US/docs/Web/API/ImageBitmap","rel":["nofollow"]},"children":[{"type":"text","value":"ImageBitmap"}]},{"type":"text","value":" is transferrable."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Code for the main thread component:"}]},{"type":"element","tag":"code","props":{"code":"// main.ts\nconst instance = new Worker('./render-worker.ts');\nconst canvas = document.getElementById('view');\n\n// attaching event listener to worker\ninstance.onmessage = (event: MessageEvent) => {\n const ctx = canvas?.getContext(\"2d\");\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n \n ctx.drawImage(event.data as ImageBitmap, 0, 0);\n}\n\n// sending canvas contents to worker\nconst renderInCanvas = () => {\n if (!canvas.current) {\n return;\n }\n \n createImageBitmap(canvas.current).then(image => {\n instance.postMessage(image, { transfer: [image] })\n });\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-79498e"},"children":[{"type":"text","value":"// main.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56802"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-250ed0"},"children":[{"type":"text","value":"instance"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"Worker"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-2def8a"},"children":[{"type":"text","value":"'./render-worker.ts'"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56802"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-250ed0"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"document"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"getElementById"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-2def8a"},"children":[{"type":"text","value":"'view'"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-79498e"},"children":[{"type":"text","value":"// attaching event listener to worker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"instance"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"onmessage"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-05acc1"},"children":[{"type":"text","value":"MessageEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-b56802"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b56802"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-250ed0"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"getContext"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-2def8a"},"children":[{"type":"text","value":"\"2d\""}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a7082a"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-2def8a"},"children":[{"type":"text","value":"`Can't get 2D context`"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"drawImage"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"as"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-05acc1"},"children":[{"type":"text","value":"ImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-84e290"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-84e290"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-79498e"},"children":[{"type":"text","value":"// sending canvas contents to worker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b56802"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"renderInCanvas"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-b56802"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"createImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"then"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"instance"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"postMessage"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":", { transfer: ["}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"] })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Worker code:"}]},{"type":"element","tag":"code","props":{"code":"// render-worker.ts\nexport default () => {\n self.onmessage = (message: MessageEvent) => {\n const data = message.data;\n\n if (!(data instanceof ImageBitmap)) {\n throw new Error('Received unknown data')\n }\n\n // OffscreenCanvas can be set up inside workers\n const canvas = new OffscreenCanvas(data.width, data.height);\n const ctx = canvas.getContext(\"2d\");\n\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n\n ctx.drawImage(data, 0, 0);\n\n // That will block execution inside worker for \n // a couple of seconds\n doHardRenderingStuffHere(ctx, data.width, data.height);\n\n // Sending resulting image back to main thread\n createImageBitmap(canvas).then((image) => {\n self.postMessage(image, { transfer: [image] });\n });\n };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-79498e"},"children":[{"type":"text","value":"// render-worker.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0fdabc"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-6575e1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0fdabc"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-6575e1"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-e101b9"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-6575e1"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-85ce46"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"self"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"onmessage"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b56802"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-250ed0"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"message"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"instanceof"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-05acc1"},"children":[{"type":"text","value":"ImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a7082a"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-2def8a"},"children":[{"type":"text","value":"'Received unknown data'"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-79498e"},"children":[{"type":"text","value":"// OffscreenCanvas can be set up inside workers"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b56802"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-250ed0"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"OffscreenCanvas"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b56802"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-250ed0"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"getContext"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-2def8a"},"children":[{"type":"text","value":"\"2d\""}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-06d0ef"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a7082a"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-2def8a"},"children":[{"type":"text","value":"`Can't get 2D context`"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"drawImage"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-84e290"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-84e290"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-79498e"},"children":[{"type":"text","value":"// That will block execution inside worker for "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-79498e"},"children":[{"type":"text","value":"// a couple of seconds"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"doHardRenderingStuffHere"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-79498e"},"children":[{"type":"text","value":"// Sending resulting image back to main thread"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"createImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-b56802"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"self"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-2edd34"},"children":[{"type":"text","value":"postMessage"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":", { transfer: ["}]},{"type":"element","tag":"span","props":{"class":"ct-d814b1"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"] });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a2c7c0"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-85ce46{color:#C9D1D9}.ct-e101b9{color:#FF7B72}.ct-6575e1{color:#FFA657}.ct-0fdabc{color:#FF7B72}.ct-84e290{color:#79C0FF}.ct-a7082a{color:#79C0FF}.ct-05acc1{color:#FFA657}.ct-d814b1{color:#C9D1D9}.ct-2def8a{color:#A5D6FF}.ct-2edd34{color:#D2A8FF}.ct-06d0ef{color:#FF7B72}.ct-250ed0{color:#79C0FF}.ct-a2c7c0{color:#C9D1D9}.ct-b56802{color:#FF7B72}.ct-79498e{color:#8B949E}.light .ct-79498e{color:#93A1A1}.light .ct-b56802{color:#073642}.light .ct-a2c7c0{color:#657B83}.light .ct-250ed0{color:#268BD2}.light .ct-06d0ef{color:#859900}.light .ct-2edd34{color:#268BD2}.light .ct-2def8a{color:#2AA198}.light .ct-d814b1{color:#268BD2}.light .ct-05acc1{color:#268BD2}.light .ct-a7082a{color:#859900}.light .ct-84e290{color:#D33682}.light .ct-0fdabc{color:#859900}.light .ct-6575e1{color:#657B83}.light .ct-e101b9{color:#073642}.light .ct-85ce46{color:#657B83}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:WebGL:Rendering without blocking in a Worker.md","_source":"content","_file":"Frontend/WebGL/Rendering without blocking in a Worker.md","_extension":"md"} \ No newline at end of file +{"_path":"/frontend/webgl/rendering-without-blocking-in-a-worker","_dir":"webgl","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Rendering Without Blocking In A Worker","description":"Rendering items on #canvas in main loop might cause interface freezes, preventing render process from executing properly by flooding execution stack with operations.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Rendering items on #canvas in main loop "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"might cause interface freezes"}]},{"type":"text","value":", preventing render process from executing properly by flooding execution stack with operations."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To handle it properly, we can start separate #worker thread, that will handle rendering in its own event loop, so that won't affect the source tab's event loop."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Workers can have access to "},{"type":"element","tag":"a","props":{"href":"https://developer.mozilla.org/en-US/docs/Glossary/Transferable_objects","rel":["nofollow"]},"children":[{"type":"text","value":"Transferrable Objects"}]},{"type":"text","value":" from main thread by receiving memory address. "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"That's a lot faster than cloning"}]},{"type":"text","value":". In this case "},{"type":"element","tag":"a","props":{"href":"https://developer.mozilla.org/en-US/docs/Web/API/ImageBitmap","rel":["nofollow"]},"children":[{"type":"text","value":"ImageBitmap"}]},{"type":"text","value":" is transferrable."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Code for the main thread component:"}]},{"type":"element","tag":"code","props":{"code":"// main.ts\nconst instance = new Worker('./render-worker.ts');\nconst canvas = document.getElementById('view');\n\n// attaching event listener to worker\ninstance.onmessage = (event: MessageEvent) => {\n const ctx = canvas?.getContext(\"2d\");\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n \n ctx.drawImage(event.data as ImageBitmap, 0, 0);\n}\n\n// sending canvas contents to worker\nconst renderInCanvas = () => {\n if (!canvas.current) {\n return;\n }\n \n createImageBitmap(canvas.current).then(image => {\n instance.postMessage(image, { transfer: [image] })\n });\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// main.ts\nconst instance = new Worker('./render-worker.ts');\nconst canvas = document.getElementById('view');\n\n// attaching event listener to worker\ninstance.onmessage = (event: MessageEvent) => {\n const ctx = canvas?.getContext(\"2d\");\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n \n ctx.drawImage(event.data as ImageBitmap, 0, 0);\n}\n\n// sending canvas contents to worker\nconst renderInCanvas = () => {\n if (!canvas.current) {\n return;\n }\n \n createImageBitmap(canvas.current).then(image => {\n instance.postMessage(image, { transfer: [image] })\n });\n};\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Worker code:"}]},{"type":"element","tag":"code","props":{"code":"// render-worker.ts\nexport default () => {\n self.onmessage = (message: MessageEvent) => {\n const data = message.data;\n\n if (!(data instanceof ImageBitmap)) {\n throw new Error('Received unknown data')\n }\n\n // OffscreenCanvas can be set up inside workers\n const canvas = new OffscreenCanvas(data.width, data.height);\n const ctx = canvas.getContext(\"2d\");\n\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n\n ctx.drawImage(data, 0, 0);\n\n // That will block execution inside worker for \n // a couple of seconds\n doHardRenderingStuffHere(ctx, data.width, data.height);\n\n // Sending resulting image back to main thread\n createImageBitmap(canvas).then((image) => {\n self.postMessage(image, { transfer: [image] });\n });\n };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// render-worker.ts\nexport default () => {\n self.onmessage = (message: MessageEvent) => {\n const data = message.data;\n\n if (!(data instanceof ImageBitmap)) {\n throw new Error('Received unknown data')\n }\n\n // OffscreenCanvas can be set up inside workers\n const canvas = new OffscreenCanvas(data.width, data.height);\n const ctx = canvas.getContext(\"2d\");\n\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n\n ctx.drawImage(data, 0, 0);\n\n // That will block execution inside worker for \n // a couple of seconds\n doHardRenderingStuffHere(ctx, data.width, data.height);\n\n // Sending resulting image back to main thread\n createImageBitmap(canvas).then((image) => {\n self.postMessage(image, { transfer: [image] });\n });\n };\n};\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Rendering items on #canvas in main loop "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"might cause interface freezes"}]},{"type":"text","value":", preventing render process from executing properly by flooding execution stack with operations."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To handle it properly, we can start separate #worker thread, that will handle rendering in its own event loop, so that won't affect the source tab's event loop."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Workers can have access to "},{"type":"element","tag":"a","props":{"href":"https://developer.mozilla.org/en-US/docs/Glossary/Transferable_objects","rel":["nofollow"]},"children":[{"type":"text","value":"Transferrable Objects"}]},{"type":"text","value":" from main thread by receiving memory address. "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"That's a lot faster than cloning"}]},{"type":"text","value":". In this case "},{"type":"element","tag":"a","props":{"href":"https://developer.mozilla.org/en-US/docs/Web/API/ImageBitmap","rel":["nofollow"]},"children":[{"type":"text","value":"ImageBitmap"}]},{"type":"text","value":" is transferrable."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Code for the main thread component:"}]},{"type":"element","tag":"code","props":{"code":"// main.ts\nconst instance = new Worker('./render-worker.ts');\nconst canvas = document.getElementById('view');\n\n// attaching event listener to worker\ninstance.onmessage = (event: MessageEvent) => {\n const ctx = canvas?.getContext(\"2d\");\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n \n ctx.drawImage(event.data as ImageBitmap, 0, 0);\n}\n\n// sending canvas contents to worker\nconst renderInCanvas = () => {\n if (!canvas.current) {\n return;\n }\n \n createImageBitmap(canvas.current).then(image => {\n instance.postMessage(image, { transfer: [image] })\n });\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8f9030"},"children":[{"type":"text","value":"// main.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a073d0"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1afa53"},"children":[{"type":"text","value":"instance"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"Worker"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b7c5f5"},"children":[{"type":"text","value":"'./render-worker.ts'"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a073d0"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1afa53"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"document"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"getElementById"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b7c5f5"},"children":[{"type":"text","value":"'view'"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8f9030"},"children":[{"type":"text","value":"// attaching event listener to worker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"instance"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"onmessage"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-268080"},"children":[{"type":"text","value":"MessageEvent"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-a073d0"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a073d0"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1afa53"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"?."}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"getContext"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b7c5f5"},"children":[{"type":"text","value":"\"2d\""}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b42040"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b7c5f5"},"children":[{"type":"text","value":"`Can't get 2D context`"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"drawImage"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"as"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-268080"},"children":[{"type":"text","value":"ImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f93fe2"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f93fe2"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8f9030"},"children":[{"type":"text","value":"// sending canvas contents to worker"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-a073d0"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"renderInCanvas"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-a073d0"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"createImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"current"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"then"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"instance"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"postMessage"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":", { transfer: ["}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"] })"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Worker code:"}]},{"type":"element","tag":"code","props":{"code":"// render-worker.ts\nexport default () => {\n self.onmessage = (message: MessageEvent) => {\n const data = message.data;\n\n if (!(data instanceof ImageBitmap)) {\n throw new Error('Received unknown data')\n }\n\n // OffscreenCanvas can be set up inside workers\n const canvas = new OffscreenCanvas(data.width, data.height);\n const ctx = canvas.getContext(\"2d\");\n\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n\n ctx.drawImage(data, 0, 0);\n\n // That will block execution inside worker for \n // a couple of seconds\n doHardRenderingStuffHere(ctx, data.width, data.height);\n\n // Sending resulting image back to main thread\n createImageBitmap(canvas).then((image) => {\n self.postMessage(image, { transfer: [image] });\n });\n };\n};\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-8f9030"},"children":[{"type":"text","value":"// render-worker.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-f45deb"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-3adc7c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-f45deb"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-3adc7c"},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"class":"ct-03e437"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-3adc7c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-9f497f"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"self"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"onmessage"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a073d0"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1afa53"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"message"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"instanceof"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-268080"},"children":[{"type":"text","value":"ImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":")) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b42040"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b7c5f5"},"children":[{"type":"text","value":"'Received unknown data'"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8f9030"},"children":[{"type":"text","value":"// OffscreenCanvas can be set up inside workers"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a073d0"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1afa53"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"OffscreenCanvas"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-a073d0"},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-1afa53"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"getContext"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b7c5f5"},"children":[{"type":"text","value":"\"2d\""}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":") {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"throw"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-86786b"},"children":[{"type":"text","value":"new"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b42040"},"children":[{"type":"text","value":"Error"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-b7c5f5"},"children":[{"type":"text","value":"`Can't get 2D context`"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"drawImage"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f93fe2"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-f93fe2"},"children":[{"type":"text","value":"0"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8f9030"},"children":[{"type":"text","value":"// That will block execution inside worker for "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8f9030"},"children":[{"type":"text","value":"// a couple of seconds"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"doHardRenderingStuffHere"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"ctx"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"width"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"height"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8f9030"},"children":[{"type":"text","value":"// Sending resulting image back to main thread"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"createImageBitmap"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"canvas"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"then"}]},{"type":"element","tag":"span","props":{"class":"ct-a073d0"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"self"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-8d9856"},"children":[{"type":"text","value":"postMessage"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":", { transfer: ["}]},{"type":"element","tag":"span","props":{"class":"ct-ef783b"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"] });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":" };"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5b7b20"},"children":[{"type":"text","value":"};"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-9f497f{color:#C9D1D9}.ct-03e437{color:#FF7B72}.ct-3adc7c{color:#FFA657}.ct-f45deb{color:#FF7B72}.ct-f93fe2{color:#79C0FF}.ct-b42040{color:#79C0FF}.ct-268080{color:#FFA657}.ct-ef783b{color:#C9D1D9}.ct-b7c5f5{color:#A5D6FF}.ct-8d9856{color:#D2A8FF}.ct-86786b{color:#FF7B72}.ct-1afa53{color:#79C0FF}.ct-5b7b20{color:#C9D1D9}.ct-a073d0{color:#FF7B72}.ct-8f9030{color:#8B949E}.light .ct-8f9030{color:#93A1A1}.light .ct-a073d0{color:#073642}.light .ct-5b7b20{color:#657B83}.light .ct-1afa53{color:#268BD2}.light .ct-86786b{color:#859900}.light .ct-8d9856{color:#268BD2}.light .ct-b7c5f5{color:#2AA198}.light .ct-ef783b{color:#268BD2}.light .ct-268080{color:#268BD2}.light .ct-b42040{color:#859900}.light .ct-f93fe2{color:#D33682}.light .ct-f45deb{color:#859900}.light .ct-3adc7c{color:#657B83}.light .ct-03e437{color:#073642}.light .ct-9f497f{color:#657B83}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:WebGL:Rendering without blocking in a Worker.md","_source":"content","_file":"Frontend/WebGL/Rendering without blocking in a Worker.md","_extension":"md"} \ No newline at end of file diff --git a/docs/api/_content/query/xbO7aWQkpQ.json b/docs/api/_content/query/xbO7aWQkpQ.json index 88e597d..5f14903 100644 --- a/docs/api/_content/query/xbO7aWQkpQ.json +++ b/docs/api/_content/query/xbO7aWQkpQ.json @@ -1 +1 @@ -{"_path":"/frontend/webgl/vertex-shaders","_dir":"webgl","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Vertex Shaders","description":"Read Basics of WebGL (Drawing a Cube) first.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read "},{"type":"element","tag":"a","props":{"href":"Basics%20of%20WebGL%20(Drawing%20a%20Cube)"},"children":[{"type":"text","value":"Basics of WebGL (Drawing a Cube)"}]},{"type":"text","value":" first."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" define vertice positions in 3D-space. That's just a function, that defines "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gl_Position"}]},{"type":"text","value":" value by applying different transformations to it."}]},{"type":"element","tag":"h2","props":{"id":"sample-code"},"children":[{"type":"text","value":"Sample code"}]},{"type":"element","tag":"code","props":{"code":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"passing-parameters-to-vertexshader"},"children":[{"type":"text","value":"Passing parameters to VertexShader"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Search for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Uniforms"}]},{"type":"text","value":" "},{"type":"element","tag":"a","props":{"href":"https://open.gl/drawing","rel":["nofollow"]},"children":[{"type":"text","value":"at open.gl"}]},{"type":"text","value":" for further reading."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There're 3 ways to pass parameters."}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"attribute"}]},{"type":"text","value":" are parameters, that won't change. Good for vertex buffers."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniform"}]},{"type":"text","value":" are meant to change over the time. Good for passing transformations."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varying"}]},{"type":"text","value":" are parameters, that's shared between Vertex and "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]}]},{"type":"element","tag":"h2","props":{"id":"applying-transformations"},"children":[{"type":"text","value":"Applying transformations"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Every vertice position is defined as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"{x,y,z,w}"}]},{"type":"text","value":", where "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"w"}]},{"type":"text","value":" is a common denominator, that's used to achieve fast coord transformations by multiplying number of square matrices with original vertice coordinates."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"We don't change vertice position buffer"}]},{"type":"text","value":", because it's slow when being run inside Javascript loop, we "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"pass transformation matrices"}]},{"type":"text","value":" instead and "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"multiply vertice positions with transformation matrices"}]},{"type":"text","value":" inside a Graphic Card's GPU, because that's what GPU made for."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Good explanation can be found here: "},{"type":"element","tag":"a","props":{"href":"https://open.gl/transformations","rel":["nofollow"]},"children":[{"type":"text","value":"open.gl"}]},{"type":"text","value":"."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read "},{"type":"element","tag":"a","props":{"href":"Basics%20of%20WebGL%20(Drawing%20a%20Cube)"},"children":[{"type":"text","value":"Basics of WebGL (Drawing a Cube)"}]},{"type":"text","value":" first."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" define vertice positions in 3D-space. That's just a function, that defines "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gl_Position"}]},{"type":"text","value":" value by applying different transformations to it."}]},{"type":"element","tag":"h2","props":{"id":"sample-code"},"children":[{"type":"text","value":"Sample code"}]},{"type":"element","tag":"code","props":{"code":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-71fa9c"},"children":[{"type":"text","value":"// current vertice position {x,y,z,w}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"attribute vec4 aVertexPosition;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-71fa9c"},"children":[{"type":"text","value":"// final vertice position with all transformations applied,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-71fa9c"},"children":[{"type":"text","value":"// that will be passed to Fragment Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"varying vec4 v_positionWithOffset;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-71fa9c"},"children":[{"type":"text","value":"// Parameters passed from Javascript loop"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-54d8a4"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":" slide;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-54d8a4"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":" aspect;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-54d8a4"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-70d7f8"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"(){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-71fa9c"},"children":[{"type":"text","value":"// float array of 4 elements, same as [slide,slide,slide,1]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":" vec4 scale"}]},{"type":"element","tag":"span","props":{"class":"ct-f84901"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-70d7f8"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-70d7f8"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"(slide),"}]},{"type":"element","tag":"span","props":{"class":"ct-7127b1"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-71fa9c"},"children":[{"type":"text","value":"// float array of 4 elements, same as [aspect,1,1,1]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":" vec4 aspectRatioFix"}]},{"type":"element","tag":"span","props":{"class":"ct-f84901"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-70d7f8"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"(aspect,"}]},{"type":"element","tag":"span","props":{"class":"ct-70d7f8"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7127b1"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-71fa9c"},"children":[{"type":"text","value":"// vertice position, multiplied with matrices of scale and aspect ratio"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":" gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-f84901"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"aVertexPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-f84901"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-f84901"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"aspectRatioFix,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-71fa9c"},"children":[{"type":"text","value":"// vertice offset, that will be passed to fragment shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":" v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-f84901"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-f84901"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-70d7f8"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-7127b1"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-7127b1"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-7127b1"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-7127b1"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-1e0bf5"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"passing-parameters-to-vertexshader"},"children":[{"type":"text","value":"Passing parameters to VertexShader"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Search for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Uniforms"}]},{"type":"text","value":" "},{"type":"element","tag":"a","props":{"href":"https://open.gl/drawing","rel":["nofollow"]},"children":[{"type":"text","value":"at open.gl"}]},{"type":"text","value":" for further reading."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There're 3 ways to pass parameters."}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"attribute"}]},{"type":"text","value":" are parameters, that won't change. Good for vertex buffers."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniform"}]},{"type":"text","value":" are meant to change over the time. Good for passing transformations."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varying"}]},{"type":"text","value":" are parameters, that's shared between Vertex and "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]}]},{"type":"element","tag":"h2","props":{"id":"applying-transformations"},"children":[{"type":"text","value":"Applying transformations"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Every vertice position is defined as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"{x,y,z,w}"}]},{"type":"text","value":", where "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"w"}]},{"type":"text","value":" is a common denominator, that's used to achieve fast coord transformations by multiplying number of square matrices with original vertice coordinates."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"We don't change vertice position buffer"}]},{"type":"text","value":", because it's slow when being run inside Javascript loop, we "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"pass transformation matrices"}]},{"type":"text","value":" instead and "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"multiply vertice positions with transformation matrices"}]},{"type":"text","value":" inside a Graphic Card's GPU, because that's what GPU made for."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Good explanation can be found here: "},{"type":"element","tag":"a","props":{"href":"https://open.gl/transformations","rel":["nofollow"]},"children":[{"type":"text","value":"open.gl"}]},{"type":"text","value":"."}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-7127b1{color:#79C0FF}.ct-f84901{color:#FF7B72}.ct-70d7f8{color:#D2A8FF}.ct-54d8a4{color:#FF7B72}.ct-1e0bf5{color:#C9D1D9}.ct-71fa9c{color:#8B949E}.light .ct-71fa9c{color:#93A1A1}.light .ct-1e0bf5{color:#657B83}.light .ct-54d8a4{color:#073642}.light .ct-70d7f8{color:#268BD2}.light .ct-f84901{color:#859900}.light .ct-7127b1{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"sample-code","depth":2,"text":"Sample code"},{"id":"passing-parameters-to-vertexshader","depth":2,"text":"Passing parameters to VertexShader"},{"id":"applying-transformations","depth":2,"text":"Applying transformations"}]}},"_type":"markdown","_id":"content:Frontend:WebGL:Vertex Shaders.md","_source":"content","_file":"Frontend/WebGL/Vertex Shaders.md","_extension":"md"} \ No newline at end of file +{"_path":"/frontend/webgl/vertex-shaders","_dir":"webgl","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Vertex Shaders","description":"Read Basics of WebGL (Drawing a Cube) first.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read "},{"type":"element","tag":"a","props":{"href":"Basics%20of%20WebGL%20(Drawing%20a%20Cube)"},"children":[{"type":"text","value":"Basics of WebGL (Drawing a Cube)"}]},{"type":"text","value":" first."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" define vertice positions in 3D-space. That's just a function, that defines "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gl_Position"}]},{"type":"text","value":" value by applying different transformations to it."}]},{"type":"element","tag":"h2","props":{"id":"sample-code"},"children":[{"type":"text","value":"Sample code"}]},{"type":"element","tag":"code","props":{"code":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"passing-parameters-to-vertexshader"},"children":[{"type":"text","value":"Passing parameters to VertexShader"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Search for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Uniforms"}]},{"type":"text","value":" "},{"type":"element","tag":"a","props":{"href":"https://open.gl/drawing","rel":["nofollow"]},"children":[{"type":"text","value":"at open.gl"}]},{"type":"text","value":" for further reading."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There're 3 ways to pass parameters."}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"attribute"}]},{"type":"text","value":" are parameters, that won't change. Good for vertex buffers."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniform"}]},{"type":"text","value":" are meant to change over the time. Good for passing transformations."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varying"}]},{"type":"text","value":" are parameters, that's shared between Vertex and "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]}]},{"type":"element","tag":"h2","props":{"id":"applying-transformations"},"children":[{"type":"text","value":"Applying transformations"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Every vertice position is defined as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"{x,y,z,w}"}]},{"type":"text","value":", where "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"w"}]},{"type":"text","value":" is a common denominator, that's used to achieve fast coord transformations by multiplying number of square matrices with original vertice coordinates."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"We don't change vertice position buffer"}]},{"type":"text","value":", because it's slow when being run inside Javascript loop, we "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"pass transformation matrices"}]},{"type":"text","value":" instead and "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"multiply vertice positions with transformation matrices"}]},{"type":"text","value":" inside a Graphic Card's GPU, because that's what GPU made for."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Good explanation can be found here: "},{"type":"element","tag":"a","props":{"href":"https://open.gl/transformations","rel":["nofollow"]},"children":[{"type":"text","value":"open.gl"}]},{"type":"text","value":"."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Read "},{"type":"element","tag":"a","props":{"href":"Basics%20of%20WebGL%20(Drawing%20a%20Cube)"},"children":[{"type":"text","value":"Basics of WebGL (Drawing a Cube)"}]},{"type":"text","value":" first."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Vertex Shaders"}]},{"type":"text","value":" define vertice positions in 3D-space. That's just a function, that defines "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"gl_Position"}]},{"type":"text","value":" value by applying different transformations to it."}]},{"type":"element","tag":"h2","props":{"id":"sample-code"},"children":[{"type":"text","value":"Sample code"}]},{"type":"element","tag":"code","props":{"code":"// current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n// final vertice position with all transformations applied,\n// that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n// Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n // float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n // float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n // vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n // vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n","language":"c"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-22b8af"},"children":[{"type":"text","value":"// current vertice position {x,y,z,w}"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"attribute vec4 aVertexPosition;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-22b8af"},"children":[{"type":"text","value":"// final vertice position with all transformations applied,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-22b8af"},"children":[{"type":"text","value":"// that will be passed to Fragment Shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"varying vec4 v_positionWithOffset;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-22b8af"},"children":[{"type":"text","value":"// Parameters passed from Javascript loop"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-b79326"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":" slide;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"uniform "}]},{"type":"element","tag":"span","props":{"class":"ct-b79326"},"children":[{"type":"text","value":"float"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":" aspect;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-b79326"},"children":[{"type":"text","value":"void"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-43f728"},"children":[{"type":"text","value":"main"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"(){"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-22b8af"},"children":[{"type":"text","value":"// float array of 4 elements, same as [slide,slide,slide,1]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":" vec4 scale"}]},{"type":"element","tag":"span","props":{"class":"ct-c6b3e4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-43f728"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-43f728"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"(slide),"}]},{"type":"element","tag":"span","props":{"class":"ct-f1b75a"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-22b8af"},"children":[{"type":"text","value":"// float array of 4 elements, same as [aspect,1,1,1]"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":" vec4 aspectRatioFix"}]},{"type":"element","tag":"span","props":{"class":"ct-c6b3e4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-43f728"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"(aspect,"}]},{"type":"element","tag":"span","props":{"class":"ct-43f728"},"children":[{"type":"text","value":"vec3"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f1b75a"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"));"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-22b8af"},"children":[{"type":"text","value":"// vertice position, multiplied with matrices of scale and aspect ratio"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":" gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-c6b3e4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"aVertexPosition"}]},{"type":"element","tag":"span","props":{"class":"ct-c6b3e4"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"scale"}]},{"type":"element","tag":"span","props":{"class":"ct-c6b3e4"},"children":[{"type":"text","value":"*"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"aspectRatioFix,"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-22b8af"},"children":[{"type":"text","value":"// vertice offset, that will be passed to fragment shader"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":" v_positionWithOffset"}]},{"type":"element","tag":"span","props":{"class":"ct-c6b3e4"},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"gl_Position"}]},{"type":"element","tag":"span","props":{"class":"ct-c6b3e4"},"children":[{"type":"text","value":"+"}]},{"type":"element","tag":"span","props":{"class":"ct-43f728"},"children":[{"type":"text","value":"vec4"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"class":"ct-f1b75a"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-f1b75a"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-f1b75a"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":","}]},{"type":"element","tag":"span","props":{"class":"ct-f1b75a"},"children":[{"type":"text","value":"1"}]},{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":");"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-c1002a"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"passing-parameters-to-vertexshader"},"children":[{"type":"text","value":"Passing parameters to VertexShader"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Search for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"Uniforms"}]},{"type":"text","value":" "},{"type":"element","tag":"a","props":{"href":"https://open.gl/drawing","rel":["nofollow"]},"children":[{"type":"text","value":"at open.gl"}]},{"type":"text","value":" for further reading."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"There're 3 ways to pass parameters."}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"attribute"}]},{"type":"text","value":" are parameters, that won't change. Good for vertex buffers."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"uniform"}]},{"type":"text","value":" are meant to change over the time. Good for passing transformations."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"varying"}]},{"type":"text","value":" are parameters, that's shared between Vertex and "},{"type":"element","tag":"a","props":{"href":"Fragment%20Shaders"},"children":[{"type":"text","value":"Fragment Shaders"}]},{"type":"text","value":"."}]}]},{"type":"element","tag":"h2","props":{"id":"applying-transformations"},"children":[{"type":"text","value":"Applying transformations"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Every vertice position is defined as "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"{x,y,z,w}"}]},{"type":"text","value":", where "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"w"}]},{"type":"text","value":" is a common denominator, that's used to achieve fast coord transformations by multiplying number of square matrices with original vertice coordinates."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"We don't change vertice position buffer"}]},{"type":"text","value":", because it's slow when being run inside Javascript loop, we "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"pass transformation matrices"}]},{"type":"text","value":" instead and "},{"type":"element","tag":"span","props":{"className":["highlight"]},"children":[{"type":"text","value":"multiply vertice positions with transformation matrices"}]},{"type":"text","value":" inside a Graphic Card's GPU, because that's what GPU made for."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Good explanation can be found here: "},{"type":"element","tag":"a","props":{"href":"https://open.gl/transformations","rel":["nofollow"]},"children":[{"type":"text","value":"open.gl"}]},{"type":"text","value":"."}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-f1b75a{color:#79C0FF}.ct-c6b3e4{color:#FF7B72}.ct-43f728{color:#D2A8FF}.ct-b79326{color:#FF7B72}.ct-c1002a{color:#C9D1D9}.ct-22b8af{color:#8B949E}.light .ct-22b8af{color:#93A1A1}.light .ct-c1002a{color:#657B83}.light .ct-b79326{color:#073642}.light .ct-43f728{color:#268BD2}.light .ct-c6b3e4{color:#859900}.light .ct-f1b75a{color:#D33682}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"sample-code","depth":2,"text":"Sample code"},{"id":"passing-parameters-to-vertexshader","depth":2,"text":"Passing parameters to VertexShader"},{"id":"applying-transformations","depth":2,"text":"Applying transformations"}]}},"_type":"markdown","_id":"content:Frontend:WebGL:Vertex Shaders.md","_source":"content","_file":"Frontend/WebGL/Vertex Shaders.md","_extension":"md"} \ No newline at end of file diff --git a/docs/blockchain/common-typescript-examples/_payload.js b/docs/blockchain/common-typescript-examples/_payload.js index b880030..5a907a5 100644 --- a/docs/blockchain/common-typescript-examples/_payload.js +++ b/docs/blockchain/common-typescript-examples/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC,aD,aE,aF,aG,aH,aI,aJ,aK,aL,aM,aN,aO,aP,aQ,aR,aS,aT,aU,aV,aW,aX,aY,aZ,a_,a$,ba,bb,bc,bd,be,bf,bg,bh,bi,bj,bk,bl,bm,bn,bo,bp,bq,br,bs,bt,bu,bv,bw,bx,by,bz,bA,bB,bC,bD,bE,bF,bG,bH,bI,bJ,bK,bL,bM,bN,bO,bP,bQ,bR,bS,bT,bU,bV,bW,bX,bY,bZ,b_,b$,ca,cb,cc){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:aY,_path:aZ},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-84dtRQ1pg6":{_path:aZ,_dir:"blockchain",_draft:ak,_partial:ak,_locale:"en",_empty:ak,title:aY,description:p,excerpt:{type:a_,children:[{type:a,tag:a$,props:{},children:[{type:a,tag:Y,props:{},children:[{type:c,value:ba},{type:a,tag:M,props:{href:Z,rel:[_]},children:[{type:c,value:Z}]}]},{type:a,tag:Y,props:{},children:[{type:c,value:bb},{type:a,tag:M,props:{href:bc},children:[{type:c,value:bd}]}]}]},{type:a,tag:u,props:{id:al},children:[{type:c,value:am}]},{type:a,tag:D,props:{},children:[{type:c,value:be},{type:a,tag:N,props:{},children:[{type:c,value:bf}]},{type:c,value:bg},{type:a,tag:M,props:{href:bh,rel:[_]},children:[{type:c,value:bi}]},{type:c,value:bj}]},{type:a,tag:j,props:{code:an,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:c,value:an}]}]}]},{type:a,tag:u,props:{id:ao},children:[{type:c,value:ap}]},{type:a,tag:j,props:{code:aq,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:c,value:aq}]}]}]},{type:a,tag:u,props:{id:ar},children:[{type:c,value:as}]},{type:a,tag:j,props:{code:at,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:c,value:at}]}]}]},{type:a,tag:u,props:{id:au},children:[{type:c,value:av}]},{type:a,tag:D,props:{},children:[{type:c,value:bk},{type:a,tag:N,props:{},children:[{type:c,value:O}]},{type:c,value:bl},{type:a,tag:N,props:{},children:[{type:c,value:P}]},{type:c,value:bm}]},{type:a,tag:j,props:{code:aw,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:c,value:aw}]}]}]},{type:a,tag:u,props:{id:ax},children:[{type:c,value:ay}]},{type:a,tag:D,props:{},children:[{type:c,value:bn}]},{type:a,tag:j,props:{code:az,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:c,value:az}]}]}]},{type:a,tag:u,props:{id:aA},children:[{type:c,value:aB}]},{type:a,tag:j,props:{code:aC,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:c,value:aC}]}]}]},{type:a,tag:u,props:{id:aD},children:[{type:c,value:aE}]},{type:a,tag:j,props:{code:aF,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:c,value:aF}]}]}]},{type:a,tag:u,props:{id:aG},children:[{type:c,value:aH}]},{type:a,tag:j,props:{code:aI,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:c,value:aI}]}]}]},{type:a,tag:u,props:{id:aJ},children:[{type:c,value:aK}]},{type:a,tag:D,props:{},children:[{type:c,value:bo}]},{type:a,tag:j,props:{code:aL,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:c,value:aL}]}]}]},{type:a,tag:D,props:{},children:[{type:c,value:bp}]},{type:a,tag:j,props:{code:aM,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:c,value:aM}]}]}]}]},body:{type:a_,children:[{type:a,tag:a$,props:{},children:[{type:a,tag:Y,props:{},children:[{type:c,value:ba},{type:a,tag:M,props:{href:Z,rel:[_]},children:[{type:c,value:Z}]}]},{type:a,tag:Y,props:{},children:[{type:c,value:bb},{type:a,tag:M,props:{href:bc},children:[{type:c,value:bd}]}]}]},{type:a,tag:u,props:{id:al},children:[{type:c,value:am}]},{type:a,tag:D,props:{},children:[{type:c,value:be},{type:a,tag:N,props:{},children:[{type:c,value:bf}]},{type:c,value:bg},{type:a,tag:M,props:{href:bh,rel:[_]},children:[{type:c,value:bi}]},{type:c,value:bj}]},{type:a,tag:j,props:{code:an,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:i},children:[{type:c,value:aN}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'web3'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:H},children:[{type:c,value:"\u002F\u002F URL of your node"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:bq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'https:\u002F\u002F...'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:i},children:[{type:c,value:"export"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aO}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"givenProvider"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"||"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:bq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]}]}]}]}]},{type:a,tag:u,props:{id:ao},children:[{type:c,value:ap}]},{type:a,tag:j,props:{code:aq,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:aa},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:br},children:[{type:c,value:bs}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:bt},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:aa},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:bu},children:[{type:c,value:bv}]},{type:a,tag:b,props:{class:bt},children:[{type:c,value:bw}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:"ct-c5949b"},children:[{type:c,value:"string"}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:bx}]},{type:a,tag:b,props:{class:aa},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:bs}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bv}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]}]}]}]},{type:a,tag:u,props:{id:ar},children:[{type:c,value:as}]},{type:a,tag:j,props:{code:at,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:H},children:[{type:c,value:"\u002F\u002F first we need to authorize"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"authorize"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aP}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aQ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:by}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'eth_requestAccounts'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" });"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:H},children:[{type:c,value:"\u002F\u002F then we can get wallet address"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"getCurrentAddressUser"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aP}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aQ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"selectedAddress"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]}]}]}]},{type:a,tag:u,props:{id:au},children:[{type:c,value:av}]},{type:a,tag:D,props:{},children:[{type:c,value:bk},{type:a,tag:N,props:{},children:[{type:c,value:O}]},{type:c,value:bl},{type:a,tag:N,props:{},children:[{type:c,value:P}]},{type:c,value:bm}]},{type:a,tag:j,props:{code:aw,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"transfer"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" ({ "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bz}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bA}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:bB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"getTransactionCount"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:bC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ae}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:bD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bE}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:bF}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:bG}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bH}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" gasLimit: "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:af}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" gasPrice: "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:af}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" nonce: "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:af}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bI}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:bJ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"EthUtil"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"toBuffer"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bz}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:aR}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aO}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"Transaction"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aR}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"sign"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bJ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:bK}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aR}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"serialize"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ae}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:"this"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"sendSignedTransaction"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"`0x${"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bK}]},{type:a,tag:b,props:{class:aS},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:aS},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'hex'"}]},{type:a,tag:b,props:{class:aS},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"}`"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bL}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]}]}]}]},{type:a,tag:u,props:{id:ax},children:[{type:c,value:ay}]},{type:a,tag:D,props:{},children:[{type:c,value:bn}]},{type:a,tag:j,props:{code:az,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:i},children:[{type:c,value:aN}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bM}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bN}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:bO}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"estimateFee"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" ({"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bA}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:bC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ae}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"estimateGas"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ai}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bE}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:bF}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:bG}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bH}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bI}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"asciiToHex"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:af}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" })."}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"call"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ae}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"fromWei"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:aT},children:[{type:c,value:bP}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"())"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bQ}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"multiply"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:aT},children:[{type:c,value:bP}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"()))"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bQ}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"()"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bL}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]}]}]}]},{type:a,tag:u,props:{id:aA},children:[{type:c,value:aB}]},{type:a,tag:j,props:{code:aC,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:i},children:[{type:c,value:aN}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bM}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bN}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:bO}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aQ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:bR}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'accountsChanged'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"callback"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]}]}]}]}]},{type:a,tag:u,props:{id:aD},children:[{type:c,value:aE}]},{type:a,tag:j,props:{code:aF,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:bR}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'chainChanged'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"handler"}]},{type:a,tag:b,props:{class:"ct-78e6f9"},children:[{type:c,value:bw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]}]}]}]},{type:a,tag:u,props:{id:aG},children:[{type:c,value:aH}]},{type:a,tag:j,props:{code:aI,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:aU}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:X}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aV}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ai}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bS}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'wallet_watchAsset'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" params: {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" type: "}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'ERC20'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" options: {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" address: "}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'0xb60e8dd61c5d32be8058bb8eb970870f07233155'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" symbol: "}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'FOO'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" decimals: "}]},{type:a,tag:b,props:{class:aW},children:[{type:c,value:bT}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" image: "}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'https:\u002F\u002Ffoo.io\u002Ftoken-image.svg'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" },"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" },"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bU}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:y},children:[{type:c,value:aV}]},{type:a,tag:b,props:{class:br},children:[{type:c,value:"then"}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:"(("}]},{type:a,tag:b,props:{class:bu},children:[{type:c,value:bV}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:bx}]},{type:a,tag:b,props:{class:aa},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:bW}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bV}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aj}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bX}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"log"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'FOO successfully added to wallet!'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ah}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bY}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"else"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"throw"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aO}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:aT},children:[{type:c,value:"Error"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'Something went wrong.'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ah}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bZ}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bU}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aV}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aX}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bX}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:b_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ah}]}]}]}]}]},{type:a,tag:u,props:{id:aJ},children:[{type:c,value:aK}]},{type:a,tag:D,props:{},children:[{type:c,value:bo}]},{type:a,tag:j,props:{code:aL,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"getChainID"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aP}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:by}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'eth_chainId'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" })"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]}]}]}]},{type:a,tag:D,props:{},children:[{type:c,value:bp}]},{type:a,tag:j,props:{code:aM,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:i},children:[{type:c,value:b$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aU}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ai}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bS}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'wallet_switchEthereumChain'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" params: [{ chainId: "}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:ca}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" }], "}]},{type:a,tag:b,props:{class:H},children:[{type:c,value:cb}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" });"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"} "}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aX}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"switchError"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aj}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:H},children:[{type:c,value:"\u002F\u002F This error code indicates that the chain has not been added to MetaMask."}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:bW}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:b_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"==="}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:aW},children:[{type:c,value:"4902"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aj}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:b$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aU}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ai}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" method: "}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'wallet_addEthereumChain'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" params: [{ "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" chainId: "}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:ca}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:H},children:[{type:c,value:cb}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" chainName: "}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'Ropsten Test Network'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" nativeCurrency: { "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" name: "}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:cc}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" symbol: "}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:cc}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" decimals: "}]},{type:a,tag:b,props:{class:aW},children:[{type:c,value:bT}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }, "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" rpcUrls: ["}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'https:\u002F\u002Fropsten.infura.io\u002Fv3\u002F9aa3d95b3bc440fa88ea12eaa4456161'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"], "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" blockExplorerUrls: ["}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'https:\u002F\u002Fropsten.etherscan.io'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"] "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }] ,"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" });"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bY}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aX}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"addError"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aj}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:H},children:[{type:c,value:"\u002F\u002F handle \"add\" error"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bZ}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:H},children:[{type:c,value:"\u002F\u002F handle other \"switch\" errors"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-9f9086{color:#79C0FF}.ct-78e6f9{color:#C9D1D9}.ct-f08b88{color:#79C0FF}.ct-4ab335{color:#A5D6FF}.ct-c5949b{color:#79C0FF}.ct-53baf5{color:#FFA657}.ct-6a0c55{color:#FF7B72}.ct-adb89a{color:#D2A8FF}.ct-2f2ea3{color:#C9D1D9}.ct-a4ec55{color:#FF7B72}.ct-29697d{color:#D2A8FF}.ct-654ee1{color:#79C0FF}.ct-ac442e{color:#FF7B72}.ct-75e8dd{color:#8B949E}.ct-aaf828{color:#A5D6FF}.ct-7bd146{color:#C9D1D9}.ct-c2c078{color:#C9D1D9}.ct-eafdf1{color:#FF7B72}.light .ct-eafdf1{color:#859900}.light .ct-c2c078{color:#657B83}.light .ct-7bd146{color:#268BD2}.light .ct-aaf828{color:#2AA198}.light .ct-75e8dd{color:#93A1A1}.light .ct-ac442e{color:#073642}.light .ct-654ee1{color:#268BD2}.light .ct-29697d{color:#268BD2}.light .ct-a4ec55{color:#073642}.light .ct-2f2ea3{color:#657B83}.light .ct-adb89a{color:#268BD2}.light .ct-6a0c55{color:#859900}.light .ct-53baf5{color:#657B83}.light .ct-c5949b{color:#859900}.light .ct-4ab335{color:#657B83}.light .ct-f08b88{color:#859900}.light .ct-78e6f9{color:#859900}.light .ct-9f9086{color:#D33682}"}]}],toc:{title:p,searchDepth:C,depth:C,links:[{id:al,depth:C,text:am},{id:ao,depth:C,text:ap},{id:ar,depth:C,text:as},{id:au,depth:C,text:av},{id:ax,depth:C,text:ay},{id:aA,depth:C,text:aB},{id:aD,depth:C,text:aE},{id:aG,depth:C,text:aH},{id:aJ,depth:C,text:aK}]}},_type:"markdown",_id:"content:Blockchain:Common typescript examples.md",_source:"content",_file:"Blockchain\u002FCommon typescript examples.md",_extension:"md"}},prerenderedAt:1711020226436}}("element","span","text","ct-c2c078","line","ct-7bd146"," ",".","ct-eafdf1","code","ct-29697d","ct-aaf828"," ","(","ct-ac442e","","typescript","pre","web3",",","h2","=","const","ct-654ee1","ct-2f2ea3"," {"," ",", ",2,"p"," ","utils","from","ct-75e8dd","await",");","=\u003E","}","a","code-inline","value","memo","eth",";","async"," (","return","request","toHex","ethereum","li","https:\u002F\u002Fmetamask.github.io\u002Ftest-dapp\u002F","nofollow","Web3","ct-a4ec55","to","gasLimit","gasPrice","();","),","toString",")","({",") {",false,"connecting-to-node","Connecting to node","import Web3 from 'web3';\n\n\u002F\u002F URL of your node\nconst PROVIDER_URL = 'https:\u002F\u002F...';\n\nexport const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n","getting-wallet-balance","Getting wallet balance","const getBalance = async (address: string) =\u003E {\n return await web3.eth.getBalance(address);\n}\n","getting-wallet-address","Getting wallet address","\u002F\u002F first we need to authorize\nconst authorize = async () =\u003E {\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n}\n\n\u002F\u002F then we can get wallet address\nconst getCurrentAddressUser = () =\u003E {\n return web3.currentProvider.selectedAddress;\n}\n","sending-transaction","Sending transaction","\nconst transfer = async ({ \n from, \n to, \n value, \n memo, \n privateKey, \n gasLimit = 44000 \n}) =\u003E {\n const nonce = await web3.eth.getTransactionCount(from);\n const gasPrice = await web3.eth.getGasPrice();\n \n const rawTx = {\n from,\n to,\n value: web3.utils.toHex(Web3.utils.toWei(value, 'ether')),\n gasLimit: web3.utils.toHex(gasLimit),\n gasPrice: web3.utils.toHex(gasPrice),\n nonce: web3.utils.toHex(nonce),\n data: memo,\n };\n \n const privateKeyBuffer = EthUtil.toBuffer(privateKey);\n \n const tx = new Transaction(rawTx);\n \n tx.sign(privateKeyBuffer);\n const serializedTx = tx.serialize();\n \n return this.web3.eth.sendSignedTransaction(\n `0x${serializedTx.toString('hex')}`\n );\n}\n","estimating-transaction-fee","Estimating transaction FEE","import { web3 } from '.';\n\nconst estimateFee = async ({\n from,\n to,\n value,\n memo,\n}) =\u003E {\n const gasPrice = await web3.eth.getGasPrice();\n const gasLimit = await web3.eth.estimateGas({\n from,\n to,\n value: web3.utils.toHex(web3.utils.toWei(value, 'ether')),\n data: web3.utils.asciiToHex(memo),\n }).call();\n \n return web3.utils.fromWei(\n BigInt(gasPrice.toString())\n .multiply(BigInt(gasLimit.toString()))\n .toString()\n );\n}\n","subscribing-to-wallet-address-change","Subscribing to wallet address change","import { web3 } from '.';\n\nweb3.currentProvider.on('accountsChanged', callback);\n","watching-network-change","Watching network change","ethereum.on('chainChanged', handler: (chainId: string) =\u003E void);\n","adding-custom-token-to-wallet","Adding custom token to wallet","window.ethereum\n .request({\n method: 'wallet_watchAsset',\n params: {\n type: 'ERC20',\n options: {\n address: '0xb60e8dd61c5d32be8058bb8eb970870f07233155',\n symbol: 'FOO',\n decimals: 18,\n image: 'https:\u002F\u002Ffoo.io\u002Ftoken-image.svg',\n },\n },\n })\n .then((success) =\u003E {\n if (success) {\n console.log('FOO successfully added to wallet!')\n } else {\n throw new Error('Something went wrong.')\n }\n })\n .catch(console.error)\n","changing-network-to-custom","Changing network to custom","const getChainID = async () =\u003E {\n return ethereum.request({ method: 'eth_chainId' })\n}\n","try {\n await window.ethereum.request({\n method: 'wallet_switchEthereumChain',\n params: [{ chainId: '0x03' }], \u002F\u002F ropsten chainID (3) in hex\n });\n} catch (switchError) {\n \u002F\u002F This error code indicates that the chain has not been added to MetaMask.\n if (error.code === 4902) {\n try {\n await window.ethereum.request({\n method: 'wallet_addEthereumChain',\n params: [{ \n chainId: '0x03', \u002F\u002F ropsten chainID (3) in hex\n chainName: 'Ropsten Test Network', \n nativeCurrency: { \n name: 'ETH',\n symbol: 'ETH',\n decimals: 18\n }, \n rpcUrls: ['https:\u002F\u002Fropsten.infura.io\u002Fv3\u002F9aa3d95b3bc440fa88ea12eaa4456161'], \n blockExplorerUrls: ['https:\u002F\u002Fropsten.etherscan.io'] \n }] ,\n });\n } catch (addError) {\n \u002F\u002F handle \"add\" error\n }\n }\n \u002F\u002F handle other \"switch\" errors\n}\n","import","new"," () ","currentProvider","tx","ct-4ab335","ct-f08b88","window"," .","ct-9f9086","catch","Common Typescript Examples","\u002Fblockchain\u002Fcommon-typescript-examples","root","ul","Simple #dapp example for tests: ","Interaction with smart contracts described in ","Smart%20contracts","Smart contracts","If #Metamask extension installed, ","Web3.givenProvider"," is available in global window. You can use ","https:\u002F\u002Finfura.io","Infura"," or your node instead:","Sending "," tokens with "," as value:","Useful to get fixed amount of tokens from user with pre-estimated fee.","Checking current chainId:","Asking wallet to change current network:","PROVIDER_URL","ct-adb89a","getBalance","ct-6a0c55","ct-53baf5","address",":",") ","({ method: ","privateKey","}) ","nonce","getGasPrice","rawTx"," value: ","toWei","'ether'",")),"," data: ","privateKeyBuffer","serializedTx"," );"," { "," } ","'.'","BigInt"," .","on"," method: ","18"," })","success","if","console"," } "," }","error","try","'0x03'","\u002F\u002F ropsten chainID (3) in hex","'ETH'")) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC,aD,aE,aF,aG,aH,aI,aJ,aK,aL,aM,aN,aO,aP,aQ,aR,aS,aT,aU,aV,aW,aX,aY,aZ,a_,a$,ba,bb,bc,bd,be,bf,bg,bh,bi,bj,bk,bl,bm,bn,bo,bp,bq,br,bs,bt,bu,bv,bw,bx,by,bz,bA,bB,bC,bD,bE,bF,bG,bH,bI,bJ,bK,bL,bM,bN,bO,bP,bQ,bR,bS,bT,bU,bV,bW,bX,bY,bZ,b_,b$,ca,cb,cc){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:aY,_path:aZ},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-84dtRQ1pg6":{_path:aZ,_dir:"blockchain",_draft:ak,_partial:ak,_locale:"en",_empty:ak,title:aY,description:p,excerpt:{type:a_,children:[{type:a,tag:a$,props:{},children:[{type:a,tag:Y,props:{},children:[{type:c,value:ba},{type:a,tag:M,props:{href:Z,rel:[_]},children:[{type:c,value:Z}]}]},{type:a,tag:Y,props:{},children:[{type:c,value:bb},{type:a,tag:M,props:{href:bc},children:[{type:c,value:bd}]}]}]},{type:a,tag:u,props:{id:al},children:[{type:c,value:am}]},{type:a,tag:D,props:{},children:[{type:c,value:be},{type:a,tag:N,props:{},children:[{type:c,value:bf}]},{type:c,value:bg},{type:a,tag:M,props:{href:bh,rel:[_]},children:[{type:c,value:bi}]},{type:c,value:bj}]},{type:a,tag:j,props:{code:an,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:c,value:an}]}]}]},{type:a,tag:u,props:{id:ao},children:[{type:c,value:ap}]},{type:a,tag:j,props:{code:aq,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:c,value:aq}]}]}]},{type:a,tag:u,props:{id:ar},children:[{type:c,value:as}]},{type:a,tag:j,props:{code:at,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:c,value:at}]}]}]},{type:a,tag:u,props:{id:au},children:[{type:c,value:av}]},{type:a,tag:D,props:{},children:[{type:c,value:bk},{type:a,tag:N,props:{},children:[{type:c,value:O}]},{type:c,value:bl},{type:a,tag:N,props:{},children:[{type:c,value:P}]},{type:c,value:bm}]},{type:a,tag:j,props:{code:aw,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:c,value:aw}]}]}]},{type:a,tag:u,props:{id:ax},children:[{type:c,value:ay}]},{type:a,tag:D,props:{},children:[{type:c,value:bn}]},{type:a,tag:j,props:{code:az,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:c,value:az}]}]}]},{type:a,tag:u,props:{id:aA},children:[{type:c,value:aB}]},{type:a,tag:j,props:{code:aC,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:c,value:aC}]}]}]},{type:a,tag:u,props:{id:aD},children:[{type:c,value:aE}]},{type:a,tag:j,props:{code:aF,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:c,value:aF}]}]}]},{type:a,tag:u,props:{id:aG},children:[{type:c,value:aH}]},{type:a,tag:j,props:{code:aI,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:c,value:aI}]}]}]},{type:a,tag:u,props:{id:aJ},children:[{type:c,value:aK}]},{type:a,tag:D,props:{},children:[{type:c,value:bo}]},{type:a,tag:j,props:{code:aL,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:c,value:aL}]}]}]},{type:a,tag:D,props:{},children:[{type:c,value:bp}]},{type:a,tag:j,props:{code:aM,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:c,value:aM}]}]}]}]},body:{type:a_,children:[{type:a,tag:a$,props:{},children:[{type:a,tag:Y,props:{},children:[{type:c,value:ba},{type:a,tag:M,props:{href:Z,rel:[_]},children:[{type:c,value:Z}]}]},{type:a,tag:Y,props:{},children:[{type:c,value:bb},{type:a,tag:M,props:{href:bc},children:[{type:c,value:bd}]}]}]},{type:a,tag:u,props:{id:al},children:[{type:c,value:am}]},{type:a,tag:D,props:{},children:[{type:c,value:be},{type:a,tag:N,props:{},children:[{type:c,value:bf}]},{type:c,value:bg},{type:a,tag:M,props:{href:bh,rel:[_]},children:[{type:c,value:bi}]},{type:c,value:bj}]},{type:a,tag:j,props:{code:an,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:i},children:[{type:c,value:aN}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'web3'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:H},children:[{type:c,value:"\u002F\u002F URL of your node"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:bq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'https:\u002F\u002F...'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:i},children:[{type:c,value:"export"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aO}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"givenProvider"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"||"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:bq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]}]}]}]}]},{type:a,tag:u,props:{id:ao},children:[{type:c,value:ap}]},{type:a,tag:j,props:{code:aq,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:aa},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:br},children:[{type:c,value:bs}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:bt},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:aa},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:bu},children:[{type:c,value:bv}]},{type:a,tag:b,props:{class:bt},children:[{type:c,value:bw}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:"ct-5aec75"},children:[{type:c,value:"string"}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:bx}]},{type:a,tag:b,props:{class:aa},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:bs}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bv}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]}]}]}]},{type:a,tag:u,props:{id:ar},children:[{type:c,value:as}]},{type:a,tag:j,props:{code:at,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:H},children:[{type:c,value:"\u002F\u002F first we need to authorize"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"authorize"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aP}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aQ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:by}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'eth_requestAccounts'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" });"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:H},children:[{type:c,value:"\u002F\u002F then we can get wallet address"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"getCurrentAddressUser"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aP}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aQ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"selectedAddress"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]}]}]}]},{type:a,tag:u,props:{id:au},children:[{type:c,value:av}]},{type:a,tag:D,props:{},children:[{type:c,value:bk},{type:a,tag:N,props:{},children:[{type:c,value:O}]},{type:c,value:bl},{type:a,tag:N,props:{},children:[{type:c,value:P}]},{type:c,value:bm}]},{type:a,tag:j,props:{code:aw,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"transfer"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" ({ "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bz}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bA}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:bB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"getTransactionCount"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:bC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ae}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:bD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bE}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:bF}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:bG}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bH}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" gasLimit: "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:af}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" gasPrice: "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:af}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" nonce: "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:af}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bI}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:bJ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"EthUtil"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"toBuffer"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bz}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:aR}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aO}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"Transaction"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aR}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"sign"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bJ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:bK}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aR}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"serialize"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ae}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:"this"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"sendSignedTransaction"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"`0x${"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bK}]},{type:a,tag:b,props:{class:aS},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:aS},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'hex'"}]},{type:a,tag:b,props:{class:aS},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"}`"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bL}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]}]}]}]},{type:a,tag:u,props:{id:ax},children:[{type:c,value:ay}]},{type:a,tag:D,props:{},children:[{type:c,value:bn}]},{type:a,tag:j,props:{code:az,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:i},children:[{type:c,value:aN}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bM}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bN}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:bO}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"estimateFee"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" ({"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bA}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:bC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ae}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"estimateGas"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ai}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bE}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:bF}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:bG}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bH}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bI}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"asciiToHex"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:af}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" })."}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"call"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ae}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"fromWei"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:aT},children:[{type:c,value:bP}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"())"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bQ}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"multiply"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:aT},children:[{type:c,value:bP}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"()))"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bQ}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"()"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bL}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]}]}]}]},{type:a,tag:u,props:{id:aA},children:[{type:c,value:aB}]},{type:a,tag:j,props:{code:aC,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:i},children:[{type:c,value:aN}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bM}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bN}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:bO}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aQ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:bR}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'accountsChanged'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"callback"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]}]}]}]}]},{type:a,tag:u,props:{id:aD},children:[{type:c,value:aE}]},{type:a,tag:j,props:{code:aF,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:bR}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'chainChanged'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"handler"}]},{type:a,tag:b,props:{class:"ct-ae222c"},children:[{type:c,value:bw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]}]}]}]},{type:a,tag:u,props:{id:aG},children:[{type:c,value:aH}]},{type:a,tag:j,props:{code:aI,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:aU}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:X}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aV}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ai}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bS}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'wallet_watchAsset'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" params: {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" type: "}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'ERC20'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" options: {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" address: "}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'0xb60e8dd61c5d32be8058bb8eb970870f07233155'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" symbol: "}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'FOO'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" decimals: "}]},{type:a,tag:b,props:{class:aW},children:[{type:c,value:bT}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" image: "}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'https:\u002F\u002Ffoo.io\u002Ftoken-image.svg'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" },"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" },"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bU}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:y},children:[{type:c,value:aV}]},{type:a,tag:b,props:{class:br},children:[{type:c,value:"then"}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:"(("}]},{type:a,tag:b,props:{class:bu},children:[{type:c,value:bV}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:bx}]},{type:a,tag:b,props:{class:aa},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:bW}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bV}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aj}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bX}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"log"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'FOO successfully added to wallet!'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ah}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bY}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"else"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"throw"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aO}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:aT},children:[{type:c,value:"Error"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'Something went wrong.'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ah}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bZ}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bU}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aV}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aX}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bX}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:b_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ah}]}]}]}]}]},{type:a,tag:u,props:{id:aJ},children:[{type:c,value:aK}]},{type:a,tag:D,props:{},children:[{type:c,value:bo}]},{type:a,tag:j,props:{code:aL,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:o},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"getChainID"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aP}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:by}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'eth_chainId'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" })"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]}]}]}]},{type:a,tag:D,props:{},children:[{type:c,value:bp}]},{type:a,tag:j,props:{code:aM,language:q},children:[{type:a,tag:r,props:{},children:[{type:a,tag:j,props:{__ignoreMap:p},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:i},children:[{type:c,value:b$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aU}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ai}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bS}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'wallet_switchEthereumChain'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" params: [{ chainId: "}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:ca}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" }], "}]},{type:a,tag:b,props:{class:H},children:[{type:c,value:cb}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" });"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"} "}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aX}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"switchError"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aj}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:H},children:[{type:c,value:"\u002F\u002F This error code indicates that the chain has not been added to MetaMask."}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:bW}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:b_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"==="}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:aW},children:[{type:c,value:"4902"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aj}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:b$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aU}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ai}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" method: "}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'wallet_addEthereumChain'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" params: [{ "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" chainId: "}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:ca}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:H},children:[{type:c,value:cb}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" chainName: "}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'Ropsten Test Network'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" nativeCurrency: { "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" name: "}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:cc}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" symbol: "}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:cc}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" decimals: "}]},{type:a,tag:b,props:{class:aW},children:[{type:c,value:bT}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }, "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" rpcUrls: ["}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'https:\u002F\u002Fropsten.infura.io\u002Fv3\u002F9aa3d95b3bc440fa88ea12eaa4456161'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"], "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" blockExplorerUrls: ["}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'https:\u002F\u002Fropsten.etherscan.io'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"] "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }] ,"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" });"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bY}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aX}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"addError"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aj}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:H},children:[{type:c,value:"\u002F\u002F handle \"add\" error"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bZ}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:H},children:[{type:c,value:"\u002F\u002F handle other \"switch\" errors"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-1b62bb{color:#79C0FF}.ct-ae222c{color:#C9D1D9}.ct-7549d7{color:#79C0FF}.ct-7a93f8{color:#A5D6FF}.ct-5aec75{color:#79C0FF}.ct-0feb94{color:#FFA657}.ct-fbdb54{color:#FF7B72}.ct-beff07{color:#D2A8FF}.ct-044655{color:#C9D1D9}.ct-343e52{color:#FF7B72}.ct-eb243d{color:#D2A8FF}.ct-c29390{color:#79C0FF}.ct-b49b42{color:#FF7B72}.ct-06c9fd{color:#8B949E}.ct-d5c300{color:#A5D6FF}.ct-5cf544{color:#C9D1D9}.ct-e988dc{color:#C9D1D9}.ct-e0e232{color:#FF7B72}.light .ct-e0e232{color:#859900}.light .ct-e988dc{color:#657B83}.light .ct-5cf544{color:#268BD2}.light .ct-d5c300{color:#2AA198}.light .ct-06c9fd{color:#93A1A1}.light .ct-b49b42{color:#073642}.light .ct-c29390{color:#268BD2}.light .ct-eb243d{color:#268BD2}.light .ct-343e52{color:#073642}.light .ct-044655{color:#657B83}.light .ct-beff07{color:#268BD2}.light .ct-fbdb54{color:#859900}.light .ct-0feb94{color:#657B83}.light .ct-5aec75{color:#859900}.light .ct-7a93f8{color:#657B83}.light .ct-7549d7{color:#859900}.light .ct-ae222c{color:#859900}.light .ct-1b62bb{color:#D33682}"}]}],toc:{title:p,searchDepth:C,depth:C,links:[{id:al,depth:C,text:am},{id:ao,depth:C,text:ap},{id:ar,depth:C,text:as},{id:au,depth:C,text:av},{id:ax,depth:C,text:ay},{id:aA,depth:C,text:aB},{id:aD,depth:C,text:aE},{id:aG,depth:C,text:aH},{id:aJ,depth:C,text:aK}]}},_type:"markdown",_id:"content:Blockchain:Common typescript examples.md",_source:"content",_file:"Blockchain\u002FCommon typescript examples.md",_extension:"md"}},prerenderedAt:1711020859971}}("element","span","text","ct-e988dc","line","ct-5cf544"," ",".","ct-e0e232","code","ct-eb243d","ct-d5c300"," ","(","ct-b49b42","","typescript","pre","web3",",","h2","=","const","ct-c29390","ct-044655"," {"," ",", ",2,"p"," ","utils","from","ct-06c9fd","await",");","=\u003E","}","a","code-inline","value","memo","eth",";","async"," (","return","request","toHex","ethereum","li","https:\u002F\u002Fmetamask.github.io\u002Ftest-dapp\u002F","nofollow","Web3","ct-343e52","to","gasLimit","gasPrice","();","),","toString",")","({",") {",false,"connecting-to-node","Connecting to node","import Web3 from 'web3';\n\n\u002F\u002F URL of your node\nconst PROVIDER_URL = 'https:\u002F\u002F...';\n\nexport const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n","getting-wallet-balance","Getting wallet balance","const getBalance = async (address: string) =\u003E {\n return await web3.eth.getBalance(address);\n}\n","getting-wallet-address","Getting wallet address","\u002F\u002F first we need to authorize\nconst authorize = async () =\u003E {\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n}\n\n\u002F\u002F then we can get wallet address\nconst getCurrentAddressUser = () =\u003E {\n return web3.currentProvider.selectedAddress;\n}\n","sending-transaction","Sending transaction","\nconst transfer = async ({ \n from, \n to, \n value, \n memo, \n privateKey, \n gasLimit = 44000 \n}) =\u003E {\n const nonce = await web3.eth.getTransactionCount(from);\n const gasPrice = await web3.eth.getGasPrice();\n \n const rawTx = {\n from,\n to,\n value: web3.utils.toHex(Web3.utils.toWei(value, 'ether')),\n gasLimit: web3.utils.toHex(gasLimit),\n gasPrice: web3.utils.toHex(gasPrice),\n nonce: web3.utils.toHex(nonce),\n data: memo,\n };\n \n const privateKeyBuffer = EthUtil.toBuffer(privateKey);\n \n const tx = new Transaction(rawTx);\n \n tx.sign(privateKeyBuffer);\n const serializedTx = tx.serialize();\n \n return this.web3.eth.sendSignedTransaction(\n `0x${serializedTx.toString('hex')}`\n );\n}\n","estimating-transaction-fee","Estimating transaction FEE","import { web3 } from '.';\n\nconst estimateFee = async ({\n from,\n to,\n value,\n memo,\n}) =\u003E {\n const gasPrice = await web3.eth.getGasPrice();\n const gasLimit = await web3.eth.estimateGas({\n from,\n to,\n value: web3.utils.toHex(web3.utils.toWei(value, 'ether')),\n data: web3.utils.asciiToHex(memo),\n }).call();\n \n return web3.utils.fromWei(\n BigInt(gasPrice.toString())\n .multiply(BigInt(gasLimit.toString()))\n .toString()\n );\n}\n","subscribing-to-wallet-address-change","Subscribing to wallet address change","import { web3 } from '.';\n\nweb3.currentProvider.on('accountsChanged', callback);\n","watching-network-change","Watching network change","ethereum.on('chainChanged', handler: (chainId: string) =\u003E void);\n","adding-custom-token-to-wallet","Adding custom token to wallet","window.ethereum\n .request({\n method: 'wallet_watchAsset',\n params: {\n type: 'ERC20',\n options: {\n address: '0xb60e8dd61c5d32be8058bb8eb970870f07233155',\n symbol: 'FOO',\n decimals: 18,\n image: 'https:\u002F\u002Ffoo.io\u002Ftoken-image.svg',\n },\n },\n })\n .then((success) =\u003E {\n if (success) {\n console.log('FOO successfully added to wallet!')\n } else {\n throw new Error('Something went wrong.')\n }\n })\n .catch(console.error)\n","changing-network-to-custom","Changing network to custom","const getChainID = async () =\u003E {\n return ethereum.request({ method: 'eth_chainId' })\n}\n","try {\n await window.ethereum.request({\n method: 'wallet_switchEthereumChain',\n params: [{ chainId: '0x03' }], \u002F\u002F ropsten chainID (3) in hex\n });\n} catch (switchError) {\n \u002F\u002F This error code indicates that the chain has not been added to MetaMask.\n if (error.code === 4902) {\n try {\n await window.ethereum.request({\n method: 'wallet_addEthereumChain',\n params: [{ \n chainId: '0x03', \u002F\u002F ropsten chainID (3) in hex\n chainName: 'Ropsten Test Network', \n nativeCurrency: { \n name: 'ETH',\n symbol: 'ETH',\n decimals: 18\n }, \n rpcUrls: ['https:\u002F\u002Fropsten.infura.io\u002Fv3\u002F9aa3d95b3bc440fa88ea12eaa4456161'], \n blockExplorerUrls: ['https:\u002F\u002Fropsten.etherscan.io'] \n }] ,\n });\n } catch (addError) {\n \u002F\u002F handle \"add\" error\n }\n }\n \u002F\u002F handle other \"switch\" errors\n}\n","import","new"," () ","currentProvider","tx","ct-7a93f8","ct-7549d7","window"," .","ct-1b62bb","catch","Common Typescript Examples","\u002Fblockchain\u002Fcommon-typescript-examples","root","ul","Simple #dapp example for tests: ","Interaction with smart contracts described in ","Smart%20contracts","Smart contracts","If #Metamask extension installed, ","Web3.givenProvider"," is available in global window. You can use ","https:\u002F\u002Finfura.io","Infura"," or your node instead:","Sending "," tokens with "," as value:","Useful to get fixed amount of tokens from user with pre-estimated fee.","Checking current chainId:","Asking wallet to change current network:","PROVIDER_URL","ct-beff07","getBalance","ct-fbdb54","ct-0feb94","address",":",") ","({ method: ","privateKey","}) ","nonce","getGasPrice","rawTx"," value: ","toWei","'ether'",")),"," data: ","privateKeyBuffer","serializedTx"," );"," { "," } ","'.'","BigInt"," .","on"," method: ","18"," })","success","if","console"," } "," }","error","try","'0x03'","\u002F\u002F ropsten chainID (3) in hex","'ETH'")) \ No newline at end of file diff --git a/docs/blockchain/common-typescript-examples/index.html b/docs/blockchain/common-typescript-examples/index.html index d779c81..f28f6b6 100644 --- a/docs/blockchain/common-typescript-examples/index.html +++ b/docs/blockchain/common-typescript-examples/index.html @@ -1,6 +1,6 @@ -Common Typescript Examples • Obsidian Garden -

Common Typescript Examples

Connecting to node

If #Metamask extension installed, Web3.givenProvider is available in global window. You can use Infura or your node instead:

import Web3 from 'web3';// URL of your nodeconst PROVIDER_URL = 'https://...';export const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);

Getting wallet balance

const getBalance = async (address: string) => {    return await web3.eth.getBalance(address);}

Getting wallet address

// first we need to authorizeconst authorize = async () => {  await web3.currentProvider.request({ method: 'eth_requestAccounts' });}// then we can get wallet addressconst getCurrentAddressUser = () => {    return web3.currentProvider.selectedAddress;}

Sending transaction

Sending value tokens with memo as value:

const transfer = async ({   from,   to,   value,   memo,   privateKey,   gasLimit = }) => {    const nonce = await web3.eth.getTransactionCount(from);    const gasPrice = await web3.eth.getGasPrice();        const rawTx = {      from,      to,      value: web3.utils.toHex(Web3.utils.toWei(value, 'ether')),      gasLimit: web3.utils.toHex(gasLimit),      gasPrice: web3.utils.toHex(gasPrice),      nonce: web3.utils.toHex(nonce),      data: memo,    };        const privateKeyBuffer = EthUtil.toBuffer(privateKey);        const tx = new Transaction(rawTx);        tx.sign(privateKeyBuffer);    const serializedTx = tx.serialize();        return this.web3.eth.sendSignedTransaction(      `0x${serializedTx.toString('hex')}`    );}

Estimating transaction FEE

Useful to get fixed amount of tokens from user with pre-estimated fee.

import { web3 } from '.';const estimateFee = async ({    from,    to,    value,    memo,}) => {    const gasPrice = await web3.eth.getGasPrice();    const gasLimit = await web3.eth.estimateGas({      from,      to,      value: web3.utils.toHex(web3.utils.toWei(value, 'ether')),      data: web3.utils.asciiToHex(memo),    }).call();        return web3.utils.fromWei(      BigInt(gasPrice.toString())        .multiply(BigInt(gasLimit.toString()))        .toString()    );}

Subscribing to wallet address change

import { web3 } from '.';web3.currentProvider.on('accountsChanged', callback);

Watching network change

ethereum.on('chainChanged', handler: 

Adding custom token to wallet

window.ethereum  .request({    method: 'wallet_watchAsset',    params: {      type: 'ERC20',      options: {        address: '0xb60e8dd61c5d32be8058bb8eb970870f07233155',        symbol: 'FOO',        decimals: 18,        image: 'https://foo.io/token-image.svg',      },    },  })  .then((success) => {    if (success) {      console.log('FOO successfully added to wallet!')    } else {      throw new Error('Something went wrong.')    }  })  .catch(console.error)

Changing network to custom

Checking current chainId:

const getChainID = async () => {    return ethereum.request({ method: 'eth_chainId' })}

Asking wallet to change current network:

try {  await window.ethereum.request({    method: 'wallet_switchEthereumChain',    params: [{ chainId: '0x03' }], // ropsten chainID (3) in hex  });} catch (switchError) {  // This error code indicates that the chain has not been added to MetaMask.  if (error.code === 4902) {    try {      await window.ethereum.request({        method: 'wallet_addEthereumChain',        params: [{           chainId: '0x03', // ropsten chainID (3) in hex          chainName: 'Ropsten Test Network',           nativeCurrency: {               name: 'ETH',              symbol: 'ETH',              decimals: 18          },           rpcUrls: ['https://ropsten.infura.io/v3/9aa3d95b3bc440fa88ea12eaa4456161'],           blockExplorerUrls: ['https://ropsten.etherscan.io']         }] ,      });    } catch (addError) {      // handle "add" error    }  }  // handle other "switch" errors}
btw, have a nice day
(2018 - 2024) muerwre
+

Common Typescript Examples

Connecting to node

If #Metamask extension installed, Web3.givenProvider is available in global window. You can use Infura or your node instead:

import Web3 from 'web3';// URL of your nodeconst PROVIDER_URL = 'https://...';export const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);

Getting wallet balance

const getBalance = async (address: string) => {    return await web3.eth.getBalance(address);}

Getting wallet address

// first we need to authorizeconst authorize = async () => {  await web3.currentProvider.request({ method: 'eth_requestAccounts' });}// then we can get wallet addressconst getCurrentAddressUser = () => {    return web3.currentProvider.selectedAddress;}

Sending transaction

Sending value tokens with memo as value:

const transfer = async ({   from,   to,   value,   memo,   privateKey,   gasLimit = }) => {    const nonce = await web3.eth.getTransactionCount(from);    const gasPrice = await web3.eth.getGasPrice();        const rawTx = {      from,      to,      value: web3.utils.toHex(Web3.utils.toWei(value, 'ether')),      gasLimit: web3.utils.toHex(gasLimit),      gasPrice: web3.utils.toHex(gasPrice),      nonce: web3.utils.toHex(nonce),      data: memo,    };        const privateKeyBuffer = EthUtil.toBuffer(privateKey);        const tx = new Transaction(rawTx);        tx.sign(privateKeyBuffer);    const serializedTx = tx.serialize();        return this.web3.eth.sendSignedTransaction(      `0x${serializedTx.toString('hex')}`    );}

Estimating transaction FEE

Useful to get fixed amount of tokens from user with pre-estimated fee.

import { web3 } from '.';const estimateFee = async ({    from,    to,    value,    memo,}) => {    const gasPrice = await web3.eth.getGasPrice();    const gasLimit = await web3.eth.estimateGas({      from,      to,      value: web3.utils.toHex(web3.utils.toWei(value, 'ether')),      data: web3.utils.asciiToHex(memo),    }).call();        return web3.utils.fromWei(      BigInt(gasPrice.toString())        .multiply(BigInt(gasLimit.toString()))        .toString()    );}

Subscribing to wallet address change

import { web3 } from '.';web3.currentProvider.on('accountsChanged', callback);

Watching network change

ethereum.on('chainChanged', handler: 

Adding custom token to wallet

window.ethereum  .request({    method: 'wallet_watchAsset',    params: {      type: 'ERC20',      options: {        address: '0xb60e8dd61c5d32be8058bb8eb970870f07233155',        symbol: 'FOO',        decimals: 18,        image: 'https://foo.io/token-image.svg',      },    },  })  .then((success) => {    if (success) {      console.log('FOO successfully added to wallet!')    } else {      throw new Error('Something went wrong.')    }  })  .catch(console.error)

Changing network to custom

Checking current chainId:

const getChainID = async () => {    return ethereum.request({ method: 'eth_chainId' })}

Asking wallet to change current network:

try {  await window.ethereum.request({    method: 'wallet_switchEthereumChain',    params: [{ chainId: '0x03' }], // ropsten chainID (3) in hex  });} catch (switchError) {  // This error code indicates that the chain has not been added to MetaMask.  if (error.code === 4902) {    try {      await window.ethereum.request({        method: 'wallet_addEthereumChain',        params: [{           chainId: '0x03', // ropsten chainID (3) in hex          chainName: 'Ropsten Test Network',           nativeCurrency: {               name: 'ETH',              symbol: 'ETH',              decimals: 18          },           rpcUrls: ['https://ropsten.infura.io/v3/9aa3d95b3bc440fa88ea12eaa4456161'],           blockExplorerUrls: ['https://ropsten.etherscan.io']         }] ,      });    } catch (addError) {      // handle "add" error    }  }  // handle other "switch" errors}
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/blockchain/smart-contracts/_payload.js b/docs/blockchain/smart-contracts/_payload.js index d48c002..f7c6743 100644 --- a/docs/blockchain/smart-contracts/_payload.js +++ b/docs/blockchain/smart-contracts/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC,aD,aE,aF,aG,aH,aI,aJ,aK,aL,aM,aN,aO,aP,aQ,aR,aS,aT,aU,aV,aW,aX,aY,aZ,a_,a$,ba,bb,bc,bd,be,bf,bg,bh,bi,bj,bk,bl,bm,bn,bo,bp,bq,br,bs,bt,bu,bv,bw,bx,by,bz,bA,bB,bC,bD,bE,bF,bG,bH,bI,bJ,bK,bL,bM,bN,bO,bP,bQ,bR,bS,bT,bU,bV,bW,bX,bY,bZ,b_,b$,ca,cb,cc,cd,ce,cf,cg,ch,ci,cj,ck,cl,cm,cn,co,cp,cq,cr,cs,ct,cu,cv,cw,cx,cy,cz,cA,cB,cC,cD,cE,cF,cG,cH,cI,cJ,cK,cL,cM,cN,cO,cP,cQ,cR,cS,cT,cU,cV,cW,cX,cY,cZ,c_,c$,da,db){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:bI,_path:bJ}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-GyYuUyCYai":{_path:bJ,_dir:"blockchain",_draft:aF,_partial:aF,_locale:"en",_empty:aF,title:bI,description:"For common functions see Common typescript examples.",excerpt:{type:bK,children:[{type:a,tag:A,props:{},children:[{type:c,value:bL},{type:a,tag:_,props:{href:bM},children:[{type:c,value:bN}]},{type:c,value:i}]},{type:a,tag:$,props:{id:aG},children:[{type:c,value:aH}]},{type:a,tag:A,props:{},children:[{type:c,value:bO}]},{type:a,tag:m,props:{code:aI,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:c,value:aI}]}]}]},{type:a,tag:$,props:{id:aJ},children:[{type:c,value:aK}]},{type:a,tag:A,props:{},children:[{type:c,value:bP},{type:a,tag:G,props:{},children:[{type:c,value:bQ}]},{type:c,value:bR},{type:a,tag:G,props:{},children:[{type:c,value:bS}]},{type:c,value:bT},{type:a,tag:_,props:{href:bU,rel:[as]},children:[{type:c,value:bV}]},{type:c,value:bW}]},{type:a,tag:A,props:{},children:[{type:a,tag:G,props:{},children:[{type:c,value:bX}]},{type:c,value:bY},{type:a,tag:G,props:{},children:[{type:c,value:at}]},{type:c,value:bZ},{type:a,tag:G,props:{},children:[{type:c,value:b_}]},{type:c,value:b$},{type:a,tag:G,props:{},children:[{type:c,value:at}]},{type:c,value:ca}]},{type:a,tag:D,props:{id:aL},children:[{type:c,value:aM}]},{type:a,tag:m,props:{code:aN,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:c,value:aN}]}]}]},{type:a,tag:D,props:{id:aO},children:[{type:c,value:aP}]},{type:a,tag:m,props:{code:aQ,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:c,value:aQ}]}]}]},{type:a,tag:D,props:{id:aR},children:[{type:c,value:aS}]},{type:a,tag:A,props:{},children:[{type:c,value:cb}]},{type:a,tag:m,props:{code:aT,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:c,value:aT}]}]}]},{type:a,tag:m,props:{code:aU,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:c,value:aU}]}]}]},{type:a,tag:$,props:{id:aV},children:[{type:c,value:aW}]},{type:a,tag:A,props:{},children:[{type:c,value:cc}]},{type:a,tag:m,props:{code:aX,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:c,value:aX}]}]}]},{type:a,tag:D,props:{id:aY},children:[{type:c,value:aZ}]},{type:a,tag:m,props:{code:a_,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:c,value:a_}]}]}]},{type:a,tag:D,props:{id:a$},children:[{type:c,value:ba}]},{type:a,tag:A,props:{},children:[{type:c,value:cd},{type:a,tag:au,props:{},children:[{type:c,value:af}]},{type:c,value:ce}]},{type:a,tag:m,props:{code:bb,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:c,value:bb}]}]}]},{type:a,tag:D,props:{id:bc},children:[{type:c,value:bd}]},{type:a,tag:A,props:{},children:[{type:c,value:cf}]},{type:a,tag:m,props:{code:be,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:c,value:be}]}]}]},{type:a,tag:D,props:{id:bf},children:[{type:c,value:bg}]},{type:a,tag:A,props:{},children:[{type:c,value:cg},{type:a,tag:au,props:{},children:[{type:c,value:af}]},{type:c,value:ch},{type:a,tag:_,props:{href:ci,rel:[as]},children:[{type:c,value:cj}]}]},{type:a,tag:m,props:{code:bh,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:c,value:bh}]}]}]}]},body:{type:bK,children:[{type:a,tag:A,props:{},children:[{type:c,value:bL},{type:a,tag:_,props:{href:bM},children:[{type:c,value:bN}]},{type:c,value:i}]},{type:a,tag:$,props:{id:aG},children:[{type:c,value:aH}]},{type:a,tag:A,props:{},children:[{type:c,value:bO}]},{type:a,tag:m,props:{code:aI,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bi}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ai}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'web3-eth-contract'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ai}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:bj}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:I},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:aj},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:L},children:[{type:c,value:"abi"}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:U},children:[{type:c,value:"object"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:L},children:[{type:c,value:bk}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"?:"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:U},children:[{type:c,value:ck}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ak}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:I},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:I},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:cl},children:[{type:c,value:cm}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:"ct-2e4590"},children:[{type:c,value:"JSON"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:cl},children:[{type:c,value:"parse"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:al}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:am}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:bi}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cm}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bk}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bl}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:bm}]},{type:a,tag:b,props:{class:av},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:cn}]},{type:a,tag:b,props:{class:av},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]}]}]}]},{type:a,tag:$,props:{id:aJ},children:[{type:c,value:aK}]},{type:a,tag:A,props:{},children:[{type:c,value:bP},{type:a,tag:G,props:{},children:[{type:c,value:bQ}]},{type:c,value:bR},{type:a,tag:G,props:{},children:[{type:c,value:bS}]},{type:c,value:bT},{type:a,tag:_,props:{href:bU,rel:[as]},children:[{type:c,value:bV}]},{type:c,value:bW}]},{type:a,tag:A,props:{},children:[{type:a,tag:G,props:{},children:[{type:c,value:bX}]},{type:c,value:bY},{type:a,tag:G,props:{},children:[{type:c,value:at}]},{type:c,value:bZ},{type:a,tag:G,props:{},children:[{type:c,value:b_}]},{type:c,value:b$},{type:a,tag:G,props:{},children:[{type:c,value:at}]},{type:c,value:ca}]},{type:a,tag:D,props:{id:aL},children:[{type:c,value:aM}]},{type:a,tag:m,props:{code:aN,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:u},children:[{type:c,value:co}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ai}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:bj}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F ABI of contract"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:cp}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:cq}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F address for contract"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:cr}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:bm}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:cs}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:bn}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" ({}) "}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:ct}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F Calling write method"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ax}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F authorizing with Metamask"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cu}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:cv}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"({ method: "}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'eth_requestAccounts'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" });"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F getting wallet address"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:cw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cu}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"selectedAddress"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F calling \"store\" store method for contract"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F payload should include `from` address, that matches"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F current user's wallet"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bo}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:cx}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:ay},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'Parameter'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:")."}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"send"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"({"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" from: "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:X}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cy}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bp}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:an}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ao}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:br},children:[{type:c,value:cz}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bs}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F calling read method"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ax}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F this method can return data"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:bt}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bo}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"retrieve"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bu}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:bv}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aA}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bp}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:an}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ao}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:br},children:[{type:c,value:cz}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bs}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"}"}]}]}]}]}]},{type:a,tag:D,props:{id:aO},children:[{type:c,value:aP}]},{type:a,tag:m,props:{code:aQ,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:u},children:[{type:c,value:co}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ai}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:bj}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F ABI контракта"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:cp}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:cq}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F contract address"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:cr}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:u},children:[{type:c,value:ct}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F account's private key"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:bw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'...'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F write-methods requires private key"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:I},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:aj},children:[{type:c,value:cs}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:I},children:[{type:c,value:bn}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:L},children:[{type:c,value:cA}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:U},children:[{type:c,value:"number"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:I},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:bx}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bo}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:cx}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:cB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:am}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"privateKeyToAccount"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" to: "}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:X}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" data: "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bx}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"encodeABI"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:cD}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" gas: "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bx}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"estimateGas"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"({ from: "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bk}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" }),"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" gasPrice: "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:am}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"getGasPrice"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:cD}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:cE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:am}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"signTransaction"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:X}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:X}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" );"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:am}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"sendSignedTransaction"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"rawTransaction"}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:cF}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bl}]}]}]}]}]},{type:a,tag:D,props:{id:aR},children:[{type:c,value:aS}]},{type:a,tag:A,props:{},children:[{type:c,value:cb}]},{type:a,tag:m,props:{code:aT,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:"requests"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" ["}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cG}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cH}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"balanceOf"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bu}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bv}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:X}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cG}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cH}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"getStaked"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bu}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bv}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" ]"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:bt}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:by}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cv}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]}]}]}]},{type:a,tag:m,props:{code:aU,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"givenProvider"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"||"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:"PROVIDER_URL"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:I},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:aj},children:[{type:c,value:by}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:L},children:[{type:c,value:cI}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:U},children:[{type:c,value:"any"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"[]) "}]},{type:a,tag:b,props:{class:I},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ax}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"getWeb3NoAccount"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aA}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:bz}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"BatchRequest"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aA}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:cJ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cI}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"map"}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:al}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:U},children:[{type:c,value:cK}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"(("}]},{type:a,tag:b,props:{class:L},children:[{type:c,value:cL}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:L},children:[{type:c,value:cM}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:I},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bz}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"add"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ao}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cN}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:cM}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" } "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"else"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cN}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:cL}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bt}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" })"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" );"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" });"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cy}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bz}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"execute"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aA}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:al}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:br},children:[{type:c,value:cK}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"all"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cJ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bp}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:an}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:al}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:"ct-a950c2"},children:[{type:c,value:"null"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bs}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bl}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:bm}]},{type:a,tag:b,props:{class:av},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:cn}]},{type:a,tag:b,props:{class:av},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:by}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]}]}]}]},{type:a,tag:$,props:{id:aV},children:[{type:c,value:aW}]},{type:a,tag:A,props:{},children:[{type:c,value:cc}]},{type:a,tag:m,props:{code:aX,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ai}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'web3'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'YOUR_RPC_ENDPOINT_HERE'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:cO}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'YOUR ABI HERE'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'YOUR CONTRACT ADDRESS HERE'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:bB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:bi}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:cO}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]}]}]}]},{type:a,tag:D,props:{id:aY},children:[{type:c,value:aZ}]},{type:a,tag:m,props:{code:a_,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:"referralProgramContract"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cP}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"RegisterUser"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"()"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:aj},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:cQ},children:[{type:c,value:bC}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:cR}]},{type:a,tag:b,props:{class:L},children:[{type:c,value:cS}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:U},children:[{type:c,value:ck}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:I},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"`| UserRegistered | events | ${"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cS}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:cT}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" })"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:bD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:X}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:I},children:[{type:c,value:bn}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:L},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:L},children:[{type:c,value:cU}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:U},children:[{type:c,value:"boolean"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:L},children:[{type:c,value:cV}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:cW},children:[{type:c,value:"RegisterUserResponseInterface"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }) "}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ax}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cU}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ao}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:al}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:cX}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:cY}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cV}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cX}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cY}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" } "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:an}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ao}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"`| ONCE | ${"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:cT}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bE}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" )"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:aj},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:cQ},children:[{type:c,value:bF}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:cR}]},{type:a,tag:b,props:{class:L},children:[{type:c,value:cZ}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:cW},children:[{type:c,value:"ErrnoException"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:I},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cZ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:c_}]}]}]}]}]},{type:a,tag:D,props:{id:a$},children:[{type:c,value:ba}]},{type:a,tag:A,props:{},children:[{type:c,value:cd},{type:a,tag:au,props:{},children:[{type:c,value:af}]},{type:c,value:ce}]},{type:a,tag:m,props:{code:bb,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:c$}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" value: [],"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bE}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bG}]},{type:a,tag:b,props:{class:ay},children:[{type:c,value:az}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bH}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cP}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ak}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:bD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:da}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:db}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:bF}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:bC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"str"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Y}]}]}]}]}]},{type:a,tag:D,props:{id:bc},children:[{type:c,value:bd}]},{type:a,tag:A,props:{},children:[{type:c,value:cf}]},{type:a,tag:m,props:{code:be,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bG}]},{type:a,tag:b,props:{class:ay},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:X}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" address: ["}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'address-1'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'address-2'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"], "}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002FOnly get events from specific addresses"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" topics: [] "}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002FWhat topics to subscribe to"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bH}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'logs'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:cF}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ak}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ak}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:c_}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:bD}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:da}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:db}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:bF}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" })"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:bC}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"nr"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Y}]}]}]}]}]},{type:a,tag:D,props:{id:bf},children:[{type:c,value:bg}]},{type:a,tag:A,props:{},children:[{type:c,value:cg},{type:a,tag:au,props:{},children:[{type:c,value:af}]},{type:c,value:ch},{type:a,tag:_,props:{href:ci,rel:[as]},children:[{type:c,value:cj}]}]},{type:a,tag:m,props:{code:bh,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002Fexample options(optional)"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:c$}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F only get events where transfer value was 1000 or 1337"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" value: ["}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'1000'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'1337'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"] "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bE}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F number | \"earliest\" | \"pending\" | \"latest\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bG}]},{type:a,tag:b,props:{class:ay},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:", "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" toBlock: "}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'latest'"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bH}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"getPastEvents"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'Transfer'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ak}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"then"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"results"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:an}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-0479b3{color:#FFA657}.ct-5bc21b{color:#A5D6FF}.ct-a950c2{color:#79C0FF}.ct-3a9681{color:#79C0FF}.ct-d7c5e5{color:#79C0FF}.ct-61fe70{color:#79C0FF}.ct-50d99e{color:#FF7B72}.ct-7fbf47{color:#8B949E}.ct-680997{color:#FFA657}.ct-975d2d{color:#D2A8FF}.ct-2e4590{color:#79C0FF}.ct-7d4034{color:#79C0FF}.ct-353508{color:#79C0FF}.ct-60ccc9{color:#FFA657}.ct-163897{color:#FF7B72}.ct-b0e2e0{color:#D2A8FF}.ct-78ac5e{color:#C9D1D9}.ct-91fca1{color:#FF7B72}.ct-b4da57{color:#A5D6FF}.ct-c91467{color:#C9D1D9}.ct-949cf0{color:#C9D1D9}.ct-c5cafe{color:#FF7B72}.light .ct-c5cafe{color:#859900}.light .ct-949cf0{color:#657B83}.light .ct-c91467{color:#268BD2}.light .ct-b4da57{color:#2AA198}.light .ct-91fca1{color:#073642}.light .ct-78ac5e{color:#657B83}.light .ct-b0e2e0{color:#268BD2}.light .ct-163897{color:#859900}.light .ct-60ccc9{color:#657B83}.light .ct-353508{color:#859900}.light .ct-7d4034{color:#268BD2}.light .ct-2e4590{color:#657B83}.light .ct-975d2d{color:#268BD2}.light .ct-680997{color:#657B83}.light .ct-7fbf47{color:#93A1A1}.light .ct-50d99e{color:#073642}.light .ct-61fe70{color:#268BD2}.light .ct-d7c5e5{color:#D33682}.light .ct-3a9681{color:#859900}.light .ct-a950c2{color:#B58900}.light .ct-5bc21b{color:#2AA198}.light .ct-0479b3{color:#268BD2}"}]}],toc:{title:v,searchDepth:ar,depth:ar,links:[{id:aG,depth:ar,text:aH},{id:aJ,depth:ar,text:aK,children:[{id:aL,depth:Z,text:aM},{id:aO,depth:Z,text:aP},{id:aR,depth:Z,text:aS}]},{id:aV,depth:ar,text:aW,children:[{id:aY,depth:Z,text:aZ},{id:a$,depth:Z,text:ba},{id:bc,depth:Z,text:bd},{id:bf,depth:Z,text:bg}]}]}},_type:"markdown",_id:"content:Blockchain:Smart contracts.md",_source:"content",_file:"Blockchain\u002FSmart contracts.md",_extension:"md"}},prerenderedAt:1711020226606}}("element","span","text","ct-949cf0","line"," ","ct-c91467","ct-c5cafe",".","ct-78ac5e","ct-975d2d","(","code","ct-50d99e","ct-b4da57","=","ct-61fe70","const"," "," ","ct-7fbf47","","typescript","pre"," {",");","p",";","ct-163897","h3",", ","=\u003E","strong","web3","ct-91fca1","log"," (","ct-60ccc9","on",":"," { ","new","await","options"," ","console","ct-353508","CONTRACT_ADDRESS","contract",",","))",3,"a","h2","getContract","e"," ","event"," .","Transfer","import"," } ","from","ct-b0e2e0",")","return","eth","catch",") {","Web3","subscription",2,"nofollow","gas","code-inline","ct-680997","CONTRACT_ABI","try","ct-d7c5e5","0","();",") ","err"," .","let",false,"getting-smart-contract-instance","Getting smart contract instance","import { Contract } from 'web3-eth-contract';\nimport { web3 } from '.';\n\nconst getContract = (abi: object, address?: string): Contract =\u003E {\n const abiFromJson = JSON.parse(JSON.stringify(abi));\n return new web3.eth.Contract(abiFromJson, address);\n};\n\nexport default getContract;\n","executing-contract-method","Executing contract method","example-for-metamask-without-private-key","Example for #Metamask without private key","\u002F\u002F see example below\nimport { getContract } from '.';\n\n\u002F\u002F ABI of contract\nconst CONTRACT_ABI = { \u002F* ... *\u002F };\n \u002F\u002F address for contract\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n\nexport const executeContractMethod = async ({}) =\u003E {\n \u002F\u002F getting contract\n const contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n \n \u002F\u002F Calling write method\n try {\n \u002F\u002F authorizing with Metamask\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n \u002F\u002F getting wallet address\n const addressUser = web3.currentProvider.selectedAddress;\n \u002F\u002F calling \"store\" store method for contract\n \u002F\u002F payload should include `from` address, that matches\n \u002F\u002F current user's wallet\n await contract.methods.store(0, 'Parameter').send({\n from: addressUser,\n });\n } catch (e) {\n throw new Error(e);\n }\n \n \u002F\u002F calling read method\n try {\n \u002F\u002F this method can return data\n const result = await contract.methods.retrieve().call();\n } catch (e) {\n throw new Error(e);\n }\n}\n","nodejs-and-react-native-example","Node.js and React Native example","\u002F\u002F see example below\nimport { getContract } from '.';\n\n\u002F\u002F ABI контракта\nconst CONTRACT_ABI = { \u002F* ... *\u002F };\n\u002F\u002F contract address\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n\u002F\u002F getting contract\nconst contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n\u002F\u002F account's private key\nconst privateKey = '...';\n\n\u002F\u002F write-methods requires private key\nconst executeContractMethod = async (val: number) =\u003E {\n const transaction = contract.methods.store(val);\n const account = web3.eth.accounts.privateKeyToAccount(privateKey);\n const options = {\n to: CONTRACT_ADDRESS,\n data: transaction.encodeABI(),\n gas: await transaction.estimateGas({ from: account.address }),\n gasPrice: await web3.eth.getGasPrice(),\n };\n const signed = await web3.eth.accounts.signTransaction(\n options,\n privateKey,\n );\n await web3.eth.sendSignedTransaction(signed.rawTransaction!);\n};\n","calling-a-batch-of-contracts-methods","Calling a batch of contract's methods"," const requests = [\n contract.method.balanceOf().call,\n contract.method.getStaked().call\n ]\n\n const result = await makeBatchRequest(request);\n","const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n\nconst makeBatchRequest = (calls: any[]) =\u003E {\n try {\n const web3 = getWeb3NoAccount();\n const batch = new web3.BatchRequest();\n\n const promises = calls.map((call) =\u003E {\n return new Promise((resolve, reject) =\u003E {\n batch.add(\n call.request({}, (err, result) =\u003E {\n if (err) {\n reject(err);\n } else {\n resolve(result);\n }\n })\n );\n });\n });\n\n batch.execute();\n\n return Promise.all(promises);\n } catch {\n return null;\n }\n};\n\nexport default makeBatchRequest;\n","subscribing-to-smart-contract-events","Subscribing to smart contract events"," import Web3 from 'web3';\n const web3 = new Web3('YOUR_RPC_ENDPOINT_HERE');\n const ABI = 'YOUR ABI HERE';\n const CONTRACT_ADDRESS = 'YOUR CONTRACT ADDRESS HERE';\n const myContract = new Web3.Contract(ABI, CONTRACT_ADDRESS);\n","by-accessing-contractevents","By accessing contract.events","referralProgramContract.events\n .RegisterUser()\n .on('connected', (subscriptionId: string) =\u003E {\n console.log(`| UserRegistered | events | ${subscriptionId}`);\n })\n .on(\n 'data',\n async (event: {\n removed: boolean;\n returnValues: RegisterUserResponseInterface;\n }) =\u003E {\n try {\n if (event.removed) {\n return;\n }\n const { user, referrer } = event.returnValues;\n console.log(user, referrer);\n } catch (e) {\n console.log(`| ONCE | ${e}`);\n }\n },\n )\n .on('error', (error: ErrnoException) =\u003E {\n console.log(error);\n });\n","with-filtering","With filtering"," let options = {\n filter: {\n value: [],\n },\n fromBlock: 0\n };\n\n myContract.events.Transfer(options)\n .on('data', event =\u003E console.log(event))\n .on('changed', changed =\u003E console.log(changed))\n .on('error', err =\u003E throw err)\n .on('connected', str =\u003E console.log(str))\n","common-subscribe-method","Common Subscribe method"," let options = {\n fromBlock: 0,\n address: ['address-1', 'address-2'], \u002F\u002FOnly get events from specific addresses\n topics: [] \u002F\u002FWhat topics to subscribe to\n };\n\n let subscription = ('logs', options, (err,event) =\u003E {\n if (!err)\n console.log(event)\n });\n\n subscription.on('data', event =\u003E console.log(event))\n subscription.on('changed', changed =\u003E console.log(changed))\n subscription.on('error', err =\u003E { throw err })\n subscription.on('connected', nr =\u003E console.log(nr))\n","getting-event-history","Getting event history"," \u002F\u002Fexample options(optional)\n let options = {\n filter: {\n \u002F\u002F only get events where transfer value was 1000 or 1337\n value: ['1000', '1337'] \n },\n \u002F\u002F number | \"earliest\" | \"pending\" | \"latest\"\n fromBlock: 0, \n toBlock: 'latest'\n };\n\n myContract.getPastEvents('Transfer', options)\n .then(results =\u003E console.log(results))\n .catch(err =\u003E throw err);\n\n","Contract","'.'","address","};","export","async","methods"," } ","throw","ct-3a9681"," }","result","().","call","privateKey","transaction","makeBatchRequest","batch","if","myContract","'connected'","'data'"," },","'error'"," fromBlock: "," };","Smart Contracts","\u002Fblockchain\u002Fsmart-contracts","root","For common functions see ","Common%20typescript%20examples","Common typescript examples","Useful for calling smart contract methods:","Contract has ","read"," and ","write"," methods. To get a list of methods, you can paste contract address on ","https:\u002F\u002Fetherscan.io\u002Ftoken\u002F0xdac17f958d2ee523a2206206994597c13d831ec7#readContract","https:\u002F\u002Fetherscan.io\u002F ETH"," or any other service.","Read"," methods doesn't require spending ",". ","Write"," methods cost some amount of ",", hence they will be executed with confirmation from user.","Function calls batch of requests, returning array of results. For example:","There're different ways to subscribe for contract events. For all of them you will need following variables:","We're listening to "," event here:","Filtering options can also be specified:","Getting history for "," events for specific values. More info can be found ","https:\u002F\u002Fweb3js.readthedocs.io\u002Fen\u002Fv1.2.11\u002Fweb3-eth-subscribe.html#","here","string","ct-7d4034","abiFromJson","default","\u002F\u002F see example below","\u002F* ... *\u002F"," };","'0xdea164f67df4dbfe675d5271c9d404e0260f33bb'","executeContractMethod","\u002F\u002F getting contract","currentProvider","request","addressUser","store"," });","Error","val","account","accounts","(),","signed","!"," ","method","calls","promises","Promise","resolve","reject"," ","ABI","events","ct-5bc21b",", (","subscriptionId","}`","removed","returnValues","ct-0479b3","user","referrer","error"," });"," filter: {","'changed'","changed")) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC,aD,aE,aF,aG,aH,aI,aJ,aK,aL,aM,aN,aO,aP,aQ,aR,aS,aT,aU,aV,aW,aX,aY,aZ,a_,a$,ba,bb,bc,bd,be,bf,bg,bh,bi,bj,bk,bl,bm,bn,bo,bp,bq,br,bs,bt,bu,bv,bw,bx,by,bz,bA,bB,bC,bD,bE,bF,bG,bH,bI,bJ,bK,bL,bM,bN,bO,bP,bQ,bR,bS,bT,bU,bV,bW,bX,bY,bZ,b_,b$,ca,cb,cc,cd,ce,cf,cg,ch,ci,cj,ck,cl,cm,cn,co,cp,cq,cr,cs,ct,cu,cv,cw,cx,cy,cz,cA,cB,cC,cD,cE,cF,cG,cH,cI,cJ,cK,cL,cM,cN,cO,cP,cQ,cR,cS,cT,cU,cV,cW,cX,cY,cZ,c_,c$,da,db){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:bI,_path:bJ}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-GyYuUyCYai":{_path:bJ,_dir:"blockchain",_draft:aF,_partial:aF,_locale:"en",_empty:aF,title:bI,description:"For common functions see Common typescript examples.",excerpt:{type:bK,children:[{type:a,tag:A,props:{},children:[{type:c,value:bL},{type:a,tag:_,props:{href:bM},children:[{type:c,value:bN}]},{type:c,value:i}]},{type:a,tag:$,props:{id:aG},children:[{type:c,value:aH}]},{type:a,tag:A,props:{},children:[{type:c,value:bO}]},{type:a,tag:m,props:{code:aI,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:c,value:aI}]}]}]},{type:a,tag:$,props:{id:aJ},children:[{type:c,value:aK}]},{type:a,tag:A,props:{},children:[{type:c,value:bP},{type:a,tag:G,props:{},children:[{type:c,value:bQ}]},{type:c,value:bR},{type:a,tag:G,props:{},children:[{type:c,value:bS}]},{type:c,value:bT},{type:a,tag:_,props:{href:bU,rel:[as]},children:[{type:c,value:bV}]},{type:c,value:bW}]},{type:a,tag:A,props:{},children:[{type:a,tag:G,props:{},children:[{type:c,value:bX}]},{type:c,value:bY},{type:a,tag:G,props:{},children:[{type:c,value:at}]},{type:c,value:bZ},{type:a,tag:G,props:{},children:[{type:c,value:b_}]},{type:c,value:b$},{type:a,tag:G,props:{},children:[{type:c,value:at}]},{type:c,value:ca}]},{type:a,tag:D,props:{id:aL},children:[{type:c,value:aM}]},{type:a,tag:m,props:{code:aN,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:c,value:aN}]}]}]},{type:a,tag:D,props:{id:aO},children:[{type:c,value:aP}]},{type:a,tag:m,props:{code:aQ,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:c,value:aQ}]}]}]},{type:a,tag:D,props:{id:aR},children:[{type:c,value:aS}]},{type:a,tag:A,props:{},children:[{type:c,value:cb}]},{type:a,tag:m,props:{code:aT,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:c,value:aT}]}]}]},{type:a,tag:m,props:{code:aU,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:c,value:aU}]}]}]},{type:a,tag:$,props:{id:aV},children:[{type:c,value:aW}]},{type:a,tag:A,props:{},children:[{type:c,value:cc}]},{type:a,tag:m,props:{code:aX,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:c,value:aX}]}]}]},{type:a,tag:D,props:{id:aY},children:[{type:c,value:aZ}]},{type:a,tag:m,props:{code:a_,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:c,value:a_}]}]}]},{type:a,tag:D,props:{id:a$},children:[{type:c,value:ba}]},{type:a,tag:A,props:{},children:[{type:c,value:cd},{type:a,tag:au,props:{},children:[{type:c,value:af}]},{type:c,value:ce}]},{type:a,tag:m,props:{code:bb,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:c,value:bb}]}]}]},{type:a,tag:D,props:{id:bc},children:[{type:c,value:bd}]},{type:a,tag:A,props:{},children:[{type:c,value:cf}]},{type:a,tag:m,props:{code:be,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:c,value:be}]}]}]},{type:a,tag:D,props:{id:bf},children:[{type:c,value:bg}]},{type:a,tag:A,props:{},children:[{type:c,value:cg},{type:a,tag:au,props:{},children:[{type:c,value:af}]},{type:c,value:ch},{type:a,tag:_,props:{href:ci,rel:[as]},children:[{type:c,value:cj}]}]},{type:a,tag:m,props:{code:bh,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:c,value:bh}]}]}]}]},body:{type:bK,children:[{type:a,tag:A,props:{},children:[{type:c,value:bL},{type:a,tag:_,props:{href:bM},children:[{type:c,value:bN}]},{type:c,value:i}]},{type:a,tag:$,props:{id:aG},children:[{type:c,value:aH}]},{type:a,tag:A,props:{},children:[{type:c,value:bO}]},{type:a,tag:m,props:{code:aI,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bi}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ai}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'web3-eth-contract'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ai}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:bj}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:I},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:aj},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:L},children:[{type:c,value:"abi"}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:U},children:[{type:c,value:"object"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:L},children:[{type:c,value:bk}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"?:"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:U},children:[{type:c,value:ck}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ak}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:I},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:I},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:cl},children:[{type:c,value:cm}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:"ct-c58381"},children:[{type:c,value:"JSON"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:cl},children:[{type:c,value:"parse"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:al}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:am}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:bi}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cm}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bk}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bl}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:bm}]},{type:a,tag:b,props:{class:av},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:cn}]},{type:a,tag:b,props:{class:av},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]}]}]}]},{type:a,tag:$,props:{id:aJ},children:[{type:c,value:aK}]},{type:a,tag:A,props:{},children:[{type:c,value:bP},{type:a,tag:G,props:{},children:[{type:c,value:bQ}]},{type:c,value:bR},{type:a,tag:G,props:{},children:[{type:c,value:bS}]},{type:c,value:bT},{type:a,tag:_,props:{href:bU,rel:[as]},children:[{type:c,value:bV}]},{type:c,value:bW}]},{type:a,tag:A,props:{},children:[{type:a,tag:G,props:{},children:[{type:c,value:bX}]},{type:c,value:bY},{type:a,tag:G,props:{},children:[{type:c,value:at}]},{type:c,value:bZ},{type:a,tag:G,props:{},children:[{type:c,value:b_}]},{type:c,value:b$},{type:a,tag:G,props:{},children:[{type:c,value:at}]},{type:c,value:ca}]},{type:a,tag:D,props:{id:aL},children:[{type:c,value:aM}]},{type:a,tag:m,props:{code:aN,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:u},children:[{type:c,value:co}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ai}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:bj}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F ABI of contract"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:cp}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:cq}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F address for contract"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:cr}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:bm}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:cs}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:bn}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" ({}) "}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:ct}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F Calling write method"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ax}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F authorizing with Metamask"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cu}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:cv}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"({ method: "}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'eth_requestAccounts'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" });"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F getting wallet address"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:cw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cu}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"selectedAddress"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F calling \"store\" store method for contract"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F payload should include `from` address, that matches"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F current user's wallet"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bo}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:cx}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:ay},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'Parameter'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:")."}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"send"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"({"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" from: "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:X}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cy}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bp}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:an}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ao}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:br},children:[{type:c,value:cz}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bs}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F calling read method"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ax}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F this method can return data"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:bt}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bo}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"retrieve"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bu}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:bv}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aA}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bp}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:an}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ao}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:br},children:[{type:c,value:cz}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bs}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"}"}]}]}]}]}]},{type:a,tag:D,props:{id:aO},children:[{type:c,value:aP}]},{type:a,tag:m,props:{code:aQ,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:u},children:[{type:c,value:co}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ai}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:bj}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F ABI контракта"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:cp}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:cq}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F contract address"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:cr}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:u},children:[{type:c,value:ct}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F account's private key"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:bw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'...'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F write-methods requires private key"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:I},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:aj},children:[{type:c,value:cs}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:I},children:[{type:c,value:bn}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:L},children:[{type:c,value:cA}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:U},children:[{type:c,value:"number"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:I},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:bx}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bo}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:cx}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:cB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:am}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"privateKeyToAccount"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" to: "}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:X}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" data: "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bx}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"encodeABI"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:cD}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" gas: "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bx}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"estimateGas"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"({ from: "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bk}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" }),"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" gasPrice: "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:am}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"getGasPrice"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:cD}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:cE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:am}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"signTransaction"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:X}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:X}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" );"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:am}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"sendSignedTransaction"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"rawTransaction"}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:cF}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bl}]}]}]}]}]},{type:a,tag:D,props:{id:aR},children:[{type:c,value:aS}]},{type:a,tag:A,props:{},children:[{type:c,value:cb}]},{type:a,tag:m,props:{code:aT,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:"requests"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" ["}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cG}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cH}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"balanceOf"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bu}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bv}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:X}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cG}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cH}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"getStaked"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bu}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bv}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" ]"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:bt}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:by}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cv}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]}]}]}]},{type:a,tag:m,props:{code:aU,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"givenProvider"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"||"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:"PROVIDER_URL"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:I},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:aj},children:[{type:c,value:by}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:L},children:[{type:c,value:cI}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:U},children:[{type:c,value:"any"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"[]) "}]},{type:a,tag:b,props:{class:I},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ax}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"getWeb3NoAccount"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aA}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:bz}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"BatchRequest"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aA}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:cJ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cI}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"map"}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:al}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:U},children:[{type:c,value:cK}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"(("}]},{type:a,tag:b,props:{class:L},children:[{type:c,value:cL}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:L},children:[{type:c,value:cM}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:I},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bz}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"add"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ao}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cN}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:cM}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" } "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"else"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cN}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:cL}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bt}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" })"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" );"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" });"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cy}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bz}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"execute"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aA}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:al}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:br},children:[{type:c,value:cK}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"all"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cJ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bp}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:an}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:al}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:"ct-391539"},children:[{type:c,value:"null"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bs}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bl}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:bm}]},{type:a,tag:b,props:{class:av},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:cn}]},{type:a,tag:b,props:{class:av},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:by}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]}]}]}]},{type:a,tag:$,props:{id:aV},children:[{type:c,value:aW}]},{type:a,tag:A,props:{},children:[{type:c,value:cc}]},{type:a,tag:m,props:{code:aX,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ai}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'web3'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'YOUR_RPC_ENDPOINT_HERE'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:cO}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'YOUR ABI HERE'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'YOUR CONTRACT ADDRESS HERE'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:bB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:bi}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:cO}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]}]}]}]},{type:a,tag:D,props:{id:aY},children:[{type:c,value:aZ}]},{type:a,tag:m,props:{code:a_,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:"referralProgramContract"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cP}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"RegisterUser"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"()"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:aj},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:cQ},children:[{type:c,value:bC}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:cR}]},{type:a,tag:b,props:{class:L},children:[{type:c,value:cS}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:U},children:[{type:c,value:ck}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:I},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"`| UserRegistered | events | ${"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cS}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:cT}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" })"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:bD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:X}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:I},children:[{type:c,value:bn}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:L},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:L},children:[{type:c,value:cU}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:U},children:[{type:c,value:"boolean"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:L},children:[{type:c,value:cV}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:cW},children:[{type:c,value:"RegisterUserResponseInterface"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }) "}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ax}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cU}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ao}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:al}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:cX}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:cY}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cV}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cX}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cY}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" } "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:an}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ao}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"`| ONCE | ${"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:cT}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bE}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" )"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:aj},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:cQ},children:[{type:c,value:bF}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:cR}]},{type:a,tag:b,props:{class:L},children:[{type:c,value:cZ}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:cW},children:[{type:c,value:"ErrnoException"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:I},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cZ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:c_}]}]}]}]}]},{type:a,tag:D,props:{id:a$},children:[{type:c,value:ba}]},{type:a,tag:A,props:{},children:[{type:c,value:cd},{type:a,tag:au,props:{},children:[{type:c,value:af}]},{type:c,value:ce}]},{type:a,tag:m,props:{code:bb,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:c$}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" value: [],"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bE}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bG}]},{type:a,tag:b,props:{class:ay},children:[{type:c,value:az}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bH}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:cP}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ak}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:bD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:da}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:db}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:bF}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:bC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"str"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Y}]}]}]}]}]},{type:a,tag:D,props:{id:bc},children:[{type:c,value:bd}]},{type:a,tag:A,props:{},children:[{type:c,value:cf}]},{type:a,tag:m,props:{code:be,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bG}]},{type:a,tag:b,props:{class:ay},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:X}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" address: ["}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'address-1'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'address-2'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"], "}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002FOnly get events from specific addresses"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" topics: [] "}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002FWhat topics to subscribe to"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bH}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'logs'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:cF}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ak}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ak}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:c_}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:bD}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:da}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:db}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:bF}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" })"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:bC}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"nr"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Y}]}]}]}]}]},{type:a,tag:D,props:{id:bf},children:[{type:c,value:bg}]},{type:a,tag:A,props:{},children:[{type:c,value:cg},{type:a,tag:au,props:{},children:[{type:c,value:af}]},{type:c,value:ch},{type:a,tag:_,props:{href:ci,rel:[as]},children:[{type:c,value:cj}]}]},{type:a,tag:m,props:{code:bh,language:w},children:[{type:a,tag:x,props:{},children:[{type:a,tag:m,props:{__ignoreMap:v},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002Fexample options(optional)"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:c$}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F only get events where transfer value was 1000 or 1337"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" value: ["}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'1000'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'1337'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"] "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bE}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"\u002F\u002F number | \"earliest\" | \"pending\" | \"latest\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bG}]},{type:a,tag:b,props:{class:ay},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:", "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" toBlock: "}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'latest'"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bH}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"getPastEvents"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"'Transfer'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ak}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"then"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"results"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:an}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-41d808{color:#FFA657}.ct-5da781{color:#A5D6FF}.ct-391539{color:#79C0FF}.ct-c2ef3a{color:#79C0FF}.ct-2bb2d2{color:#79C0FF}.ct-9207a0{color:#79C0FF}.ct-890deb{color:#FF7B72}.ct-295134{color:#8B949E}.ct-2e08a5{color:#FFA657}.ct-61346a{color:#D2A8FF}.ct-c58381{color:#79C0FF}.ct-d007af{color:#79C0FF}.ct-82c1f9{color:#79C0FF}.ct-bed189{color:#FFA657}.ct-f3c518{color:#FF7B72}.ct-bbedd3{color:#D2A8FF}.ct-177e39{color:#C9D1D9}.ct-2690b3{color:#FF7B72}.ct-9c9782{color:#A5D6FF}.ct-56249b{color:#C9D1D9}.ct-fc252f{color:#C9D1D9}.ct-1ef187{color:#FF7B72}.light .ct-1ef187{color:#859900}.light .ct-fc252f{color:#657B83}.light .ct-56249b{color:#268BD2}.light .ct-9c9782{color:#2AA198}.light .ct-2690b3{color:#073642}.light .ct-177e39{color:#657B83}.light .ct-bbedd3{color:#268BD2}.light .ct-f3c518{color:#859900}.light .ct-bed189{color:#657B83}.light .ct-82c1f9{color:#859900}.light .ct-d007af{color:#268BD2}.light .ct-c58381{color:#657B83}.light .ct-61346a{color:#268BD2}.light .ct-2e08a5{color:#657B83}.light .ct-295134{color:#93A1A1}.light .ct-890deb{color:#073642}.light .ct-9207a0{color:#268BD2}.light .ct-2bb2d2{color:#D33682}.light .ct-c2ef3a{color:#859900}.light .ct-391539{color:#B58900}.light .ct-5da781{color:#2AA198}.light .ct-41d808{color:#268BD2}"}]}],toc:{title:v,searchDepth:ar,depth:ar,links:[{id:aG,depth:ar,text:aH},{id:aJ,depth:ar,text:aK,children:[{id:aL,depth:Z,text:aM},{id:aO,depth:Z,text:aP},{id:aR,depth:Z,text:aS}]},{id:aV,depth:ar,text:aW,children:[{id:aY,depth:Z,text:aZ},{id:a$,depth:Z,text:ba},{id:bc,depth:Z,text:bd},{id:bf,depth:Z,text:bg}]}]}},_type:"markdown",_id:"content:Blockchain:Smart contracts.md",_source:"content",_file:"Blockchain\u002FSmart contracts.md",_extension:"md"}},prerenderedAt:1711020860256}}("element","span","text","ct-fc252f","line"," ","ct-56249b","ct-1ef187",".","ct-177e39","ct-61346a","(","code","ct-890deb","ct-9c9782","=","ct-9207a0","const"," "," ","ct-295134","","typescript","pre"," {",");","p",";","ct-f3c518","h3",", ","=\u003E","strong","web3","ct-2690b3","log"," (","ct-bed189","on",":"," { ","new","await","options"," ","console","ct-82c1f9","CONTRACT_ADDRESS","contract",",","))",3,"a","h2","getContract","e"," ","event"," .","Transfer","import"," } ","from","ct-bbedd3",")","return","eth","catch",") {","Web3","subscription",2,"nofollow","gas","code-inline","ct-2e08a5","CONTRACT_ABI","try","ct-2bb2d2","0","();",") ","err"," .","let",false,"getting-smart-contract-instance","Getting smart contract instance","import { Contract } from 'web3-eth-contract';\nimport { web3 } from '.';\n\nconst getContract = (abi: object, address?: string): Contract =\u003E {\n const abiFromJson = JSON.parse(JSON.stringify(abi));\n return new web3.eth.Contract(abiFromJson, address);\n};\n\nexport default getContract;\n","executing-contract-method","Executing contract method","example-for-metamask-without-private-key","Example for #Metamask without private key","\u002F\u002F see example below\nimport { getContract } from '.';\n\n\u002F\u002F ABI of contract\nconst CONTRACT_ABI = { \u002F* ... *\u002F };\n \u002F\u002F address for contract\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n\nexport const executeContractMethod = async ({}) =\u003E {\n \u002F\u002F getting contract\n const contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n \n \u002F\u002F Calling write method\n try {\n \u002F\u002F authorizing with Metamask\n await web3.currentProvider.request({ method: 'eth_requestAccounts' });\n \u002F\u002F getting wallet address\n const addressUser = web3.currentProvider.selectedAddress;\n \u002F\u002F calling \"store\" store method for contract\n \u002F\u002F payload should include `from` address, that matches\n \u002F\u002F current user's wallet\n await contract.methods.store(0, 'Parameter').send({\n from: addressUser,\n });\n } catch (e) {\n throw new Error(e);\n }\n \n \u002F\u002F calling read method\n try {\n \u002F\u002F this method can return data\n const result = await contract.methods.retrieve().call();\n } catch (e) {\n throw new Error(e);\n }\n}\n","nodejs-and-react-native-example","Node.js and React Native example","\u002F\u002F see example below\nimport { getContract } from '.';\n\n\u002F\u002F ABI контракта\nconst CONTRACT_ABI = { \u002F* ... *\u002F };\n\u002F\u002F contract address\nconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';\n\u002F\u002F getting contract\nconst contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);\n\u002F\u002F account's private key\nconst privateKey = '...';\n\n\u002F\u002F write-methods requires private key\nconst executeContractMethod = async (val: number) =\u003E {\n const transaction = contract.methods.store(val);\n const account = web3.eth.accounts.privateKeyToAccount(privateKey);\n const options = {\n to: CONTRACT_ADDRESS,\n data: transaction.encodeABI(),\n gas: await transaction.estimateGas({ from: account.address }),\n gasPrice: await web3.eth.getGasPrice(),\n };\n const signed = await web3.eth.accounts.signTransaction(\n options,\n privateKey,\n );\n await web3.eth.sendSignedTransaction(signed.rawTransaction!);\n};\n","calling-a-batch-of-contracts-methods","Calling a batch of contract's methods"," const requests = [\n contract.method.balanceOf().call,\n contract.method.getStaked().call\n ]\n\n const result = await makeBatchRequest(request);\n","const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);\n\nconst makeBatchRequest = (calls: any[]) =\u003E {\n try {\n const web3 = getWeb3NoAccount();\n const batch = new web3.BatchRequest();\n\n const promises = calls.map((call) =\u003E {\n return new Promise((resolve, reject) =\u003E {\n batch.add(\n call.request({}, (err, result) =\u003E {\n if (err) {\n reject(err);\n } else {\n resolve(result);\n }\n })\n );\n });\n });\n\n batch.execute();\n\n return Promise.all(promises);\n } catch {\n return null;\n }\n};\n\nexport default makeBatchRequest;\n","subscribing-to-smart-contract-events","Subscribing to smart contract events"," import Web3 from 'web3';\n const web3 = new Web3('YOUR_RPC_ENDPOINT_HERE');\n const ABI = 'YOUR ABI HERE';\n const CONTRACT_ADDRESS = 'YOUR CONTRACT ADDRESS HERE';\n const myContract = new Web3.Contract(ABI, CONTRACT_ADDRESS);\n","by-accessing-contractevents","By accessing contract.events","referralProgramContract.events\n .RegisterUser()\n .on('connected', (subscriptionId: string) =\u003E {\n console.log(`| UserRegistered | events | ${subscriptionId}`);\n })\n .on(\n 'data',\n async (event: {\n removed: boolean;\n returnValues: RegisterUserResponseInterface;\n }) =\u003E {\n try {\n if (event.removed) {\n return;\n }\n const { user, referrer } = event.returnValues;\n console.log(user, referrer);\n } catch (e) {\n console.log(`| ONCE | ${e}`);\n }\n },\n )\n .on('error', (error: ErrnoException) =\u003E {\n console.log(error);\n });\n","with-filtering","With filtering"," let options = {\n filter: {\n value: [],\n },\n fromBlock: 0\n };\n\n myContract.events.Transfer(options)\n .on('data', event =\u003E console.log(event))\n .on('changed', changed =\u003E console.log(changed))\n .on('error', err =\u003E throw err)\n .on('connected', str =\u003E console.log(str))\n","common-subscribe-method","Common Subscribe method"," let options = {\n fromBlock: 0,\n address: ['address-1', 'address-2'], \u002F\u002FOnly get events from specific addresses\n topics: [] \u002F\u002FWhat topics to subscribe to\n };\n\n let subscription = ('logs', options, (err,event) =\u003E {\n if (!err)\n console.log(event)\n });\n\n subscription.on('data', event =\u003E console.log(event))\n subscription.on('changed', changed =\u003E console.log(changed))\n subscription.on('error', err =\u003E { throw err })\n subscription.on('connected', nr =\u003E console.log(nr))\n","getting-event-history","Getting event history"," \u002F\u002Fexample options(optional)\n let options = {\n filter: {\n \u002F\u002F only get events where transfer value was 1000 or 1337\n value: ['1000', '1337'] \n },\n \u002F\u002F number | \"earliest\" | \"pending\" | \"latest\"\n fromBlock: 0, \n toBlock: 'latest'\n };\n\n myContract.getPastEvents('Transfer', options)\n .then(results =\u003E console.log(results))\n .catch(err =\u003E throw err);\n\n","Contract","'.'","address","};","export","async","methods"," } ","throw","ct-c2ef3a"," }","result","().","call","privateKey","transaction","makeBatchRequest","batch","if","myContract","'connected'","'data'"," },","'error'"," fromBlock: "," };","Smart Contracts","\u002Fblockchain\u002Fsmart-contracts","root","For common functions see ","Common%20typescript%20examples","Common typescript examples","Useful for calling smart contract methods:","Contract has ","read"," and ","write"," methods. To get a list of methods, you can paste contract address on ","https:\u002F\u002Fetherscan.io\u002Ftoken\u002F0xdac17f958d2ee523a2206206994597c13d831ec7#readContract","https:\u002F\u002Fetherscan.io\u002F ETH"," or any other service.","Read"," methods doesn't require spending ",". ","Write"," methods cost some amount of ",", hence they will be executed with confirmation from user.","Function calls batch of requests, returning array of results. For example:","There're different ways to subscribe for contract events. For all of them you will need following variables:","We're listening to "," event here:","Filtering options can also be specified:","Getting history for "," events for specific values. More info can be found ","https:\u002F\u002Fweb3js.readthedocs.io\u002Fen\u002Fv1.2.11\u002Fweb3-eth-subscribe.html#","here","string","ct-d007af","abiFromJson","default","\u002F\u002F see example below","\u002F* ... *\u002F"," };","'0xdea164f67df4dbfe675d5271c9d404e0260f33bb'","executeContractMethod","\u002F\u002F getting contract","currentProvider","request","addressUser","store"," });","Error","val","account","accounts","(),","signed","!"," ","method","calls","promises","Promise","resolve","reject"," ","ABI","events","ct-5da781",", (","subscriptionId","}`","removed","returnValues","ct-41d808","user","referrer","error"," });"," filter: {","'changed'","changed")) \ No newline at end of file diff --git a/docs/blockchain/smart-contracts/index.html b/docs/blockchain/smart-contracts/index.html index 05ae0c3..ce8af39 100644 --- a/docs/blockchain/smart-contracts/index.html +++ b/docs/blockchain/smart-contracts/index.html @@ -1,6 +1,6 @@ -Smart Contracts • Obsidian Garden -

Smart Contracts

For common functions see Common typescript examples.

Getting smart contract instance

Useful for calling smart contract methods:

import { Contract } from 'web3-eth-contract';import { web3 } from '.';const getContract = (abi: object, address?: string): => {  const abiFromJson = JSON.parse(  return new web3.eth.Contract(abiFromJson, address);};export default getContract;

Executing contract method

Contract has read and write methods. To get a list of methods, you can paste contract address on https://etherscan.io/ ETH or any other service.

Read methods doesn't require spending gas. Write methods cost some amount of gas, hence they will be executed with confirmation from user.

Example for #Metamask without private key

// see example belowimport { getContract } from '.';// ABI of contractconst CONTRACT_ABI = { /* ... */ }; // address for contractconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';export const executeContractMethod = async ({}) => {  // getting contract  const contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);    // Calling write method  try {    // authorizing with Metamask    await web3.currentProvider.request({ method: 'eth_requestAccounts' });    // getting wallet address    const addressUser = web3.currentProvider.selectedAddress;    // calling "store" store method for contract    // payload should include `from` address, that matches    // current user's wallet    await contract.methods.store(0, 'Parameter').send({      from: addressUser,    });  } catch (e) {    throw new Error(e);  }    // calling read method  try {    // this method can return data    const result = await contract.methods.retrieve().call();  } catch (e) {    throw new Error(e);  }}

Node.js and React Native example

// see example belowimport { getContract } from '.';// ABI контрактаconst CONTRACT_ABI = { /* ... */ };// contract addressconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';// getting contractconst contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);// account's private keyconst privateKey = '...';// write-methods requires private keyconst executeContractMethod = async (val: number) => {    const transaction = contract.methods.store(val);    const account = web3.eth.accounts.privateKeyToAccount(privateKey);    const options = {      to: CONTRACT_ADDRESS,      data: transaction.encodeABI(),      gas: await transaction.estimateGas({ from: account.address }),      gasPrice: await web3.eth.getGasPrice(),    };    const signed = await web3.eth.accounts.signTransaction(      options,      privateKey,    );    await web3.eth.sendSignedTransaction(signed.rawTransaction!);};

Calling a batch of contract's methods

Function calls batch of requests, returning array of results. For example:

  const requests = [   contract.method.balanceOf().call,   contract.method.getStaked().call  ]  const result = await makeBatchRequest(request);
const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);const makeBatchRequest = (calls: any[]) => {  try {    const web3 = getWeb3NoAccount();    const batch = new web3.BatchRequest();    const promises = calls.map=> {      return new Promise((resolve, reject) => {        batch.add(            if (err) {              reject(err);            } else {              resolve(result);            }          })        );      });    });    batch.execute();    return Promise.all(promises);  } catch {    return null;  }};export default makeBatchRequest;

Subscribing to smart contract events

There're different ways to subscribe for contract events. For all of them you will need following variables:

  import Web3 from 'web3';  const web3 = new Web3('YOUR_RPC_ENDPOINT_HERE');  const ABI = 'YOUR ABI HERE';  const CONTRACT_ADDRESS = 'YOUR CONTRACT ADDRESS HERE';  const myContract = new Web3.Contract(ABI, CONTRACT_ADDRESS);

By accessing contract.events

referralProgramContract.events  .RegisterUser()  .on('connected', (subscriptionId: string) => {    console.log(`| UserRegistered | events | ${subscriptionId}`);  })  .on(    'data',    async (event: {      removed: boolean;      returnValues: RegisterUserResponseInterface;    }) => {      try {        if (event.removed) {          return;        }        const { user, referrer } = event.returnValues;        console.log(user, referrer);      } catch (e) {        console.log(`| ONCE | ${e}`);      }    },  )  .on('error', (error: ErrnoException) => {    console.log(error);  });

With filtering

We're listening to Transfer event here:

  let options = {    filter: {        value: [],    },    fromBlock: 0  };  myContract.events.Transfer(options)    .on('data' log(event))    .on('changed' log(changed))    .on('error'     .on('connected' log(str))

Common Subscribe method

Filtering options can also be specified:

  let options = {    fromBlock: 0,    address: ['address-1', 'address-2'],    //Only get events from specific addresses    topics: []                              //What topics to subscribe to  };  let subscription = ('logs', options      if (!err)      console.log(event)  });  subscription.on('data'=> console.log(event))  subscription.on('changed'=> console.log(changed))  subscription.on('error'=> { throw err })  subscription.on('connected'=> console.log(nr))

Getting event history

Getting history for Transfer events for specific values. More info can be found here

  //example options(optional)  let options = {    filter: {        // only get events where transfer value was 1000 or 1337        value: ['1000', '1337']        },    // number | "earliest" | "pending" | "latest"    fromBlock: 0,                      toBlock: 'latest'  };  myContract.getPastEvents('Transfer', options)    .then log(results))    .catch 
btw, have a nice day
(2018 - 2024) muerwre
+

Smart Contracts

For common functions see Common typescript examples.

Getting smart contract instance

Useful for calling smart contract methods:

import { Contract } from 'web3-eth-contract';import { web3 } from '.';const getContract = (abi: object, address?: string): => {  const abiFromJson = JSON.parse(  return new web3.eth.Contract(abiFromJson, address);};export default getContract;

Executing contract method

Contract has read and write methods. To get a list of methods, you can paste contract address on https://etherscan.io/ ETH or any other service.

Read methods doesn't require spending gas. Write methods cost some amount of gas, hence they will be executed with confirmation from user.

Example for #Metamask without private key

// see example belowimport { getContract } from '.';// ABI of contractconst CONTRACT_ABI = { /* ... */ }; // address for contractconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';export const executeContractMethod = async ({}) => {  // getting contract  const contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);    // Calling write method  try {    // authorizing with Metamask    await web3.currentProvider.request({ method: 'eth_requestAccounts' });    // getting wallet address    const addressUser = web3.currentProvider.selectedAddress;    // calling "store" store method for contract    // payload should include `from` address, that matches    // current user's wallet    await contract.methods.store(0, 'Parameter').send({      from: addressUser,    });  } catch (e) {    throw new Error(e);  }    // calling read method  try {    // this method can return data    const result = await contract.methods.retrieve().call();  } catch (e) {    throw new Error(e);  }}

Node.js and React Native example

// see example belowimport { getContract } from '.';// ABI контрактаconst CONTRACT_ABI = { /* ... */ };// contract addressconst CONTRACT_ADDRESS = '0xdea164f67df4dbfe675d5271c9d404e0260f33bb';// getting contractconst contract = getContract(CONTRACT_ABI, CONTRACT_ADDRESS);// account's private keyconst privateKey = '...';// write-methods requires private keyconst executeContractMethod = async (val: number) => {    const transaction = contract.methods.store(val);    const account = web3.eth.accounts.privateKeyToAccount(privateKey);    const options = {      to: CONTRACT_ADDRESS,      data: transaction.encodeABI(),      gas: await transaction.estimateGas({ from: account.address }),      gasPrice: await web3.eth.getGasPrice(),    };    const signed = await web3.eth.accounts.signTransaction(      options,      privateKey,    );    await web3.eth.sendSignedTransaction(signed.rawTransaction!);};

Calling a batch of contract's methods

Function calls batch of requests, returning array of results. For example:

  const requests = [   contract.method.balanceOf().call,   contract.method.getStaked().call  ]  const result = await makeBatchRequest(request);
const web3 = new Web3(Web3.givenProvider || PROVIDER_URL);const makeBatchRequest = (calls: any[]) => {  try {    const web3 = getWeb3NoAccount();    const batch = new web3.BatchRequest();    const promises = calls.map=> {      return new Promise((resolve, reject) => {        batch.add(            if (err) {              reject(err);            } else {              resolve(result);            }          })        );      });    });    batch.execute();    return Promise.all(promises);  } catch {    return null;  }};export default makeBatchRequest;

Subscribing to smart contract events

There're different ways to subscribe for contract events. For all of them you will need following variables:

  import Web3 from 'web3';  const web3 = new Web3('YOUR_RPC_ENDPOINT_HERE');  const ABI = 'YOUR ABI HERE';  const CONTRACT_ADDRESS = 'YOUR CONTRACT ADDRESS HERE';  const myContract = new Web3.Contract(ABI, CONTRACT_ADDRESS);

By accessing contract.events

referralProgramContract.events  .RegisterUser()  .on('connected', (subscriptionId: string) => {    console.log(`| UserRegistered | events | ${subscriptionId}`);  })  .on(    'data',    async (event: {      removed: boolean;      returnValues: RegisterUserResponseInterface;    }) => {      try {        if (event.removed) {          return;        }        const { user, referrer } = event.returnValues;        console.log(user, referrer);      } catch (e) {        console.log(`| ONCE | ${e}`);      }    },  )  .on('error', (error: ErrnoException) => {    console.log(error);  });

With filtering

We're listening to Transfer event here:

  let options = {    filter: {        value: [],    },    fromBlock: 0  };  myContract.events.Transfer(options)    .on('data' log(event))    .on('changed' log(changed))    .on('error'     .on('connected' log(str))

Common Subscribe method

Filtering options can also be specified:

  let options = {    fromBlock: 0,    address: ['address-1', 'address-2'],    //Only get events from specific addresses    topics: []                              //What topics to subscribe to  };  let subscription = ('logs', options      if (!err)      console.log(event)  });  subscription.on('data'=> console.log(event))  subscription.on('changed'=> console.log(changed))  subscription.on('error'=> { throw err })  subscription.on('connected'=> console.log(nr))

Getting event history

Getting history for Transfer events for specific values. More info can be found here

  //example options(optional)  let options = {    filter: {        // only get events where transfer value was 1000 or 1337        value: ['1000', '1337']        },    // number | "earliest" | "pending" | "latest"    fromBlock: 0,                      toBlock: 'latest'  };  myContract.getPastEvents('Transfer', options)    .then log(results))    .catch 
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/contacts/_payload.js b/docs/contacts/_payload.js index e007e2e..20947b7 100644 --- a/docs/contacts/_payload.js +++ b/docs/contacts/_payload.js @@ -1 +1 @@ -export default {data:{},prerenderedAt:1711020221326} \ No newline at end of file +export default {data:{},prerenderedAt:1711020853912} \ No newline at end of file diff --git a/docs/contacts/index.html b/docs/contacts/index.html index fb16653..dd0e738 100644 --- a/docs/contacts/index.html +++ b/docs/contacts/index.html @@ -1,6 +1,6 @@ -Contacts -
btw, have a nice day
(2018 - 2024) muerwre
+
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/css/automatic-grid-like-masonry-with-pure-css/_payload.js b/docs/css/automatic-grid-like-masonry-with-pure-css/_payload.js index 02772c7..0359b35 100644 --- a/docs/css/automatic-grid-like-masonry-with-pure-css/_payload.js +++ b/docs/css/automatic-grid-like-masonry-with-pure-css/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:Q,_path:R},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-yoYMujrz1O":{_path:R,_dir:"css",_draft:y,_partial:y,_locale:"en",_empty:y,title:Q,description:z,excerpt:{type:S,children:[{type:a,tag:T,props:{},children:[{type:c,value:z}]},{type:a,tag:g,props:{code:A,language:n},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:c,value:A}]}]}]},{type:a,tag:q,props:{id:B},children:[{type:c,value:C}]},{type:a,tag:g,props:{code:D,language:n},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:c,value:D}]}]}]},{type:a,tag:q,props:{id:E},children:[{type:c,value:F}]},{type:a,tag:g,props:{code:G,language:n},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:c,value:G}]}]}]},{type:a,tag:q,props:{id:H},children:[{type:c,value:I}]},{type:a,tag:g,props:{code:J,language:n},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:c,value:J}]}]}]}]},body:{type:S,children:[{type:a,tag:T,props:{},children:[{type:c,value:z}]},{type:a,tag:g,props:{code:A,language:n},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:U},children:[{type:c,value:"$cell: "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"250"}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:U},children:[{type:c,value:"$gap: "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"20"}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:".grid"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:"display"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:M},children:[{type:c,value:"grid"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:"grid-template-columns"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:V},children:[{type:c,value:"repeat"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:"auto-fit"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:V},children:[{type:c,value:"minmax"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:"$cell"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:"ct-473b07"},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:"ct-a21da7"},children:[{type:c,value:"fr"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"));"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:"grid-auto-rows"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"256"}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:"grid-auto-flow"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:M},children:[{type:c,value:"row"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:M},children:[{type:c,value:"dense"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:"grid-column-gap"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:"grid-row-gap"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]}]}]}]}]},{type:a,tag:q,props:{id:B},children:[{type:c,value:C}]},{type:a,tag:g,props:{code:D,language:n},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:".h-2"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:"\u002F\u002F takes 2 columns"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:"grid-column-end"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:b}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:".v-2"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:"\u002F\u002F takes 2 rows"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:"grid-row-end"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:b}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]}]}]}]}]},{type:a,tag:q,props:{id:E},children:[{type:c,value:F}]},{type:a,tag:g,props:{code:G,language:n},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:".full-width"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:"\u002F\u002F height: 1 row"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]}]}]}]}]},{type:a,tag:q,props:{id:H},children:[{type:c,value:I}]},{type:a,tag:g,props:{code:J,language:n},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:".top-right"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"3"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:"\u002F\u002F height here"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"-2"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:"\u002F\u002F width here"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-aeae87{color:#8B949E}.ct-a351a6{color:#79C0FF}.ct-a21da7{color:#FF7B72}.ct-473b07{color:#79C0FF}.ct-0e1737{color:#FFA657}.ct-a411fb{color:#79C0FF}.ct-5445d1{color:#79C0FF}.ct-46c41a{color:#79C0FF}.ct-880855{color:#C9D1D9}.ct-afae65{color:#79C0FF}.ct-b56a0d{color:#C9D1D9}.ct-c67ab6{color:#FF7B72}.ct-9ec046{color:#79C0FF}.ct-056ebb{color:#FFA657}.light .ct-056ebb{color:#657B83}.light .ct-9ec046{color:#D33682}.light .ct-c67ab6{color:#859900}.light .ct-b56a0d{color:#657B83}.light .ct-afae65{color:#93A1A1}.light .ct-880855{color:#657B83}.light .ct-46c41a{color:#859900}.light .ct-5445d1{color:#657B83}.light .ct-a411fb{color:#268BD2}.light .ct-0e1737{color:#657B83}.light .ct-473b07{color:#D33682}.light .ct-a21da7{color:#859900}.light .ct-a351a6{color:#859900}.light .ct-aeae87{color:#93A1A1}"}]}],toc:{title:l,searchDepth:ae,depth:ae,links:[{id:B,depth:P,text:C},{id:E,depth:P,text:F},{id:H,depth:P,text:I}]}},_type:"markdown",_id:"content:CSS:Automatic Grid like Masonry with pure CSS.md",_source:"content",_file:"CSS\u002FAutomatic Grid like Masonry with pure CSS.md",_extension:"md"}},prerenderedAt:1711020226745}}("element","span","text","ct-b56a0d","line","ct-880855","code","ct-9ec046",": ",";"," ","","ct-a351a6","scss","pre"," ","h3","ct-c67ab6","ct-afae65","ct-46c41a","}","ct-aeae87","ct-0e1737","1",false,"Grid, that places items by density. Pure #css solution. Can be used with items, that take different amount of rows\u002Fcolumns.","$cell: 250px;\n$gap: 20px;\n\n.grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax($cell, 1fr));\n grid-auto-rows: 256px;\n grid-auto-flow: row dense;\n grid-column-gap: $gap;\n grid-row-gap: $gap;\n}\n","basic-elements-with-double-height-or-width","Basic elements with double height or width",".h-2 { \u002F\u002F takes 2 columns\n grid-column-end: span 2;\n}\n\n.v-2 { \u002F\u002F takes 2 rows\n grid-row-end: span 2;\n}\n","header-that-fills-all-columns","Header, that fills all columns",".full-width {\n grid-row: 1 \u002F 2; \u002F\u002F height: 1 row\n grid-column: 1 \u002F -1;\n}\n","stamp-element-that-takes-3-rows-in-the-top-right-corner","Stamp element, that takes 3 rows in the top right corner",".top-right {\n grid-row: 1 \u002F 3; \u002F\u002F height here\n grid-column: -2 \u002F -1; \u002F\u002F width here\n}\n","px"," {","ct-5445d1","2","; ",3,"Automatic Grid Like Masonry With Pure CSS","\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css","root","p","ct-056ebb","ct-a411fb","(",", ","$gap"," { "," ","grid-row","\u002F","grid-column"," \u002F ","-1",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:Q,_path:R},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-yoYMujrz1O":{_path:R,_dir:"css",_draft:y,_partial:y,_locale:"en",_empty:y,title:Q,description:z,excerpt:{type:S,children:[{type:a,tag:T,props:{},children:[{type:c,value:z}]},{type:a,tag:g,props:{code:A,language:n},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:c,value:A}]}]}]},{type:a,tag:q,props:{id:B},children:[{type:c,value:C}]},{type:a,tag:g,props:{code:D,language:n},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:c,value:D}]}]}]},{type:a,tag:q,props:{id:E},children:[{type:c,value:F}]},{type:a,tag:g,props:{code:G,language:n},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:c,value:G}]}]}]},{type:a,tag:q,props:{id:H},children:[{type:c,value:I}]},{type:a,tag:g,props:{code:J,language:n},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:c,value:J}]}]}]}]},body:{type:S,children:[{type:a,tag:T,props:{},children:[{type:c,value:z}]},{type:a,tag:g,props:{code:A,language:n},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:U},children:[{type:c,value:"$cell: "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"250"}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:U},children:[{type:c,value:"$gap: "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"20"}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:".grid"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:"display"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:M},children:[{type:c,value:"grid"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:"grid-template-columns"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:V},children:[{type:c,value:"repeat"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:"auto-fit"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:V},children:[{type:c,value:"minmax"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:"$cell"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:"ct-401198"},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:"ct-7bc134"},children:[{type:c,value:"fr"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"));"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:"grid-auto-rows"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"256"}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:"grid-auto-flow"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:M},children:[{type:c,value:"row"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:M},children:[{type:c,value:"dense"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:"grid-column-gap"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:"grid-row-gap"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]}]}]}]}]},{type:a,tag:q,props:{id:B},children:[{type:c,value:C}]},{type:a,tag:g,props:{code:D,language:n},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:".h-2"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:"\u002F\u002F takes 2 columns"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:"grid-column-end"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:b}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:".v-2"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:"\u002F\u002F takes 2 rows"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:"grid-row-end"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:b}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]}]}]}]}]},{type:a,tag:q,props:{id:E},children:[{type:c,value:F}]},{type:a,tag:g,props:{code:G,language:n},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:".full-width"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:"\u002F\u002F height: 1 row"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]}]}]}]}]},{type:a,tag:q,props:{id:H},children:[{type:c,value:I}]},{type:a,tag:g,props:{code:J,language:n},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:".top-right"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"3"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:"\u002F\u002F height here"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"-2"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:"\u002F\u002F width here"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-202ff2{color:#8B949E}.ct-7f6288{color:#79C0FF}.ct-7bc134{color:#FF7B72}.ct-401198{color:#79C0FF}.ct-3e58c4{color:#FFA657}.ct-5c090b{color:#79C0FF}.ct-03adce{color:#79C0FF}.ct-ac4382{color:#79C0FF}.ct-dd221a{color:#C9D1D9}.ct-0deccd{color:#79C0FF}.ct-cd1102{color:#C9D1D9}.ct-535298{color:#FF7B72}.ct-a9479e{color:#79C0FF}.ct-b7c931{color:#FFA657}.light .ct-b7c931{color:#657B83}.light .ct-a9479e{color:#D33682}.light .ct-535298{color:#859900}.light .ct-cd1102{color:#657B83}.light .ct-0deccd{color:#93A1A1}.light .ct-dd221a{color:#657B83}.light .ct-ac4382{color:#859900}.light .ct-03adce{color:#657B83}.light .ct-5c090b{color:#268BD2}.light .ct-3e58c4{color:#657B83}.light .ct-401198{color:#D33682}.light .ct-7bc134{color:#859900}.light .ct-7f6288{color:#859900}.light .ct-202ff2{color:#93A1A1}"}]}],toc:{title:l,searchDepth:ae,depth:ae,links:[{id:B,depth:P,text:C},{id:E,depth:P,text:F},{id:H,depth:P,text:I}]}},_type:"markdown",_id:"content:CSS:Automatic Grid like Masonry with pure CSS.md",_source:"content",_file:"CSS\u002FAutomatic Grid like Masonry with pure CSS.md",_extension:"md"}},prerenderedAt:1711020860471}}("element","span","text","ct-cd1102","line","ct-dd221a","code","ct-a9479e",": ",";"," ","","ct-7f6288","scss","pre"," ","h3","ct-535298","ct-0deccd","ct-ac4382","}","ct-202ff2","ct-3e58c4","1",false,"Grid, that places items by density. Pure #css solution. Can be used with items, that take different amount of rows\u002Fcolumns.","$cell: 250px;\n$gap: 20px;\n\n.grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax($cell, 1fr));\n grid-auto-rows: 256px;\n grid-auto-flow: row dense;\n grid-column-gap: $gap;\n grid-row-gap: $gap;\n}\n","basic-elements-with-double-height-or-width","Basic elements with double height or width",".h-2 { \u002F\u002F takes 2 columns\n grid-column-end: span 2;\n}\n\n.v-2 { \u002F\u002F takes 2 rows\n grid-row-end: span 2;\n}\n","header-that-fills-all-columns","Header, that fills all columns",".full-width {\n grid-row: 1 \u002F 2; \u002F\u002F height: 1 row\n grid-column: 1 \u002F -1;\n}\n","stamp-element-that-takes-3-rows-in-the-top-right-corner","Stamp element, that takes 3 rows in the top right corner",".top-right {\n grid-row: 1 \u002F 3; \u002F\u002F height here\n grid-column: -2 \u002F -1; \u002F\u002F width here\n}\n","px"," {","ct-03adce","2","; ",3,"Automatic Grid Like Masonry With Pure CSS","\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css","root","p","ct-b7c931","ct-5c090b","(",", ","$gap"," { "," ","grid-row","\u002F","grid-column"," \u002F ","-1",2)) \ No newline at end of file diff --git a/docs/css/automatic-grid-like-masonry-with-pure-css/index.html b/docs/css/automatic-grid-like-masonry-with-pure-css/index.html index a789fde..bf5035b 100644 --- a/docs/css/automatic-grid-like-masonry-with-pure-css/index.html +++ b/docs/css/automatic-grid-like-masonry-with-pure-css/index.html @@ -1,6 +1,6 @@ -Automatic Grid Like Masonry With Pure CSS • Obsidian Garden -

Automatic Grid Like Masonry With Pure CSS

Grid, that places items by density. Pure #css solution. Can be used with items, that take different amount of rows/columns.

$cell: 250px;$gap: 20px;.grid {  display: grid;  grid-template-columns: repeat(auto-fit, minmax($cell, 1fr));  grid-auto-rows: 256px;  grid-auto-flow: row dense;  grid-column-gap: $gap;  grid-row-gap: $gap;}

Basic elements with double height or width

.h-2 { // takes 2 columns    grid-column-end: span 2;}.v-2 { // takes 2 rows    grid-row-end: span 2;}

Header, that fills all columns

.full-width {  grid-row: 1 / 2; // height: 1 row  grid-column: 1 / -1;}

Stamp element, that takes 3 rows in the top right corner

.top-right {  grid-row: 1 / 3; // height here  grid-column: -2 / -1; // width here}
btw, have a nice day
(2018 - 2024) muerwre
+

Automatic Grid Like Masonry With Pure CSS

Grid, that places items by density. Pure #css solution. Can be used with items, that take different amount of rows/columns.

$cell: 250px;$gap: 20px;.grid {  display: grid;  grid-template-columns: repeat(auto-fit, minmax($cell, 1fr));  grid-auto-rows: 256px;  grid-auto-flow: row dense;  grid-column-gap: $gap;  grid-row-gap: $gap;}

Basic elements with double height or width

.h-2 { // takes 2 columns    grid-column-end: span 2;}.v-2 { // takes 2 rows    grid-row-end: span 2;}

Header, that fills all columns

.full-width {  grid-row: 1 / 2; // height: 1 row  grid-column: 1 / -1;}

Stamp element, that takes 3 rows in the top right corner

.top-right {  grid-row: 1 / 3; // height here  grid-column: -2 / -1; // width here}
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/css/sass-nth-child-iterate-mixin/_payload.js b/docs/css/sass-nth-child-iterate-mixin/_payload.js index 9dbb50a..f09f6b9 100644 --- a/docs/css/sass-nth-child-iterate-mixin/_payload.js +++ b/docs/css/sass-nth-child-iterate-mixin/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:t,_path:u},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-ex7u9maCrE":{_path:u,_dir:"css",_draft:p,_partial:p,_locale:"en",_empty:p,title:t,description:"Say, we need to color n items by specific colors, which depend on its position. #SCSS supports iteration over lists for that purposes:",excerpt:{type:v,children:[{type:a,tag:l,props:{},children:[{type:b,value:w},{type:a,tag:x,props:{},children:[{type:b,value:y}]},{type:b,value:z},{type:a,tag:A,props:{href:B,rel:[C]},children:[{type:b,value:D}]},{type:b,value:E}]},{type:a,tag:g,props:{code:q,language:m},children:[{type:a,tag:n,props:{},children:[{type:a,tag:g,props:{__ignoreMap:i},children:[{type:b,value:q}]}]}]},{type:a,tag:l,props:{},children:[{type:b,value:F}]},{type:a,tag:g,props:{code:r,language:m},children:[{type:a,tag:n,props:{},children:[{type:a,tag:g,props:{__ignoreMap:i},children:[{type:b,value:r}]}]}]}]},body:{type:v,children:[{type:a,tag:l,props:{},children:[{type:b,value:w},{type:a,tag:x,props:{},children:[{type:b,value:y}]},{type:b,value:z},{type:a,tag:A,props:{href:B,rel:[C]},children:[{type:b,value:D}]},{type:b,value:E}]},{type:a,tag:g,props:{code:q,language:m},children:[{type:a,tag:n,props:{},children:[{type:a,tag:g,props:{__ignoreMap:i},children:[{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:s},children:[{type:b,value:"@mixin"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:"ct-304886"},children:[{type:b,value:"color-per-child"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:G}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:H}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:I}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:J}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:"@each"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:K}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:"in"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:H}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:L}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:"ct-b6c16d"},children:[{type:b,value:"&"}]},{type:a,tag:c,props:{class:"ct-ed78e4"},children:[{type:b,value:":nth-child"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:G}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"#{"}]},{type:a,tag:c,props:{class:"ct-577ace"},children:[{type:b,value:"index"}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"(($colors), ($color))}"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:I}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:"ct-a45440"},children:[{type:b,value:"color"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:": "}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:K}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:";"}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:" }"}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:" }"}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:M}]}]}]}]}]},{type:a,tag:l,props:{},children:[{type:b,value:F}]},{type:a,tag:g,props:{code:r,language:m},children:[{type:a,tag:n,props:{},children:[{type:a,tag:g,props:{__ignoreMap:i},children:[{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:"ct-17b220"},children:[{type:b,value:".item"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:L}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:J}]},{type:a,tag:c,props:{class:"ct-889b48"},children:[{type:b,value:"@include"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:"ct-93a1a4"},children:[{type:b,value:"color_per_child"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:"(("}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"#ded187"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"#dbde87"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"#bade87"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"#9cde87"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"#87deaa"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:"));"}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:M}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-042456{color:#79C0FF}.ct-93a1a4{color:#D2A8FF}.ct-889b48{color:#FF7B72}.ct-17b220{color:#79C0FF}.ct-f78f84{color:#C9D1D9}.ct-a45440{color:#79C0FF}.ct-577ace{color:#79C0FF}.ct-ed78e4{color:#79C0FF}.ct-b6c16d{color:#7EE787}.ct-432e38{color:#FFA657}.ct-304886{color:#D2A8FF}.ct-091587{color:#C9D1D9}.ct-41b004{color:#FF7B72}.light .ct-41b004{color:#859900}.light .ct-091587{color:#657B83}.light .ct-304886{color:#268BD2}.light .ct-432e38{color:#657B83}.light .ct-b6c16d{color:#268BD2}.light .ct-ed78e4{color:#93A1A1}.light .ct-577ace{color:#268BD2}.light .ct-a45440{color:#859900}.light .ct-f78f84{color:#657B83}.light .ct-17b220{color:#93A1A1}.light .ct-889b48{color:#859900}.light .ct-93a1a4{color:#268BD2}.light .ct-042456{color:#CB4B16}"}]}],toc:{title:i,searchDepth:N,depth:N,links:[]}},_type:"markdown",_id:"content:CSS:Sass nth-child iterate mixin.md",_source:"content",_file:"CSS\u002FSass nth-child iterate mixin.md",_extension:"md"}},prerenderedAt:1711020226781}}("element","text","span","ct-091587","ct-f78f84","line","code","ct-432e38",""," ","ct-042456","p","scss","pre",", ",false,"@mixin color-per-child($colors) {\n @each $color in $colors {\n &:nth-child(#{index(($colors), ($color))}) {\n color: $color;\n }\n }\n}\n",".item {\n @include color_per_child((#ded187, #dbde87, #bade87, #9cde87, #87deaa));\n}\n","ct-41b004","Sass Nth Child Iterate Mixin","\u002Fcss\u002Fsass-nth-child-iterate-mixin","root","Say, we need to color ","code-inline","n"," items by specific colors, which depend on its position. #SCSS supports ","a","https:\u002F\u002Fsass-lang.com\u002Fdocumentation\u002Fat-rules\u002Fcontrol\u002Feach","nofollow","iteration over lists"," for that purposes:","Usage is simple:","(","$colors",") {"," ","$color"," {","}",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:t,_path:u},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-ex7u9maCrE":{_path:u,_dir:"css",_draft:p,_partial:p,_locale:"en",_empty:p,title:t,description:"Say, we need to color n items by specific colors, which depend on its position. #SCSS supports iteration over lists for that purposes:",excerpt:{type:v,children:[{type:a,tag:l,props:{},children:[{type:b,value:w},{type:a,tag:x,props:{},children:[{type:b,value:y}]},{type:b,value:z},{type:a,tag:A,props:{href:B,rel:[C]},children:[{type:b,value:D}]},{type:b,value:E}]},{type:a,tag:g,props:{code:q,language:m},children:[{type:a,tag:n,props:{},children:[{type:a,tag:g,props:{__ignoreMap:i},children:[{type:b,value:q}]}]}]},{type:a,tag:l,props:{},children:[{type:b,value:F}]},{type:a,tag:g,props:{code:r,language:m},children:[{type:a,tag:n,props:{},children:[{type:a,tag:g,props:{__ignoreMap:i},children:[{type:b,value:r}]}]}]}]},body:{type:v,children:[{type:a,tag:l,props:{},children:[{type:b,value:w},{type:a,tag:x,props:{},children:[{type:b,value:y}]},{type:b,value:z},{type:a,tag:A,props:{href:B,rel:[C]},children:[{type:b,value:D}]},{type:b,value:E}]},{type:a,tag:g,props:{code:q,language:m},children:[{type:a,tag:n,props:{},children:[{type:a,tag:g,props:{__ignoreMap:i},children:[{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:s},children:[{type:b,value:"@mixin"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:"ct-3da580"},children:[{type:b,value:"color-per-child"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:G}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:H}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:I}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:J}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:"@each"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:K}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:"in"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:H}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:L}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:"ct-c6b63c"},children:[{type:b,value:"&"}]},{type:a,tag:c,props:{class:"ct-c81df3"},children:[{type:b,value:":nth-child"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:G}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"#{"}]},{type:a,tag:c,props:{class:"ct-a33ddb"},children:[{type:b,value:"index"}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"(($colors), ($color))}"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:I}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:"ct-204ad4"},children:[{type:b,value:"color"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:": "}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:K}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:";"}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:" }"}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:" }"}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:M}]}]}]}]}]},{type:a,tag:l,props:{},children:[{type:b,value:F}]},{type:a,tag:g,props:{code:r,language:m},children:[{type:a,tag:n,props:{},children:[{type:a,tag:g,props:{__ignoreMap:i},children:[{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:"ct-97f073"},children:[{type:b,value:".item"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:L}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:J}]},{type:a,tag:c,props:{class:"ct-56dec9"},children:[{type:b,value:"@include"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:"ct-bf611e"},children:[{type:b,value:"color_per_child"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:"(("}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"#ded187"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"#dbde87"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"#bade87"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"#9cde87"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"#87deaa"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:"));"}]}]},{type:a,tag:c,props:{class:f},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:M}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-4ac007{color:#79C0FF}.ct-bf611e{color:#D2A8FF}.ct-56dec9{color:#FF7B72}.ct-97f073{color:#79C0FF}.ct-59d711{color:#C9D1D9}.ct-204ad4{color:#79C0FF}.ct-a33ddb{color:#79C0FF}.ct-c81df3{color:#79C0FF}.ct-c6b63c{color:#7EE787}.ct-ba84b2{color:#FFA657}.ct-3da580{color:#D2A8FF}.ct-c05fcc{color:#C9D1D9}.ct-cd9d85{color:#FF7B72}.light .ct-cd9d85{color:#859900}.light .ct-c05fcc{color:#657B83}.light .ct-3da580{color:#268BD2}.light .ct-ba84b2{color:#657B83}.light .ct-c6b63c{color:#268BD2}.light .ct-c81df3{color:#93A1A1}.light .ct-a33ddb{color:#268BD2}.light .ct-204ad4{color:#859900}.light .ct-59d711{color:#657B83}.light .ct-97f073{color:#93A1A1}.light .ct-56dec9{color:#859900}.light .ct-bf611e{color:#268BD2}.light .ct-4ac007{color:#CB4B16}"}]}],toc:{title:i,searchDepth:N,depth:N,links:[]}},_type:"markdown",_id:"content:CSS:Sass nth-child iterate mixin.md",_source:"content",_file:"CSS\u002FSass nth-child iterate mixin.md",_extension:"md"}},prerenderedAt:1711020860518}}("element","text","span","ct-c05fcc","ct-59d711","line","code","ct-ba84b2",""," ","ct-4ac007","p","scss","pre",", ",false,"@mixin color-per-child($colors) {\n @each $color in $colors {\n &:nth-child(#{index(($colors), ($color))}) {\n color: $color;\n }\n }\n}\n",".item {\n @include color_per_child((#ded187, #dbde87, #bade87, #9cde87, #87deaa));\n}\n","ct-cd9d85","Sass Nth Child Iterate Mixin","\u002Fcss\u002Fsass-nth-child-iterate-mixin","root","Say, we need to color ","code-inline","n"," items by specific colors, which depend on its position. #SCSS supports ","a","https:\u002F\u002Fsass-lang.com\u002Fdocumentation\u002Fat-rules\u002Fcontrol\u002Feach","nofollow","iteration over lists"," for that purposes:","Usage is simple:","(","$colors",") {"," ","$color"," {","}",2)) \ No newline at end of file diff --git a/docs/css/sass-nth-child-iterate-mixin/index.html b/docs/css/sass-nth-child-iterate-mixin/index.html index 77399ee..7d6748b 100644 --- a/docs/css/sass-nth-child-iterate-mixin/index.html +++ b/docs/css/sass-nth-child-iterate-mixin/index.html @@ -1,6 +1,6 @@ -Sass Nth Child Iterate Mixin • Obsidian Garden -

Sass Nth Child Iterate Mixin

Say, we need to color n items by specific colors, which depend on its position. #SCSS supports iteration over lists for that purposes:

@mixin color-per-child($colors) {  @each $color in $colors {    &:nth-child(#{index(($colors), ($color))}) {      color: $color;    }  }}

Usage is simple:

.item {  @include color_per_child((#ded187, #dbde87, #bade87, #9cde87, #87deaa));}
btw, have a nice day
(2018 - 2024) muerwre
+

Sass Nth Child Iterate Mixin

Say, we need to color n items by specific colors, which depend on its position. #SCSS supports iteration over lists for that purposes:

@mixin color-per-child($colors) {  @each $color in $colors {    &:nth-child(#{index(($colors), ($color))}) {      color: $color;    }  }}

Usage is simple:

.item {  @include color_per_child((#ded187, #dbde87, #bade87, #9cde87, #87deaa));}
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/css/test-if-browser-supports-css-rules/_payload.js b/docs/css/test-if-browser-supports-css-rules/_payload.js index 9f68798..c43ad1d 100644 --- a/docs/css/test-if-browser-supports-css-rules/_payload.js +++ b/docs/css/test-if-browser-supports-css-rules/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:x,_path:y}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-OwjCJk80Rt":{_path:y,_dir:l,_draft:m,_partial:m,_locale:"en",_empty:m,title:x,description:n,excerpt:{type:z,children:[{type:a,tag:j,props:{},children:[{type:b,value:n}]},{type:a,tag:f,props:{code:o,language:l},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:h},children:[{type:b,value:o}]}]}]},{type:a,tag:j,props:{},children:[{type:b,value:A},{type:a,tag:B,props:{},children:[{type:b,value:p}]},{type:b,value:C}]},{type:a,tag:f,props:{code:q,language:D},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:h},children:[{type:b,value:q}]}]}]}]},body:{type:z,children:[{type:a,tag:j,props:{},children:[{type:b,value:n}]},{type:a,tag:f,props:{code:o,language:l},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:h},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:F}]},{type:a,tag:c,props:{class:G},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:H},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:u}]},{type:a,tag:c,props:{class:I},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:")) {"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:J}]},{type:a,tag:c,props:{class:"ct-509371"},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:": blur(5px);"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:K}]}]}]}]}]},{type:a,tag:j,props:{},children:[{type:b,value:A},{type:a,tag:B,props:{},children:[{type:b,value:p}]},{type:b,value:C}]},{type:a,tag:f,props:{code:q,language:D},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:h},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:"ct-0500fd"},children:[{type:b,value:"can_backdrop"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" {"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:F}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:i},children:[{type:b,value:M}]},{type:a,tag:c,props:{class:"ct-6c59f3"},children:[{type:b,value:"-webkit-backdrop-filter"}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:"ct-8e2b82"},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:u}]},{type:a,tag:c,props:{class:"ct-ad4b38"},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:"ct-7461e6"},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:")) "}]},{type:a,tag:c,props:{class:"ct-1c5c15"},children:[{type:b,value:"or"}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:L}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:M}]},{type:a,tag:c,props:{class:G},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:H},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:u}]},{type:a,tag:c,props:{class:I},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"))"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" ) {"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:J}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"@content"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:";"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" }"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:K}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-1c5c15{color:#79C0FF}.ct-7461e6{color:#FF7B72}.ct-ad4b38{color:#79C0FF}.ct-8e2b82{color:#79C0FF}.ct-6c59f3{color:#79C0FF}.ct-8b2965{color:#C9D1D9}.ct-0500fd{color:#D2A8FF}.ct-509371{color:#7EE787}.ct-899a6f{color:#79C0FF}.ct-226639{color:#79C0FF}.ct-112c18{color:#79C0FF}.ct-c4faf2{color:#C9D1D9}.ct-a0ae9b{color:#FF7B72}.light .ct-a0ae9b{color:#859900}.light .ct-c4faf2{color:#657B83}.light .ct-112c18{color:#859900}.light .ct-226639{color:#268BD2}.light .ct-899a6f{color:#D33682}.light .ct-509371{color:#268BD2}.light .ct-0500fd{color:#268BD2}.light .ct-8b2965{color:#657B83}.light .ct-6c59f3{color:#859900}.light .ct-8e2b82{color:#268BD2}.light .ct-ad4b38{color:#D33682}.light .ct-7461e6{color:#859900}.light .ct-1c5c15{color:#657B83}"}]}],toc:{title:h,searchDepth:N,depth:N,links:[]}},_type:"markdown",_id:"content:CSS:Test if browser supports CSS rules.md",_source:"content",_file:"CSS\u002FTest if browser supports CSS rules.md",_extension:"md"}},prerenderedAt:1711020226812}}("element","text","span","ct-c4faf2","line","code","ct-a0ae9b","","ct-8b2965","p","pre","css",false,"To test if browser supports some #CSS rules, do following:","@supports (backdrop-filter: blur(5px)) {\n backdrop-filter: blur(5px);\n}\n","@mixin","@mixin can_backdrop {\n @supports (\n (-webkit-backdrop-filter: blur(5px)) or \n (backdrop-filter: blur(5px))\n ) {\n @content;\n }\n}\n","backdrop-filter",": ","blur","(","5","px","Test If Browser Supports CSS Rules","\u002Fcss\u002Ftest-if-browser-supports-css-rules","root","This ","code-inline"," will only apply rule if browser support backdrop filtering:","scss","@supports"," (","ct-112c18","ct-226639","ct-899a6f"," ","}"," "," (",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:x,_path:y}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-OwjCJk80Rt":{_path:y,_dir:l,_draft:m,_partial:m,_locale:"en",_empty:m,title:x,description:n,excerpt:{type:z,children:[{type:a,tag:j,props:{},children:[{type:b,value:n}]},{type:a,tag:f,props:{code:o,language:l},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:h},children:[{type:b,value:o}]}]}]},{type:a,tag:j,props:{},children:[{type:b,value:A},{type:a,tag:B,props:{},children:[{type:b,value:p}]},{type:b,value:C}]},{type:a,tag:f,props:{code:q,language:D},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:h},children:[{type:b,value:q}]}]}]}]},body:{type:z,children:[{type:a,tag:j,props:{},children:[{type:b,value:n}]},{type:a,tag:f,props:{code:o,language:l},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:h},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:F}]},{type:a,tag:c,props:{class:G},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:H},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:u}]},{type:a,tag:c,props:{class:I},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:")) {"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:J}]},{type:a,tag:c,props:{class:"ct-ee1d29"},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:": blur(5px);"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:K}]}]}]}]}]},{type:a,tag:j,props:{},children:[{type:b,value:A},{type:a,tag:B,props:{},children:[{type:b,value:p}]},{type:b,value:C}]},{type:a,tag:f,props:{code:q,language:D},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:h},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:"ct-6fdca5"},children:[{type:b,value:"can_backdrop"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" {"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:F}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:i},children:[{type:b,value:M}]},{type:a,tag:c,props:{class:"ct-fd3bac"},children:[{type:b,value:"-webkit-backdrop-filter"}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:"ct-e2d865"},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:u}]},{type:a,tag:c,props:{class:"ct-d53fb7"},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:"ct-1caf5e"},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:")) "}]},{type:a,tag:c,props:{class:"ct-b98b1b"},children:[{type:b,value:"or"}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:L}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:M}]},{type:a,tag:c,props:{class:G},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:H},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:u}]},{type:a,tag:c,props:{class:I},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"))"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" ) {"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:J}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"@content"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:";"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" }"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:K}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-b98b1b{color:#79C0FF}.ct-1caf5e{color:#FF7B72}.ct-d53fb7{color:#79C0FF}.ct-e2d865{color:#79C0FF}.ct-fd3bac{color:#79C0FF}.ct-b96a7c{color:#C9D1D9}.ct-6fdca5{color:#D2A8FF}.ct-ee1d29{color:#7EE787}.ct-0a3d5b{color:#79C0FF}.ct-4cf4bf{color:#79C0FF}.ct-86d011{color:#79C0FF}.ct-786564{color:#C9D1D9}.ct-45aa1d{color:#FF7B72}.light .ct-45aa1d{color:#859900}.light .ct-786564{color:#657B83}.light .ct-86d011{color:#859900}.light .ct-4cf4bf{color:#268BD2}.light .ct-0a3d5b{color:#D33682}.light .ct-ee1d29{color:#268BD2}.light .ct-6fdca5{color:#268BD2}.light .ct-b96a7c{color:#657B83}.light .ct-fd3bac{color:#859900}.light .ct-e2d865{color:#268BD2}.light .ct-d53fb7{color:#D33682}.light .ct-1caf5e{color:#859900}.light .ct-b98b1b{color:#657B83}"}]}],toc:{title:h,searchDepth:N,depth:N,links:[]}},_type:"markdown",_id:"content:CSS:Test if browser supports CSS rules.md",_source:"content",_file:"CSS\u002FTest if browser supports CSS rules.md",_extension:"md"}},prerenderedAt:1711020860567}}("element","text","span","ct-786564","line","code","ct-45aa1d","","ct-b96a7c","p","pre","css",false,"To test if browser supports some #CSS rules, do following:","@supports (backdrop-filter: blur(5px)) {\n backdrop-filter: blur(5px);\n}\n","@mixin","@mixin can_backdrop {\n @supports (\n (-webkit-backdrop-filter: blur(5px)) or \n (backdrop-filter: blur(5px))\n ) {\n @content;\n }\n}\n","backdrop-filter",": ","blur","(","5","px","Test If Browser Supports CSS Rules","\u002Fcss\u002Ftest-if-browser-supports-css-rules","root","This ","code-inline"," will only apply rule if browser support backdrop filtering:","scss","@supports"," (","ct-86d011","ct-4cf4bf","ct-0a3d5b"," ","}"," "," (",2)) \ No newline at end of file diff --git a/docs/css/test-if-browser-supports-css-rules/index.html b/docs/css/test-if-browser-supports-css-rules/index.html index 7e0cda5..56b3219 100644 --- a/docs/css/test-if-browser-supports-css-rules/index.html +++ b/docs/css/test-if-browser-supports-css-rules/index.html @@ -1,6 +1,6 @@ -Test If Browser Supports CSS Rules • Obsidian Garden -

Test If Browser Supports CSS Rules

To test if browser supports some #CSS rules, do following:

@supports (backdrop-filter: blur(5px)) {    backdrop-filter: blur(5px);}

This @mixin will only apply rule if browser support backdrop filtering:

@mixin can_backdrop {  @supports (    (-webkit-backdrop-filter: blur(5px)) or     (backdrop-filter: blur(5px))  ) {    @content;  }}
btw, have a nice day
(2018 - 2024) muerwre
+

Test If Browser Supports CSS Rules

To test if browser supports some #CSS rules, do following:

@supports (backdrop-filter: blur(5px)) {    backdrop-filter: blur(5px);}

This @mixin will only apply rule if browser support backdrop filtering:

@mixin can_backdrop {  @supports (    (-webkit-backdrop-filter: blur(5px)) or     (backdrop-filter: blur(5px))  ) {    @content;  }}
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/docker/building-static-pages-with-docker/_payload.js b/docs/docker/building-static-pages-with-docker/_payload.js index a3263e2..e399068 100644 --- a/docs/docker/building-static-pages-with-docker/_payload.js +++ b/docs/docker/building-static-pages-with-docker/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:h,_path:i},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-QKxL2z8jga":{_path:i,_dir:"docker",_draft:d,_partial:d,_locale:"en",_empty:d,title:h,description:e,excerpt:{type:j,children:[{type:a,tag:k,props:{},children:[{type:b,value:e}]},{type:a,tag:c,props:{code:f,language:l},children:[{type:a,tag:m,props:{},children:[{type:a,tag:c,props:{__ignoreMap:g},children:[{type:b,value:f}]}]}]}]},body:{type:j,children:[{type:a,tag:k,props:{},children:[{type:b,value:e}]},{type:a,tag:c,props:{code:f,language:l},children:[{type:a,tag:m,props:{},children:[{type:a,tag:c,props:{__ignoreMap:g},children:[{type:a,tag:n,props:{class:"line"},children:[{type:a,tag:n,props:{},children:[{type:b,value:"FROM node:16-alpine as builder\nWORKDIR \u002Fapp\nCOPY package.json yarn.lock .\u002F\nRUN yarn\nCOPY . .\n\n# your generate command here\nRUN yarn generate\n\nFROM nginx\nCOPY --from=builder \u002Fapp\u002Fdist \u002Fusr\u002Fshare\u002Fnginx\u002Fhtml"}]}]}]}]}]}],toc:{title:g,searchDepth:o,depth:o,links:[]}},_type:"markdown",_id:"content:Docker:Building static pages with Docker.md",_source:"content",_file:"Docker\u002FBuilding static pages with Docker.md",_extension:"md"}},prerenderedAt:1711020226846}}("element","text","code",false,"Sample #Dockerfile for static Typescript builds such a #nextjs, #gatsby or #nuxt:","FROM node:16-alpine as builder\nWORKDIR \u002Fapp\nCOPY package.json yarn.lock .\u002F\nRUN yarn\nCOPY . .\n\n# your generate command here\nRUN yarn generate\n\nFROM nginx\nCOPY --from=builder \u002Fapp\u002Fdist \u002Fusr\u002Fshare\u002Fnginx\u002Fhtml\n","","Building Static Pages With Docker","\u002Fdocker\u002Fbuilding-static-pages-with-docker","root","p","Dockerfile","pre","span",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:h,_path:i},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-QKxL2z8jga":{_path:i,_dir:"docker",_draft:d,_partial:d,_locale:"en",_empty:d,title:h,description:e,excerpt:{type:j,children:[{type:a,tag:k,props:{},children:[{type:b,value:e}]},{type:a,tag:c,props:{code:f,language:l},children:[{type:a,tag:m,props:{},children:[{type:a,tag:c,props:{__ignoreMap:g},children:[{type:b,value:f}]}]}]}]},body:{type:j,children:[{type:a,tag:k,props:{},children:[{type:b,value:e}]},{type:a,tag:c,props:{code:f,language:l},children:[{type:a,tag:m,props:{},children:[{type:a,tag:c,props:{__ignoreMap:g},children:[{type:a,tag:n,props:{class:"line"},children:[{type:a,tag:n,props:{},children:[{type:b,value:"FROM node:16-alpine as builder\nWORKDIR \u002Fapp\nCOPY package.json yarn.lock .\u002F\nRUN yarn\nCOPY . .\n\n# your generate command here\nRUN yarn generate\n\nFROM nginx\nCOPY --from=builder \u002Fapp\u002Fdist \u002Fusr\u002Fshare\u002Fnginx\u002Fhtml"}]}]}]}]}]}],toc:{title:g,searchDepth:o,depth:o,links:[]}},_type:"markdown",_id:"content:Docker:Building static pages with Docker.md",_source:"content",_file:"Docker\u002FBuilding static pages with Docker.md",_extension:"md"}},prerenderedAt:1711020860620}}("element","text","code",false,"Sample #Dockerfile for static Typescript builds such a #nextjs, #gatsby or #nuxt:","FROM node:16-alpine as builder\nWORKDIR \u002Fapp\nCOPY package.json yarn.lock .\u002F\nRUN yarn\nCOPY . .\n\n# your generate command here\nRUN yarn generate\n\nFROM nginx\nCOPY --from=builder \u002Fapp\u002Fdist \u002Fusr\u002Fshare\u002Fnginx\u002Fhtml\n","","Building Static Pages With Docker","\u002Fdocker\u002Fbuilding-static-pages-with-docker","root","p","Dockerfile","pre","span",2)) \ No newline at end of file diff --git a/docs/docker/building-static-pages-with-docker/index.html b/docs/docker/building-static-pages-with-docker/index.html index ecd964f..4224599 100644 --- a/docs/docker/building-static-pages-with-docker/index.html +++ b/docs/docker/building-static-pages-with-docker/index.html @@ -1,6 +1,6 @@ -Building Static Pages With Docker • Obsidian Garden

Building Static Pages With Docker

Sample #Dockerfile for static Typescript builds such a #nextjs, #gatsby or #nuxt:

FROM node:16-alpine as builder
 WORKDIR /app
@@ -12,5 +12,5 @@ COPY . .
 RUN yarn generate
 
 FROM nginx
-COPY --from=builder /app/dist /usr/share/nginx/html
btw, have a nice day
(2018 - 2024) muerwre
+COPY --from=builder /app/dist /usr/share/nginx/html
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/docker/common-things-with-docker-mailserver/_payload.js b/docs/docker/common-things-with-docker-mailserver/_payload.js index 04767c2..9ed75e3 100644 --- a/docs/docker/common-things-with-docker-mailserver/_payload.js +++ b/docs/docker/common-things-with-docker-mailserver/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC,aD,aE,aF,aG,aH,aI,aJ,aK,aL,aM,aN,aO,aP,aQ,aR,aS,aT,aU,aV,aW,aX,aY,aZ,a_,a$,ba,bb,bc,bd,be){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:Y,_path:Z},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-8zleGIr63C":{_path:Z,_dir:"docker",_draft:D,_partial:D,_locale:"en",_empty:D,title:Y,description:i,excerpt:{type:_,children:[{type:a,tag:$,props:{id:E},children:[{type:b,value:F}]},{type:a,tag:e,props:{},children:[{type:b,value:aa},{type:a,tag:d,props:{},children:[{type:b,value:w}]},{type:b,value:j}]},{type:a,tag:f,props:{code:G},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:b,value:G}]}]}]},{type:a,tag:e,props:{},children:[{type:b,value:ab}]},{type:a,tag:m,props:{id:H},children:[{type:b,value:I}]},{type:a,tag:e,props:{},children:[{type:b,value:x},{type:a,tag:d,props:{},children:[{type:b,value:ac}]},{type:b,value:ad},{type:a,tag:d,props:{},children:[{type:b,value:y}]},{type:b,value:ae},{type:a,tag:d,props:{},children:[{type:b,value:w}]},{type:b,value:af},{type:a,tag:d,props:{},children:[{type:b,value:ag}]},{type:b,value:n}]},{type:a,tag:e,props:{},children:[{type:b,value:ah},{type:a,tag:d,props:{},children:[{type:b,value:ai}]},{type:b,value:aj},{type:a,tag:d,props:{},children:[{type:b,value:ak}]},{type:b,value:al},{type:a,tag:d,props:{},children:[{type:b,value:am}]}]},{type:a,tag:e,props:{},children:[{type:a,tag:o,props:{},children:[{type:b,value:z}]},{type:b,value:j}]},{type:a,tag:e,props:{},children:[{type:b,value:an}]},{type:a,tag:ao,props:{},children:[{type:a,tag:p,props:{},children:[{type:a,tag:d,props:{},children:[{type:b,value:ap}]}]},{type:a,tag:p,props:{},children:[{type:a,tag:d,props:{},children:[{type:b,value:aq}]}]},{type:a,tag:p,props:{},children:[{type:a,tag:d,props:{},children:[{type:b,value:ar}]}]}]},{type:a,tag:e,props:{},children:[{type:b,value:as},{type:a,tag:d,props:{},children:[{type:b,value:at}]},{type:b,value:au},{type:a,tag:d,props:{},children:[{type:b,value:av}]},{type:b,value:aw},{type:a,tag:d,props:{},children:[{type:b,value:y}]},{type:b,value:n}]},{type:a,tag:e,props:{},children:[{type:b,value:A},{type:a,tag:q,props:{href:ax,rel:[r]},children:[{type:b,value:B}]},{type:b,value:ay}]},{type:a,tag:m,props:{id:J},children:[{type:b,value:K}]},{type:a,tag:e,props:{},children:[{type:b,value:az},{type:a,tag:d,props:{},children:[{type:b,value:aA}]},{type:b,value:aB},{type:a,tag:d,props:{},children:[{type:b,value:L}]},{type:b,value:aC},{type:a,tag:d,props:{},children:[{type:b,value:aD}]},{type:b,value:n}]},{type:a,tag:e,props:{},children:[{type:a,tag:o,props:{},children:[{type:b,value:aE}]},{type:b,value:aF}]},{type:a,tag:m,props:{id:M},children:[{type:b,value:N}]},{type:a,tag:e,props:{},children:[{type:b,value:aG}]},{type:a,tag:f,props:{code:O,language:s},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:b,value:O}]}]}]},{type:a,tag:e,props:{},children:[{type:b,value:A},{type:a,tag:q,props:{href:aH,rel:[r]},children:[{type:b,value:B}]},{type:b,value:aI}]},{type:a,tag:m,props:{id:P},children:[{type:b,value:Q}]},{type:a,tag:e,props:{},children:[{type:b,value:aJ},{type:a,tag:d,props:{},children:[{type:b,value:aK}]},{type:b,value:aL},{type:a,tag:d,props:{},children:[{type:b,value:aM}]},{type:b,value:aN},{type:a,tag:d,props:{},children:[{type:b,value:aO}]},{type:b,value:aP},{type:a,tag:d,props:{},children:[{type:b,value:aQ}]},{type:b,value:n}]},{type:a,tag:f,props:{code:R,language:s},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:b,value:R}]}]}]},{type:a,tag:f,props:{code:S,language:s},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:b,value:S}]}]}]},{type:a,tag:m,props:{id:T},children:[{type:b,value:U}]},{type:a,tag:e,props:{},children:[{type:b,value:x},{type:a,tag:d,props:{},children:[{type:b,value:aR}]},{type:b,value:aS}]},{type:a,tag:f,props:{code:V},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:b,value:V}]}]}]},{type:a,tag:e,props:{},children:[{type:a,tag:o,props:{},children:[{type:b,value:z}]},{type:b,value:aT}]},{type:a,tag:f,props:{code:W},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:b,value:W}]}]}]},{type:a,tag:e,props:{},children:[{type:b,value:aU},{type:a,tag:d,props:{},children:[{type:b,value:aV}]},{type:b,value:aW},{type:a,tag:d,props:{},children:[{type:b,value:aX}]},{type:b,value:aY}]},{type:a,tag:e,props:{},children:[{type:b,value:aZ},{type:a,tag:q,props:{href:a_,rel:[r]},children:[{type:b,value:a$}]},{type:b,value:ba}]}]},body:{type:_,children:[{type:a,tag:$,props:{id:E},children:[{type:b,value:F}]},{type:a,tag:e,props:{},children:[{type:b,value:aa},{type:a,tag:d,props:{},children:[{type:b,value:w}]},{type:b,value:j}]},{type:a,tag:f,props:{code:G},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{},children:[{type:b,value:"TLS handshaking: SSL_accept() failed: error:14094412:SSL routines:ssl3_read_bytes:sslv3 alert bad certificate: SSL alert number 42"}]}]}]}]}]},{type:a,tag:e,props:{},children:[{type:b,value:ab}]},{type:a,tag:m,props:{id:H},children:[{type:b,value:I}]},{type:a,tag:e,props:{},children:[{type:b,value:x},{type:a,tag:d,props:{},children:[{type:b,value:ac}]},{type:b,value:ad},{type:a,tag:d,props:{},children:[{type:b,value:y}]},{type:b,value:ae},{type:a,tag:d,props:{},children:[{type:b,value:w}]},{type:b,value:af},{type:a,tag:d,props:{},children:[{type:b,value:ag}]},{type:b,value:n}]},{type:a,tag:e,props:{},children:[{type:b,value:ah},{type:a,tag:d,props:{},children:[{type:b,value:ai}]},{type:b,value:aj},{type:a,tag:d,props:{},children:[{type:b,value:ak}]},{type:b,value:al},{type:a,tag:d,props:{},children:[{type:b,value:am}]}]},{type:a,tag:e,props:{},children:[{type:a,tag:o,props:{},children:[{type:b,value:z}]},{type:b,value:j}]},{type:a,tag:e,props:{},children:[{type:b,value:an}]},{type:a,tag:ao,props:{},children:[{type:a,tag:p,props:{},children:[{type:a,tag:d,props:{},children:[{type:b,value:ap}]}]},{type:a,tag:p,props:{},children:[{type:a,tag:d,props:{},children:[{type:b,value:aq}]}]},{type:a,tag:p,props:{},children:[{type:a,tag:d,props:{},children:[{type:b,value:ar}]}]}]},{type:a,tag:e,props:{},children:[{type:b,value:as},{type:a,tag:d,props:{},children:[{type:b,value:at}]},{type:b,value:au},{type:a,tag:d,props:{},children:[{type:b,value:av}]},{type:b,value:aw},{type:a,tag:d,props:{},children:[{type:b,value:y}]},{type:b,value:n}]},{type:a,tag:e,props:{},children:[{type:b,value:A},{type:a,tag:q,props:{href:ax,rel:[r]},children:[{type:b,value:B}]},{type:b,value:ay}]},{type:a,tag:m,props:{id:J},children:[{type:b,value:K}]},{type:a,tag:e,props:{},children:[{type:b,value:az},{type:a,tag:d,props:{},children:[{type:b,value:aA}]},{type:b,value:aB},{type:a,tag:d,props:{},children:[{type:b,value:L}]},{type:b,value:aC},{type:a,tag:d,props:{},children:[{type:b,value:aD}]},{type:b,value:n}]},{type:a,tag:e,props:{},children:[{type:a,tag:o,props:{},children:[{type:b,value:aE}]},{type:b,value:aF}]},{type:a,tag:m,props:{id:M},children:[{type:b,value:N}]},{type:a,tag:e,props:{},children:[{type:b,value:aG}]},{type:a,tag:f,props:{code:O,language:s},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:u}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:"ports"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:bb}]},{type:a,tag:c,props:{class:t},children:[{type:b,value:"\"25:25\""}]}]}]}]}]},{type:a,tag:e,props:{},children:[{type:b,value:A},{type:a,tag:q,props:{href:aH,rel:[r]},children:[{type:b,value:B}]},{type:b,value:aI}]},{type:a,tag:m,props:{id:P},children:[{type:b,value:Q}]},{type:a,tag:e,props:{},children:[{type:b,value:aJ},{type:a,tag:d,props:{},children:[{type:b,value:aK}]},{type:b,value:aL},{type:a,tag:d,props:{},children:[{type:b,value:aM}]},{type:b,value:aN},{type:a,tag:d,props:{},children:[{type:b,value:aO}]},{type:b,value:aP},{type:a,tag:d,props:{},children:[{type:b,value:aQ}]},{type:b,value:n}]},{type:a,tag:f,props:{code:R,language:s},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:t},children:[{type:b,value:"\u002F\u002F application\u002Fcompose.yaml"}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:l},children:[{type:b,value:"app"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:u}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:C}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:bb}]},{type:a,tag:c,props:{class:t},children:[{type:b,value:bc}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:l},children:[{type:b,value:C}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:u}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:bc}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:bd}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:"driver"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:be}]},{type:a,tag:c,props:{class:t},children:[{type:b,value:"bridge"}]}]}]}]}]},{type:a,tag:f,props:{code:S,language:s},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:t},children:[{type:b,value:"\u002F\u002F\u002F mailserver\u002Fcompose.yaml"}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:l},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:u}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:C}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:" - "}]},{type:a,tag:c,props:{class:t},children:[{type:b,value:"\"application_shared\""}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:l},children:[{type:b,value:C}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:u}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:"application_shared"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:bd}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:"external"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:be}]},{type:a,tag:c,props:{class:"ct-ed00fb"},children:[{type:b,value:"true"}]}]}]}]}]},{type:a,tag:m,props:{id:T},children:[{type:b,value:U}]},{type:a,tag:e,props:{},children:[{type:b,value:x},{type:a,tag:d,props:{},children:[{type:b,value:aR}]},{type:b,value:aS}]},{type:a,tag:f,props:{code:V},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{},children:[{type:b,value:"mail._domainkey IN TXT ( \"v=DKIM1; h=sha256; k=rsa; \"\n \"p=sOmEJuNkLiKeRaNdOmOrLikeThat\"\n \"eVeNmOrERANdOmStuFf\" ) ; ----- DKIM key mail for example.com"}]}]}]}]}]},{type:a,tag:e,props:{},children:[{type:a,tag:o,props:{},children:[{type:b,value:z}]},{type:b,value:aT}]},{type:a,tag:f,props:{code:W},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{},children:[{type:b,value:"v=DKIM1; h=sha256; k=rsa; p=sOmEJuNkLiKeRaNdOmOrLikeThateVeNmOrERANdOmStuFf"}]}]}]}]}]},{type:a,tag:e,props:{},children:[{type:b,value:aU},{type:a,tag:d,props:{},children:[{type:b,value:aV}]},{type:b,value:aW},{type:a,tag:d,props:{},children:[{type:b,value:aX}]},{type:b,value:aY}]},{type:a,tag:e,props:{},children:[{type:b,value:aZ},{type:a,tag:q,props:{href:a_,rel:[r]},children:[{type:b,value:a$}]},{type:b,value:ba}]},{type:a,tag:"style",children:[{type:b,value:".ct-ed00fb{color:#79C0FF}.ct-b4fc78{color:#A5D6FF}.ct-a3d48f{color:#7EE787}.ct-28f9a0{color:#C9D1D9}.light .ct-28f9a0{color:#657B83}.light .ct-a3d48f{color:#268BD2}.light .ct-b4fc78{color:#2AA198}.light .ct-ed00fb{color:#B58900}"}]}],toc:{title:i,searchDepth:X,depth:X,links:[{id:E,depth:X,text:F,children:[{id:H,depth:v,text:I},{id:J,depth:v,text:K},{id:M,depth:v,text:N},{id:P,depth:v,text:Q},{id:T,depth:v,text:U}]}]}},_type:"markdown",_id:"content:Docker:Common things with docker-mailserver.md",_source:"content",_file:"Docker\u002FCommon things with docker-mailserver.md",_extension:"md"}},prerenderedAt:1711020226865}}("element","text","span","code-inline","p","code","ct-28f9a0","line","",":","pre","ct-a3d48f","h3",".","strong","li","a","nofollow","yaml","ct-b4fc78"," ",3,"letsencrypt","My ","example.com","SOLUTION","This ","ticket","networks",false,"1-docker-mailserver-ssl-alert-number-42","1. docker-mailserver SSL alert number 42","TLS handshaking: SSL_accept() failed: error:14094412:SSL routines:ssl3_read_bytes:sslv3 alert bad certificate: SSL alert number 42\n","11-letsencrypt-and-wildcard-domains","1.1. Letsencrypt and wildcard domains","12-docker-was-using-internal-hostname-of-docker-mailserver","1.2. Docker was using internal hostname of docker-mailserver","mail","2-docker-mailserver-not-listening-on-25-port-smtp","2. docker-mailserver not listening on 25 port (SMTP)"," ports:\n - \"25:25\"\n","3-connect-to-docker-mailserver-from-other-docker-compose","3. Connect to docker-mailserver from other docker-compose","\u002F\u002F application\u002Fcompose.yaml\napp:\n networks:\n - shared\nnetworks:\n shared:\n driver: bridge\n","\u002F\u002F\u002F mailserver\u002Fcompose.yaml\nmail:\n networks:\n - \"application_shared\"\nnetworks:\n application_shared:\n external: true\n","4-how-to-convert-dkim-mailtxt-to-dns-record","4. How to convert DKIM mail.txt to DNS record","mail._domainkey IN TXT ( \"v=DKIM1; h=sha256; k=rsa; \"\n \"p=sOmEJuNkLiKeRaNdOmOrLikeThat\"\n \"eVeNmOrERANdOmStuFf\" ) ; ----- DKIM key mail for example.com\n","v=DKIM1; h=sha256; k=rsa; p=sOmEJuNkLiKeRaNdOmOrLikeThateVeNmOrERANdOmStuFf\n",2,"Common Things With Docker Mailserver","\u002Fdocker\u002Fcommon-things-with-docker-mailserver","root","h2","I was getting following error after setting up TLS certificates in docker-mailserver after setting it up with ","The problem was caused by two reasons","MX"," domain was ",", bu "," have been set up with wildcard certificate on ","*.example.com","So, specifying ","SSL_MODE=letsencrypt"," made it searching for ","\u002Fetc\u002Fletsencrypt\u002Fmail.example.com",", when it was just ","\u002Fetc\u002Fletsencrypt\u002Fexample.com","Change .env file to:","ul","SSL_MODE=manual","SSL_KEY_PATH=\u002Fetc\u002Fletsencrypt\u002Fexample.com\u002Ffullchain.pem","SSL_KEY_PATH=\u002Fetc\u002Fletsencrypt\u002Fexample.com\u002Fprivkey.pem","Don't forget to modify ","docker-compose"," volumes and pass certs from host filesystem. Note: they're not ","mail.example.com",", they're just ","https:\u002F\u002Fgithub.com\u002Fdocker-mailserver\u002Fdocker-mailserver\u002Fissues\u002F1607"," describes it well.","Internal hostname for ","docker-mailserver"," was just ",", and other container tried to send emails to ","mail:25","SOLUTION:"," change internal hostname in your app settings to actual, specified in your certificates and MX record.","Solution was to add quotes in your docker compose, just like that:","https:\u002F\u002Fgithub.com\u002Fdocker-mailserver\u002Fdocker-mailserver\u002Fissues\u002F684#issuecomment-322029794"," solved it","I've had ","mailserver\u002Fcompose.yaml"," and ","application\u002Fcompose.yaml"," and needed to connect ","application"," to ","mailserver","mail.txt"," was like:",": concatenate all strings inside round brackets:","And add them as a ","TXT"," record on my DNS provider control panel under ","mail._domainkey"," record.","Solution was right in ","https:\u002F\u002Fdocker-mailserver.github.io\u002Fdocker-mailserver\u002Fedge\u002Fconfig\u002Fbest-practices\u002Fdkim_dmarc_spf\u002F#dkim-dns","official documentation",", just hidden a little bit."," - ","shared"," ",": ")) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC,aD,aE,aF,aG,aH,aI,aJ,aK,aL,aM,aN,aO,aP,aQ,aR,aS,aT,aU,aV,aW,aX,aY,aZ,a_,a$,ba,bb,bc,bd,be){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:Y,_path:Z},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-8zleGIr63C":{_path:Z,_dir:"docker",_draft:D,_partial:D,_locale:"en",_empty:D,title:Y,description:i,excerpt:{type:_,children:[{type:a,tag:$,props:{id:E},children:[{type:b,value:F}]},{type:a,tag:e,props:{},children:[{type:b,value:aa},{type:a,tag:d,props:{},children:[{type:b,value:w}]},{type:b,value:j}]},{type:a,tag:f,props:{code:G},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:b,value:G}]}]}]},{type:a,tag:e,props:{},children:[{type:b,value:ab}]},{type:a,tag:m,props:{id:H},children:[{type:b,value:I}]},{type:a,tag:e,props:{},children:[{type:b,value:x},{type:a,tag:d,props:{},children:[{type:b,value:ac}]},{type:b,value:ad},{type:a,tag:d,props:{},children:[{type:b,value:y}]},{type:b,value:ae},{type:a,tag:d,props:{},children:[{type:b,value:w}]},{type:b,value:af},{type:a,tag:d,props:{},children:[{type:b,value:ag}]},{type:b,value:n}]},{type:a,tag:e,props:{},children:[{type:b,value:ah},{type:a,tag:d,props:{},children:[{type:b,value:ai}]},{type:b,value:aj},{type:a,tag:d,props:{},children:[{type:b,value:ak}]},{type:b,value:al},{type:a,tag:d,props:{},children:[{type:b,value:am}]}]},{type:a,tag:e,props:{},children:[{type:a,tag:o,props:{},children:[{type:b,value:z}]},{type:b,value:j}]},{type:a,tag:e,props:{},children:[{type:b,value:an}]},{type:a,tag:ao,props:{},children:[{type:a,tag:p,props:{},children:[{type:a,tag:d,props:{},children:[{type:b,value:ap}]}]},{type:a,tag:p,props:{},children:[{type:a,tag:d,props:{},children:[{type:b,value:aq}]}]},{type:a,tag:p,props:{},children:[{type:a,tag:d,props:{},children:[{type:b,value:ar}]}]}]},{type:a,tag:e,props:{},children:[{type:b,value:as},{type:a,tag:d,props:{},children:[{type:b,value:at}]},{type:b,value:au},{type:a,tag:d,props:{},children:[{type:b,value:av}]},{type:b,value:aw},{type:a,tag:d,props:{},children:[{type:b,value:y}]},{type:b,value:n}]},{type:a,tag:e,props:{},children:[{type:b,value:A},{type:a,tag:q,props:{href:ax,rel:[r]},children:[{type:b,value:B}]},{type:b,value:ay}]},{type:a,tag:m,props:{id:J},children:[{type:b,value:K}]},{type:a,tag:e,props:{},children:[{type:b,value:az},{type:a,tag:d,props:{},children:[{type:b,value:aA}]},{type:b,value:aB},{type:a,tag:d,props:{},children:[{type:b,value:L}]},{type:b,value:aC},{type:a,tag:d,props:{},children:[{type:b,value:aD}]},{type:b,value:n}]},{type:a,tag:e,props:{},children:[{type:a,tag:o,props:{},children:[{type:b,value:aE}]},{type:b,value:aF}]},{type:a,tag:m,props:{id:M},children:[{type:b,value:N}]},{type:a,tag:e,props:{},children:[{type:b,value:aG}]},{type:a,tag:f,props:{code:O,language:s},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:b,value:O}]}]}]},{type:a,tag:e,props:{},children:[{type:b,value:A},{type:a,tag:q,props:{href:aH,rel:[r]},children:[{type:b,value:B}]},{type:b,value:aI}]},{type:a,tag:m,props:{id:P},children:[{type:b,value:Q}]},{type:a,tag:e,props:{},children:[{type:b,value:aJ},{type:a,tag:d,props:{},children:[{type:b,value:aK}]},{type:b,value:aL},{type:a,tag:d,props:{},children:[{type:b,value:aM}]},{type:b,value:aN},{type:a,tag:d,props:{},children:[{type:b,value:aO}]},{type:b,value:aP},{type:a,tag:d,props:{},children:[{type:b,value:aQ}]},{type:b,value:n}]},{type:a,tag:f,props:{code:R,language:s},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:b,value:R}]}]}]},{type:a,tag:f,props:{code:S,language:s},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:b,value:S}]}]}]},{type:a,tag:m,props:{id:T},children:[{type:b,value:U}]},{type:a,tag:e,props:{},children:[{type:b,value:x},{type:a,tag:d,props:{},children:[{type:b,value:aR}]},{type:b,value:aS}]},{type:a,tag:f,props:{code:V},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:b,value:V}]}]}]},{type:a,tag:e,props:{},children:[{type:a,tag:o,props:{},children:[{type:b,value:z}]},{type:b,value:aT}]},{type:a,tag:f,props:{code:W},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:b,value:W}]}]}]},{type:a,tag:e,props:{},children:[{type:b,value:aU},{type:a,tag:d,props:{},children:[{type:b,value:aV}]},{type:b,value:aW},{type:a,tag:d,props:{},children:[{type:b,value:aX}]},{type:b,value:aY}]},{type:a,tag:e,props:{},children:[{type:b,value:aZ},{type:a,tag:q,props:{href:a_,rel:[r]},children:[{type:b,value:a$}]},{type:b,value:ba}]}]},body:{type:_,children:[{type:a,tag:$,props:{id:E},children:[{type:b,value:F}]},{type:a,tag:e,props:{},children:[{type:b,value:aa},{type:a,tag:d,props:{},children:[{type:b,value:w}]},{type:b,value:j}]},{type:a,tag:f,props:{code:G},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{},children:[{type:b,value:"TLS handshaking: SSL_accept() failed: error:14094412:SSL routines:ssl3_read_bytes:sslv3 alert bad certificate: SSL alert number 42"}]}]}]}]}]},{type:a,tag:e,props:{},children:[{type:b,value:ab}]},{type:a,tag:m,props:{id:H},children:[{type:b,value:I}]},{type:a,tag:e,props:{},children:[{type:b,value:x},{type:a,tag:d,props:{},children:[{type:b,value:ac}]},{type:b,value:ad},{type:a,tag:d,props:{},children:[{type:b,value:y}]},{type:b,value:ae},{type:a,tag:d,props:{},children:[{type:b,value:w}]},{type:b,value:af},{type:a,tag:d,props:{},children:[{type:b,value:ag}]},{type:b,value:n}]},{type:a,tag:e,props:{},children:[{type:b,value:ah},{type:a,tag:d,props:{},children:[{type:b,value:ai}]},{type:b,value:aj},{type:a,tag:d,props:{},children:[{type:b,value:ak}]},{type:b,value:al},{type:a,tag:d,props:{},children:[{type:b,value:am}]}]},{type:a,tag:e,props:{},children:[{type:a,tag:o,props:{},children:[{type:b,value:z}]},{type:b,value:j}]},{type:a,tag:e,props:{},children:[{type:b,value:an}]},{type:a,tag:ao,props:{},children:[{type:a,tag:p,props:{},children:[{type:a,tag:d,props:{},children:[{type:b,value:ap}]}]},{type:a,tag:p,props:{},children:[{type:a,tag:d,props:{},children:[{type:b,value:aq}]}]},{type:a,tag:p,props:{},children:[{type:a,tag:d,props:{},children:[{type:b,value:ar}]}]}]},{type:a,tag:e,props:{},children:[{type:b,value:as},{type:a,tag:d,props:{},children:[{type:b,value:at}]},{type:b,value:au},{type:a,tag:d,props:{},children:[{type:b,value:av}]},{type:b,value:aw},{type:a,tag:d,props:{},children:[{type:b,value:y}]},{type:b,value:n}]},{type:a,tag:e,props:{},children:[{type:b,value:A},{type:a,tag:q,props:{href:ax,rel:[r]},children:[{type:b,value:B}]},{type:b,value:ay}]},{type:a,tag:m,props:{id:J},children:[{type:b,value:K}]},{type:a,tag:e,props:{},children:[{type:b,value:az},{type:a,tag:d,props:{},children:[{type:b,value:aA}]},{type:b,value:aB},{type:a,tag:d,props:{},children:[{type:b,value:L}]},{type:b,value:aC},{type:a,tag:d,props:{},children:[{type:b,value:aD}]},{type:b,value:n}]},{type:a,tag:e,props:{},children:[{type:a,tag:o,props:{},children:[{type:b,value:aE}]},{type:b,value:aF}]},{type:a,tag:m,props:{id:M},children:[{type:b,value:N}]},{type:a,tag:e,props:{},children:[{type:b,value:aG}]},{type:a,tag:f,props:{code:O,language:s},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:u}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:"ports"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:bb}]},{type:a,tag:c,props:{class:t},children:[{type:b,value:"\"25:25\""}]}]}]}]}]},{type:a,tag:e,props:{},children:[{type:b,value:A},{type:a,tag:q,props:{href:aH,rel:[r]},children:[{type:b,value:B}]},{type:b,value:aI}]},{type:a,tag:m,props:{id:P},children:[{type:b,value:Q}]},{type:a,tag:e,props:{},children:[{type:b,value:aJ},{type:a,tag:d,props:{},children:[{type:b,value:aK}]},{type:b,value:aL},{type:a,tag:d,props:{},children:[{type:b,value:aM}]},{type:b,value:aN},{type:a,tag:d,props:{},children:[{type:b,value:aO}]},{type:b,value:aP},{type:a,tag:d,props:{},children:[{type:b,value:aQ}]},{type:b,value:n}]},{type:a,tag:f,props:{code:R,language:s},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:t},children:[{type:b,value:"\u002F\u002F application\u002Fcompose.yaml"}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:l},children:[{type:b,value:"app"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:u}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:C}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:bb}]},{type:a,tag:c,props:{class:t},children:[{type:b,value:bc}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:l},children:[{type:b,value:C}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:u}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:bc}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:bd}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:"driver"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:be}]},{type:a,tag:c,props:{class:t},children:[{type:b,value:"bridge"}]}]}]}]}]},{type:a,tag:f,props:{code:S,language:s},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:t},children:[{type:b,value:"\u002F\u002F\u002F mailserver\u002Fcompose.yaml"}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:l},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:u}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:C}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:" - "}]},{type:a,tag:c,props:{class:t},children:[{type:b,value:"\"application_shared\""}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:l},children:[{type:b,value:C}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:u}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:"application_shared"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:bd}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:"external"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:be}]},{type:a,tag:c,props:{class:"ct-51eecb"},children:[{type:b,value:"true"}]}]}]}]}]},{type:a,tag:m,props:{id:T},children:[{type:b,value:U}]},{type:a,tag:e,props:{},children:[{type:b,value:x},{type:a,tag:d,props:{},children:[{type:b,value:aR}]},{type:b,value:aS}]},{type:a,tag:f,props:{code:V},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{},children:[{type:b,value:"mail._domainkey IN TXT ( \"v=DKIM1; h=sha256; k=rsa; \"\n \"p=sOmEJuNkLiKeRaNdOmOrLikeThat\"\n \"eVeNmOrERANdOmStuFf\" ) ; ----- DKIM key mail for example.com"}]}]}]}]}]},{type:a,tag:e,props:{},children:[{type:a,tag:o,props:{},children:[{type:b,value:z}]},{type:b,value:aT}]},{type:a,tag:f,props:{code:W},children:[{type:a,tag:k,props:{},children:[{type:a,tag:f,props:{__ignoreMap:i},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{},children:[{type:b,value:"v=DKIM1; h=sha256; k=rsa; p=sOmEJuNkLiKeRaNdOmOrLikeThateVeNmOrERANdOmStuFf"}]}]}]}]}]},{type:a,tag:e,props:{},children:[{type:b,value:aU},{type:a,tag:d,props:{},children:[{type:b,value:aV}]},{type:b,value:aW},{type:a,tag:d,props:{},children:[{type:b,value:aX}]},{type:b,value:aY}]},{type:a,tag:e,props:{},children:[{type:b,value:aZ},{type:a,tag:q,props:{href:a_,rel:[r]},children:[{type:b,value:a$}]},{type:b,value:ba}]},{type:a,tag:"style",children:[{type:b,value:".ct-51eecb{color:#79C0FF}.ct-f39305{color:#A5D6FF}.ct-0f60a1{color:#7EE787}.ct-0706b6{color:#C9D1D9}.light .ct-0706b6{color:#657B83}.light .ct-0f60a1{color:#268BD2}.light .ct-f39305{color:#2AA198}.light .ct-51eecb{color:#B58900}"}]}],toc:{title:i,searchDepth:X,depth:X,links:[{id:E,depth:X,text:F,children:[{id:H,depth:v,text:I},{id:J,depth:v,text:K},{id:M,depth:v,text:N},{id:P,depth:v,text:Q},{id:T,depth:v,text:U}]}]}},_type:"markdown",_id:"content:Docker:Common things with docker-mailserver.md",_source:"content",_file:"Docker\u002FCommon things with docker-mailserver.md",_extension:"md"}},prerenderedAt:1711020860645}}("element","text","span","code-inline","p","code","ct-0706b6","line","",":","pre","ct-0f60a1","h3",".","strong","li","a","nofollow","yaml","ct-f39305"," ",3,"letsencrypt","My ","example.com","SOLUTION","This ","ticket","networks",false,"1-docker-mailserver-ssl-alert-number-42","1. docker-mailserver SSL alert number 42","TLS handshaking: SSL_accept() failed: error:14094412:SSL routines:ssl3_read_bytes:sslv3 alert bad certificate: SSL alert number 42\n","11-letsencrypt-and-wildcard-domains","1.1. Letsencrypt and wildcard domains","12-docker-was-using-internal-hostname-of-docker-mailserver","1.2. Docker was using internal hostname of docker-mailserver","mail","2-docker-mailserver-not-listening-on-25-port-smtp","2. docker-mailserver not listening on 25 port (SMTP)"," ports:\n - \"25:25\"\n","3-connect-to-docker-mailserver-from-other-docker-compose","3. Connect to docker-mailserver from other docker-compose","\u002F\u002F application\u002Fcompose.yaml\napp:\n networks:\n - shared\nnetworks:\n shared:\n driver: bridge\n","\u002F\u002F\u002F mailserver\u002Fcompose.yaml\nmail:\n networks:\n - \"application_shared\"\nnetworks:\n application_shared:\n external: true\n","4-how-to-convert-dkim-mailtxt-to-dns-record","4. How to convert DKIM mail.txt to DNS record","mail._domainkey IN TXT ( \"v=DKIM1; h=sha256; k=rsa; \"\n \"p=sOmEJuNkLiKeRaNdOmOrLikeThat\"\n \"eVeNmOrERANdOmStuFf\" ) ; ----- DKIM key mail for example.com\n","v=DKIM1; h=sha256; k=rsa; p=sOmEJuNkLiKeRaNdOmOrLikeThateVeNmOrERANdOmStuFf\n",2,"Common Things With Docker Mailserver","\u002Fdocker\u002Fcommon-things-with-docker-mailserver","root","h2","I was getting following error after setting up TLS certificates in docker-mailserver after setting it up with ","The problem was caused by two reasons","MX"," domain was ",", bu "," have been set up with wildcard certificate on ","*.example.com","So, specifying ","SSL_MODE=letsencrypt"," made it searching for ","\u002Fetc\u002Fletsencrypt\u002Fmail.example.com",", when it was just ","\u002Fetc\u002Fletsencrypt\u002Fexample.com","Change .env file to:","ul","SSL_MODE=manual","SSL_KEY_PATH=\u002Fetc\u002Fletsencrypt\u002Fexample.com\u002Ffullchain.pem","SSL_KEY_PATH=\u002Fetc\u002Fletsencrypt\u002Fexample.com\u002Fprivkey.pem","Don't forget to modify ","docker-compose"," volumes and pass certs from host filesystem. Note: they're not ","mail.example.com",", they're just ","https:\u002F\u002Fgithub.com\u002Fdocker-mailserver\u002Fdocker-mailserver\u002Fissues\u002F1607"," describes it well.","Internal hostname for ","docker-mailserver"," was just ",", and other container tried to send emails to ","mail:25","SOLUTION:"," change internal hostname in your app settings to actual, specified in your certificates and MX record.","Solution was to add quotes in your docker compose, just like that:","https:\u002F\u002Fgithub.com\u002Fdocker-mailserver\u002Fdocker-mailserver\u002Fissues\u002F684#issuecomment-322029794"," solved it","I've had ","mailserver\u002Fcompose.yaml"," and ","application\u002Fcompose.yaml"," and needed to connect ","application"," to ","mailserver","mail.txt"," was like:",": concatenate all strings inside round brackets:","And add them as a ","TXT"," record on my DNS provider control panel under ","mail._domainkey"," record.","Solution was right in ","https:\u002F\u002Fdocker-mailserver.github.io\u002Fdocker-mailserver\u002Fedge\u002Fconfig\u002Fbest-practices\u002Fdkim_dmarc_spf\u002F#dkim-dns","official documentation",", just hidden a little bit."," - ","shared"," ",": ")) \ No newline at end of file diff --git a/docs/docker/common-things-with-docker-mailserver/index.html b/docs/docker/common-things-with-docker-mailserver/index.html index ca2db3b..fb4f38b 100644 --- a/docs/docker/common-things-with-docker-mailserver/index.html +++ b/docs/docker/common-things-with-docker-mailserver/index.html @@ -1,8 +1,8 @@ -Common Things With Docker Mailserver • Obsidian Garden -

Common Things With Docker Mailserver

1. docker-mailserver SSL alert number 42

I was getting following error after setting up TLS certificates in docker-mailserver after setting it up with letsencrypt:

TLS handshaking: SSL_accept() failed: error:14094412:SSL routines:ssl3_read_bytes:sslv3 alert bad certificate: SSL alert number 42

The problem was caused by two reasons

1.1. Letsencrypt and wildcard domains

My MX domain was example.com, bu letsencrypt have been set up with wildcard certificate on *.example.com.

So, specifying SSL_MODE=letsencrypt made it searching for /etc/letsencrypt/mail.example.com, when it was just /etc/letsencrypt/example.com

SOLUTION:

Change .env file to:

  • SSL_MODE=manual
  • SSL_KEY_PATH=/etc/letsencrypt/example.com/fullchain.pem
  • SSL_KEY_PATH=/etc/letsencrypt/example.com/privkey.pem

Don't forget to modify docker-compose volumes and pass certs from host filesystem. Note: they're not mail.example.com, they're just example.com.

This ticket describes it well.

1.2. Docker was using internal hostname of docker-mailserver

Internal hostname for docker-mailserver was just mail, and other container tried to send emails to mail:25.

SOLUTION: change internal hostname in your app settings to actual, specified in your certificates and MX record.

2. docker-mailserver not listening on 25 port (SMTP)

Solution was to add quotes in your docker compose, just like that:

  ports:    - "25:25"

This ticket solved it

3. Connect to docker-mailserver from other docker-compose

I've had mailserver/compose.yaml and application/compose.yaml and needed to connect application to mailserver.

// application/compose.yamlapp:  networks:    - sharednetworks:  shared:    driver: bridge
/// mailserver/compose.yamlmail:  networks:     - "application_shared"networks:  application_shared:    external: true

4. How to convert DKIM mail.txt to DNS record

My mail.txt was like:

mail._domainkey IN      TXT     ( "v=DKIM1; h=sha256; k=rsa; "
+

Common Things With Docker Mailserver

1. docker-mailserver SSL alert number 42

I was getting following error after setting up TLS certificates in docker-mailserver after setting it up with letsencrypt:

TLS handshaking: SSL_accept() failed: error:14094412:SSL routines:ssl3_read_bytes:sslv3 alert bad certificate: SSL alert number 42

The problem was caused by two reasons

1.1. Letsencrypt and wildcard domains

My MX domain was example.com, bu letsencrypt have been set up with wildcard certificate on *.example.com.

So, specifying SSL_MODE=letsencrypt made it searching for /etc/letsencrypt/mail.example.com, when it was just /etc/letsencrypt/example.com

SOLUTION:

Change .env file to:

  • SSL_MODE=manual
  • SSL_KEY_PATH=/etc/letsencrypt/example.com/fullchain.pem
  • SSL_KEY_PATH=/etc/letsencrypt/example.com/privkey.pem

Don't forget to modify docker-compose volumes and pass certs from host filesystem. Note: they're not mail.example.com, they're just example.com.

This ticket describes it well.

1.2. Docker was using internal hostname of docker-mailserver

Internal hostname for docker-mailserver was just mail, and other container tried to send emails to mail:25.

SOLUTION: change internal hostname in your app settings to actual, specified in your certificates and MX record.

2. docker-mailserver not listening on 25 port (SMTP)

Solution was to add quotes in your docker compose, just like that:

  ports:    - "25:25"

This ticket solved it

3. Connect to docker-mailserver from other docker-compose

I've had mailserver/compose.yaml and application/compose.yaml and needed to connect application to mailserver.

// application/compose.yamlapp:  networks:    - sharednetworks:  shared:    driver: bridge
/// mailserver/compose.yamlmail:  networks:     - "application_shared"networks:  application_shared:    external: true

4. How to convert DKIM mail.txt to DNS record

My mail.txt was like:

mail._domainkey IN      TXT     ( "v=DKIM1; h=sha256; k=rsa; "
           "p=sOmEJuNkLiKeRaNdOmOrLikeThat"
-          "eVeNmOrERANdOmStuFf" )  ; ----- DKIM key mail for example.com

SOLUTION: concatenate all strings inside round brackets:

v=DKIM1; h=sha256; k=rsa; p=sOmEJuNkLiKeRaNdOmOrLikeThateVeNmOrERANdOmStuFf

And add them as a TXT record on my DNS provider control panel under mail._domainkey record.

Solution was right in official documentation, just hidden a little bit.

btw, have a nice day
(2018 - 2024) muerwre
+ "eVeNmOrERANdOmStuFf" ) ; ----- DKIM key mail for example.com

SOLUTION: concatenate all strings inside round brackets:

v=DKIM1; h=sha256; k=rsa; p=sOmEJuNkLiKeRaNdOmOrLikeThateVeNmOrERANdOmStuFf

And add them as a TXT record on my DNS provider control panel under mail._domainkey record.

Solution was right in official documentation, just hidden a little bit.

btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/docker/drone-ci/_payload.js b/docs/docker/drone-ci/_payload.js index 331b9d8..cc5df42 100644 --- a/docs/docker/drone-ci/_payload.js +++ b/docs/docker/drone-ci/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC,aD,aE,aF,aG,aH,aI,aJ,aK,aL,aM,aN,aO,aP,aQ,aR,aS){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:_,_path:$},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-uFdiCIitkN":{_path:$,_dir:aa,_draft:F,_partial:F,_locale:"en",_empty:F,title:_,description:"Can be used with Private docker registry to deploy things using #docker.",excerpt:{type:ab,children:[{type:a,tag:n,props:{},children:[{type:b,value:ac},{type:a,tag:q,props:{href:w},children:[{type:b,value:ad}]},{type:b,value:ae}]},{type:a,tag:o,props:{id:G},children:[{type:b,value:H}]},{type:a,tag:n,props:{},children:[{type:b,value:af},{type:a,tag:h,props:{},children:[{type:b,value:I}]},{type:b,value:u},{type:a,tag:h,props:{},children:[{type:b,value:J}]},{type:b,value:u},{type:a,tag:h,props:{},children:[{type:b,value:K}]},{type:b,value:ag},{type:a,tag:ah,props:{},children:[{type:b,value:v}]},{type:b,value:ai},{type:a,tag:h,props:{},children:[{type:b,value:L}]},{type:b,value:aj},{type:a,tag:h,props:{},children:[{type:b,value:ak}]},{type:b,value:x}]},{type:a,tag:n,props:{},children:[{type:b,value:al},{type:a,tag:h,props:{},children:[{type:b,value:am}]},{type:b,value:an},{type:a,tag:q,props:{href:w},children:[{type:b,value:ao}]},{type:b,value:i}]},{type:a,tag:k,props:{code:M,language:y},children:[{type:a,tag:r,props:{},children:[{type:a,tag:k,props:{__ignoreMap:p},children:[{type:b,value:M}]}]}]},{type:a,tag:o,props:{id:N},children:[{type:b,value:O}]},{type:a,tag:n,props:{},children:[{type:b,value:ap},{type:a,tag:h,props:{},children:[{type:b,value:v}]},{type:b,value:aq},{type:a,tag:h,props:{},children:[{type:b,value:P}]},{type:b,value:ar}]},{type:a,tag:n,props:{},children:[{type:b,value:as},{type:a,tag:h,props:{},children:[{type:b,value:at}]},{type:b,value:u},{type:a,tag:h,props:{},children:[{type:b,value:au}]},{type:b,value:av},{type:a,tag:h,props:{},children:[{type:b,value:aw}]},{type:b,value:ax}]},{type:a,tag:k,props:{code:Q,language:y},children:[{type:a,tag:r,props:{},children:[{type:a,tag:k,props:{__ignoreMap:p},children:[{type:b,value:Q}]}]}]},{type:a,tag:o,props:{id:R},children:[{type:b,value:S}]},{type:a,tag:n,props:{},children:[{type:b,value:ay},{type:a,tag:q,props:{href:az,rel:[z]},children:[{type:b,value:aA}]},{type:b,value:aB},{type:a,tag:q,props:{href:aC,rel:[z]},children:[{type:b,value:aD}]},{type:b,value:aE}]},{type:a,tag:o,props:{id:T},children:[{type:b,value:U}]},{type:a,tag:k,props:{code:V,language:A},children:[{type:a,tag:r,props:{},children:[{type:a,tag:k,props:{__ignoreMap:p},children:[{type:b,value:V}]}]}]},{type:a,tag:o,props:{id:W},children:[{type:b,value:X}]},{type:a,tag:n,props:{},children:[{type:b,value:aF},{type:a,tag:h,props:{},children:[{type:b,value:B}]},{type:b,value:x}]},{type:a,tag:k,props:{code:Y,language:A},children:[{type:a,tag:r,props:{},children:[{type:a,tag:k,props:{__ignoreMap:p},children:[{type:b,value:Y}]}]}]}]},body:{type:ab,children:[{type:a,tag:n,props:{},children:[{type:b,value:ac},{type:a,tag:q,props:{href:w},children:[{type:b,value:ad}]},{type:b,value:ae}]},{type:a,tag:o,props:{id:G},children:[{type:b,value:H}]},{type:a,tag:n,props:{},children:[{type:b,value:af},{type:a,tag:h,props:{},children:[{type:b,value:I}]},{type:b,value:u},{type:a,tag:h,props:{},children:[{type:b,value:J}]},{type:b,value:u},{type:a,tag:h,props:{},children:[{type:b,value:K}]},{type:b,value:ag},{type:a,tag:ah,props:{},children:[{type:b,value:v}]},{type:b,value:ai},{type:a,tag:h,props:{},children:[{type:b,value:L}]},{type:b,value:aj},{type:a,tag:h,props:{},children:[{type:b,value:ak}]},{type:b,value:x}]},{type:a,tag:n,props:{},children:[{type:b,value:al},{type:a,tag:h,props:{},children:[{type:b,value:am}]},{type:b,value:an},{type:a,tag:q,props:{href:w},children:[{type:b,value:ao}]},{type:b,value:i}]},{type:a,tag:k,props:{code:M,language:y},children:[{type:a,tag:r,props:{},children:[{type:a,tag:k,props:{__ignoreMap:p},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"kind"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"pipeline"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:aG}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"build"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"type"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:aa}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"platform"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:C}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"os"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"linux"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:C}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"arch"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"amd64"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"steps"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" - "}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:aG}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"build-master"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:Z}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"plugins\u002Fdocker"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"when"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"branch"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:aH}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"master"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"settings"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"dockerfile"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"Dockerfile"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"tag"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:aH}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"${DRONE_BRANCH}"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"username"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:D}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:I}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"password"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:D}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:J}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"registry"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:D}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:K}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"repo"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:D}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:L}]}]}]}]}]},{type:a,tag:o,props:{id:N},children:[{type:b,value:O}]},{type:a,tag:n,props:{},children:[{type:b,value:ap},{type:a,tag:h,props:{},children:[{type:b,value:v}]},{type:b,value:aq},{type:a,tag:h,props:{},children:[{type:b,value:P}]},{type:b,value:ar}]},{type:a,tag:n,props:{},children:[{type:b,value:as},{type:a,tag:h,props:{},children:[{type:b,value:at}]},{type:b,value:u},{type:a,tag:h,props:{},children:[{type:b,value:au}]},{type:b,value:av},{type:a,tag:h,props:{},children:[{type:b,value:aw}]},{type:b,value:ax}]},{type:a,tag:k,props:{code:Q,language:y},children:[{type:a,tag:r,props:{},children:[{type:a,tag:k,props:{__ignoreMap:p},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"version"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"3\""}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"services"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:C}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:aI}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:v}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:Z}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"drone\u002Fdrone:latest"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:aJ}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"DRONE_GITHUB_CLIENT_ID=secret_id"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"DRONE_GITHUB_CLIENT_SECRET=client_secret"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:aK}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"DRONE_SERVER_HOST=drone.url"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"DRONE_USER_CREATE=\"username:user,admin:true\""}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"DRONE_SERVER_PROTO=https"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"DRONE_TLS_AUTOCERT=false"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"DRONE_GIT_ALWAYS_AUTH=false"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"DRONE_LOGS_DEBUG=true"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"DRONE_LOGS_TRACE=true"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:aL}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:aM}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:aN}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:".\u002Fdata:\u002Fdata"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"ports"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"8090:80"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:C}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:P}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:aI}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"drone__agent"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:Z}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"drone\u002Fagent:latest"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"command"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"agent"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:aL}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:aM}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:aN}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\u002Fvar\u002Frun\u002Fdocker.sock:\u002Fvar\u002Frun\u002Fdocker.sock"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:aJ}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"DRONE_RPC_SERVER=https:\u002F\u002Fdrone.url"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:aK}]}]}]}]}]},{type:a,tag:o,props:{id:R},children:[{type:b,value:S}]},{type:a,tag:n,props:{},children:[{type:b,value:ay},{type:a,tag:q,props:{href:az,rel:[z]},children:[{type:b,value:aA}]},{type:b,value:aB},{type:a,tag:q,props:{href:aC,rel:[z]},children:[{type:b,value:aD}]},{type:b,value:aE}]},{type:a,tag:o,props:{id:T},children:[{type:b,value:U}]},{type:a,tag:k,props:{code:V,language:A},children:[{type:a,tag:r,props:{},children:[{type:a,tag:k,props:{__ignoreMap:p},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:aO},children:[{type:b,value:aP}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" DRONE_SERVER=https:\u002F\u002Fdrone.url"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:aO},children:[{type:b,value:aP}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" DRONE_TOKEN=password"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"drone info"}]}]}]}]}]},{type:a,tag:o,props:{id:W},children:[{type:b,value:X}]},{type:a,tag:n,props:{},children:[{type:b,value:aF},{type:a,tag:h,props:{},children:[{type:b,value:B}]},{type:b,value:x}]},{type:a,tag:k,props:{code:Y,language:A},children:[{type:a,tag:r,props:{},children:[{type:a,tag:k,props:{__ignoreMap:p},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"drone repo update "}]},{type:a,tag:c,props:{class:aQ},children:[{type:b,value:aR}]},{type:a,tag:c,props:{class:aS},children:[{type:b,value:B}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" --trusted=true "}]},{type:a,tag:c,props:{class:"ct-f84443"},children:[{type:b,value:"&&"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" drone repo info "}]},{type:a,tag:c,props:{class:aQ},children:[{type:b,value:aR}]},{type:a,tag:c,props:{class:aS},children:[{type:b,value:B}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-f84443{color:#FF7B72}.ct-327cdc{color:#C9D1D9}.ct-3cdac0{color:#C9D1D9}.ct-18f58a{color:#FF7B72}.ct-dd39ce{color:#A5D6FF}.ct-f2462a{color:#C9D1D9}.ct-2411f6{color:#7EE787}.light .ct-2411f6{color:#268BD2}.light .ct-f2462a{color:#657B83}.light .ct-dd39ce{color:#2AA198}.light .ct-18f58a{color:#073642}.light .ct-3cdac0{color:#859900}.light .ct-327cdc{color:#268BD2}.light .ct-f84443{color:#859900}"}]}],toc:{title:p,searchDepth:t,depth:t,links:[{id:G,depth:t,text:H},{id:N,depth:t,text:O},{id:R,depth:t,text:S},{id:T,depth:t,text:U},{id:W,depth:t,text:X}]}},_type:"markdown",_id:"content:Docker:Drone-ci.md",_source:"content",_file:"Docker\u002FDrone-ci.md",_extension:"md"}},prerenderedAt:1711020226898}}("element","text","span","ct-f2462a","line","ct-2411f6","ct-dd39ce","code-inline",":",": ","code"," "," - ","p","h2","","a","pre"," ",2,", ","drone","Private%20docker%20registry",".","yaml","nofollow","shell","1"," "," ","from_secret",false,"pushing-to-private-docker_registry","Pushing to private docker_registry","global_docker_login","global_docker_password","global_docker_registry","docker_repo","kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build-master\n image: plugins\u002Fdocker\n when:\n branch:\n - master\n settings:\n dockerfile: Dockerfile\n tag:\n - ${DRONE_BRANCH}\n username:\n from_secret: global_docker_login\n password:\n from_secret: global_docker_password\n registry:\n from_secret: global_docker_registry\n repo:\n from_secret: docker_repo\n","docker-compose-file-for-drone-ci","Docker-compose file for drone-ci","drone-agent","version: \"3\"\n\nservices:\n drone:\n container_name: drone\n image: drone\u002Fdrone:latest\n environment:\n - DRONE_GITHUB_CLIENT_ID=secret_id\n - DRONE_GITHUB_CLIENT_SECRET=client_secret\n - DRONE_RPC_SECRET=rpc_secret\n - DRONE_SERVER_HOST=drone.url\n - DRONE_USER_CREATE=\"username:user,admin:true\"\n - DRONE_SERVER_PROTO=https\n - DRONE_TLS_AUTOCERT=false\n - DRONE_GIT_ALWAYS_AUTH=false\n - DRONE_LOGS_DEBUG=true\n - DRONE_LOGS_TRACE=true\n restart: always\n volumes:\n - .\u002Fdata:\u002Fdata\n ports:\n - 8090:80\n drone-agent:\n container_name: drone__agent\n image: drone\u002Fagent:latest\n command: agent\n restart: always\n volumes:\n - \u002Fvar\u002Frun\u002Fdocker.sock:\u002Fvar\u002Frun\u002Fdocker.sock\n environment:\n - DRONE_RPC_SERVER=https:\u002F\u002Fdrone.url\n - DRONE_RPC_SECRET=rpc_secret\n","caching-builds","Caching builds","get-user-info","Get user info","export DRONE_SERVER=https:\u002F\u002Fdrone.url\nexport DRONE_TOKEN=password\ndrone info\n","mark-user-as-trusted","Mark user as trusted","drone repo update $1 --trusted=true && drone repo info $1\n","image","Drone Ci","\u002Fdocker\u002Fdrone-ci","docker","root","Can be used with ","Private docker registry"," to deploy things using #docker.","You should specify "," organizations variables in your ","strong",". And "," variable for your repo as ","docker.yourdomain.com\u002Fyour-image","This is example of ",".droneci"," for ","private docker registry","The "," service is ui itself and "," is runner for builds, that can be started on different machine (or machines).","Change ","secret_id","rpc_secret"," and ","drone.url"," to something you like.","Haven't checked that yet, but there's a ","https:\u002F\u002Flaszlo.cloud\u002Fthe-ultimate-droneci-caching-guide","manual"," from ","https:\u002F\u002Flaszlo.cloud\u002F","Laszlo Fogas"," about that.","Sometimes it won't help, then connect to drone database with sqlite and change user's trusted flag to ","name"," - ","container_name","environment","DRONE_RPC_SECRET=rpc_secret","restart","always","volumes","ct-18f58a","export","ct-3cdac0","$","ct-327cdc")) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC,aD,aE,aF,aG,aH,aI,aJ,aK,aL,aM,aN,aO,aP,aQ,aR,aS){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:_,_path:$},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-uFdiCIitkN":{_path:$,_dir:aa,_draft:F,_partial:F,_locale:"en",_empty:F,title:_,description:"Can be used with Private docker registry to deploy things using #docker.",excerpt:{type:ab,children:[{type:a,tag:n,props:{},children:[{type:b,value:ac},{type:a,tag:q,props:{href:w},children:[{type:b,value:ad}]},{type:b,value:ae}]},{type:a,tag:o,props:{id:G},children:[{type:b,value:H}]},{type:a,tag:n,props:{},children:[{type:b,value:af},{type:a,tag:h,props:{},children:[{type:b,value:I}]},{type:b,value:u},{type:a,tag:h,props:{},children:[{type:b,value:J}]},{type:b,value:u},{type:a,tag:h,props:{},children:[{type:b,value:K}]},{type:b,value:ag},{type:a,tag:ah,props:{},children:[{type:b,value:v}]},{type:b,value:ai},{type:a,tag:h,props:{},children:[{type:b,value:L}]},{type:b,value:aj},{type:a,tag:h,props:{},children:[{type:b,value:ak}]},{type:b,value:x}]},{type:a,tag:n,props:{},children:[{type:b,value:al},{type:a,tag:h,props:{},children:[{type:b,value:am}]},{type:b,value:an},{type:a,tag:q,props:{href:w},children:[{type:b,value:ao}]},{type:b,value:i}]},{type:a,tag:k,props:{code:M,language:y},children:[{type:a,tag:r,props:{},children:[{type:a,tag:k,props:{__ignoreMap:p},children:[{type:b,value:M}]}]}]},{type:a,tag:o,props:{id:N},children:[{type:b,value:O}]},{type:a,tag:n,props:{},children:[{type:b,value:ap},{type:a,tag:h,props:{},children:[{type:b,value:v}]},{type:b,value:aq},{type:a,tag:h,props:{},children:[{type:b,value:P}]},{type:b,value:ar}]},{type:a,tag:n,props:{},children:[{type:b,value:as},{type:a,tag:h,props:{},children:[{type:b,value:at}]},{type:b,value:u},{type:a,tag:h,props:{},children:[{type:b,value:au}]},{type:b,value:av},{type:a,tag:h,props:{},children:[{type:b,value:aw}]},{type:b,value:ax}]},{type:a,tag:k,props:{code:Q,language:y},children:[{type:a,tag:r,props:{},children:[{type:a,tag:k,props:{__ignoreMap:p},children:[{type:b,value:Q}]}]}]},{type:a,tag:o,props:{id:R},children:[{type:b,value:S}]},{type:a,tag:n,props:{},children:[{type:b,value:ay},{type:a,tag:q,props:{href:az,rel:[z]},children:[{type:b,value:aA}]},{type:b,value:aB},{type:a,tag:q,props:{href:aC,rel:[z]},children:[{type:b,value:aD}]},{type:b,value:aE}]},{type:a,tag:o,props:{id:T},children:[{type:b,value:U}]},{type:a,tag:k,props:{code:V,language:A},children:[{type:a,tag:r,props:{},children:[{type:a,tag:k,props:{__ignoreMap:p},children:[{type:b,value:V}]}]}]},{type:a,tag:o,props:{id:W},children:[{type:b,value:X}]},{type:a,tag:n,props:{},children:[{type:b,value:aF},{type:a,tag:h,props:{},children:[{type:b,value:B}]},{type:b,value:x}]},{type:a,tag:k,props:{code:Y,language:A},children:[{type:a,tag:r,props:{},children:[{type:a,tag:k,props:{__ignoreMap:p},children:[{type:b,value:Y}]}]}]}]},body:{type:ab,children:[{type:a,tag:n,props:{},children:[{type:b,value:ac},{type:a,tag:q,props:{href:w},children:[{type:b,value:ad}]},{type:b,value:ae}]},{type:a,tag:o,props:{id:G},children:[{type:b,value:H}]},{type:a,tag:n,props:{},children:[{type:b,value:af},{type:a,tag:h,props:{},children:[{type:b,value:I}]},{type:b,value:u},{type:a,tag:h,props:{},children:[{type:b,value:J}]},{type:b,value:u},{type:a,tag:h,props:{},children:[{type:b,value:K}]},{type:b,value:ag},{type:a,tag:ah,props:{},children:[{type:b,value:v}]},{type:b,value:ai},{type:a,tag:h,props:{},children:[{type:b,value:L}]},{type:b,value:aj},{type:a,tag:h,props:{},children:[{type:b,value:ak}]},{type:b,value:x}]},{type:a,tag:n,props:{},children:[{type:b,value:al},{type:a,tag:h,props:{},children:[{type:b,value:am}]},{type:b,value:an},{type:a,tag:q,props:{href:w},children:[{type:b,value:ao}]},{type:b,value:i}]},{type:a,tag:k,props:{code:M,language:y},children:[{type:a,tag:r,props:{},children:[{type:a,tag:k,props:{__ignoreMap:p},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"kind"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"pipeline"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:aG}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"build"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"type"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:aa}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"platform"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:C}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"os"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"linux"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:C}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"arch"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"amd64"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"steps"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" - "}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:aG}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"build-master"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:Z}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"plugins\u002Fdocker"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"when"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"branch"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:aH}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"master"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"settings"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"dockerfile"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"Dockerfile"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"tag"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:aH}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"${DRONE_BRANCH}"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"username"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:D}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:I}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"password"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:D}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:J}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"registry"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:D}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:K}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"repo"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:D}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:L}]}]}]}]}]},{type:a,tag:o,props:{id:N},children:[{type:b,value:O}]},{type:a,tag:n,props:{},children:[{type:b,value:ap},{type:a,tag:h,props:{},children:[{type:b,value:v}]},{type:b,value:aq},{type:a,tag:h,props:{},children:[{type:b,value:P}]},{type:b,value:ar}]},{type:a,tag:n,props:{},children:[{type:b,value:as},{type:a,tag:h,props:{},children:[{type:b,value:at}]},{type:b,value:u},{type:a,tag:h,props:{},children:[{type:b,value:au}]},{type:b,value:av},{type:a,tag:h,props:{},children:[{type:b,value:aw}]},{type:b,value:ax}]},{type:a,tag:k,props:{code:Q,language:y},children:[{type:a,tag:r,props:{},children:[{type:a,tag:k,props:{__ignoreMap:p},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"version"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"3\""}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"services"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:C}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:aI}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:v}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:Z}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"drone\u002Fdrone:latest"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:aJ}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"DRONE_GITHUB_CLIENT_ID=secret_id"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"DRONE_GITHUB_CLIENT_SECRET=client_secret"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:aK}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"DRONE_SERVER_HOST=drone.url"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"DRONE_USER_CREATE=\"username:user,admin:true\""}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"DRONE_SERVER_PROTO=https"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"DRONE_TLS_AUTOCERT=false"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"DRONE_GIT_ALWAYS_AUTH=false"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"DRONE_LOGS_DEBUG=true"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"DRONE_LOGS_TRACE=true"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:aL}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:aM}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:aN}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:".\u002Fdata:\u002Fdata"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"ports"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"8090:80"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:C}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:P}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:aI}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"drone__agent"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:Z}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"drone\u002Fagent:latest"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"command"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"agent"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:aL}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:aM}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:aN}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\u002Fvar\u002Frun\u002Fdocker.sock:\u002Fvar\u002Frun\u002Fdocker.sock"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:aJ}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"DRONE_RPC_SERVER=https:\u002F\u002Fdrone.url"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:aK}]}]}]}]}]},{type:a,tag:o,props:{id:R},children:[{type:b,value:S}]},{type:a,tag:n,props:{},children:[{type:b,value:ay},{type:a,tag:q,props:{href:az,rel:[z]},children:[{type:b,value:aA}]},{type:b,value:aB},{type:a,tag:q,props:{href:aC,rel:[z]},children:[{type:b,value:aD}]},{type:b,value:aE}]},{type:a,tag:o,props:{id:T},children:[{type:b,value:U}]},{type:a,tag:k,props:{code:V,language:A},children:[{type:a,tag:r,props:{},children:[{type:a,tag:k,props:{__ignoreMap:p},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:aO},children:[{type:b,value:aP}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" DRONE_SERVER=https:\u002F\u002Fdrone.url"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:aO},children:[{type:b,value:aP}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" DRONE_TOKEN=password"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"drone info"}]}]}]}]}]},{type:a,tag:o,props:{id:W},children:[{type:b,value:X}]},{type:a,tag:n,props:{},children:[{type:b,value:aF},{type:a,tag:h,props:{},children:[{type:b,value:B}]},{type:b,value:x}]},{type:a,tag:k,props:{code:Y,language:A},children:[{type:a,tag:r,props:{},children:[{type:a,tag:k,props:{__ignoreMap:p},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"drone repo update "}]},{type:a,tag:c,props:{class:aQ},children:[{type:b,value:aR}]},{type:a,tag:c,props:{class:aS},children:[{type:b,value:B}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" --trusted=true "}]},{type:a,tag:c,props:{class:"ct-303659"},children:[{type:b,value:"&&"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" drone repo info "}]},{type:a,tag:c,props:{class:aQ},children:[{type:b,value:aR}]},{type:a,tag:c,props:{class:aS},children:[{type:b,value:B}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-303659{color:#FF7B72}.ct-55c6c3{color:#C9D1D9}.ct-9f67ad{color:#C9D1D9}.ct-0734fc{color:#FF7B72}.ct-404a3d{color:#A5D6FF}.ct-2da089{color:#C9D1D9}.ct-d1fd60{color:#7EE787}.light .ct-d1fd60{color:#268BD2}.light .ct-2da089{color:#657B83}.light .ct-404a3d{color:#2AA198}.light .ct-0734fc{color:#073642}.light .ct-9f67ad{color:#859900}.light .ct-55c6c3{color:#268BD2}.light .ct-303659{color:#859900}"}]}],toc:{title:p,searchDepth:t,depth:t,links:[{id:G,depth:t,text:H},{id:N,depth:t,text:O},{id:R,depth:t,text:S},{id:T,depth:t,text:U},{id:W,depth:t,text:X}]}},_type:"markdown",_id:"content:Docker:Drone-ci.md",_source:"content",_file:"Docker\u002FDrone-ci.md",_extension:"md"}},prerenderedAt:1711020860701}}("element","text","span","ct-2da089","line","ct-d1fd60","ct-404a3d","code-inline",":",": ","code"," "," - ","p","h2","","a","pre"," ",2,", ","drone","Private%20docker%20registry",".","yaml","nofollow","shell","1"," "," ","from_secret",false,"pushing-to-private-docker_registry","Pushing to private docker_registry","global_docker_login","global_docker_password","global_docker_registry","docker_repo","kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build-master\n image: plugins\u002Fdocker\n when:\n branch:\n - master\n settings:\n dockerfile: Dockerfile\n tag:\n - ${DRONE_BRANCH}\n username:\n from_secret: global_docker_login\n password:\n from_secret: global_docker_password\n registry:\n from_secret: global_docker_registry\n repo:\n from_secret: docker_repo\n","docker-compose-file-for-drone-ci","Docker-compose file for drone-ci","drone-agent","version: \"3\"\n\nservices:\n drone:\n container_name: drone\n image: drone\u002Fdrone:latest\n environment:\n - DRONE_GITHUB_CLIENT_ID=secret_id\n - DRONE_GITHUB_CLIENT_SECRET=client_secret\n - DRONE_RPC_SECRET=rpc_secret\n - DRONE_SERVER_HOST=drone.url\n - DRONE_USER_CREATE=\"username:user,admin:true\"\n - DRONE_SERVER_PROTO=https\n - DRONE_TLS_AUTOCERT=false\n - DRONE_GIT_ALWAYS_AUTH=false\n - DRONE_LOGS_DEBUG=true\n - DRONE_LOGS_TRACE=true\n restart: always\n volumes:\n - .\u002Fdata:\u002Fdata\n ports:\n - 8090:80\n drone-agent:\n container_name: drone__agent\n image: drone\u002Fagent:latest\n command: agent\n restart: always\n volumes:\n - \u002Fvar\u002Frun\u002Fdocker.sock:\u002Fvar\u002Frun\u002Fdocker.sock\n environment:\n - DRONE_RPC_SERVER=https:\u002F\u002Fdrone.url\n - DRONE_RPC_SECRET=rpc_secret\n","caching-builds","Caching builds","get-user-info","Get user info","export DRONE_SERVER=https:\u002F\u002Fdrone.url\nexport DRONE_TOKEN=password\ndrone info\n","mark-user-as-trusted","Mark user as trusted","drone repo update $1 --trusted=true && drone repo info $1\n","image","Drone Ci","\u002Fdocker\u002Fdrone-ci","docker","root","Can be used with ","Private docker registry"," to deploy things using #docker.","You should specify "," organizations variables in your ","strong",". And "," variable for your repo as ","docker.yourdomain.com\u002Fyour-image","This is example of ",".droneci"," for ","private docker registry","The "," service is ui itself and "," is runner for builds, that can be started on different machine (or machines).","Change ","secret_id","rpc_secret"," and ","drone.url"," to something you like.","Haven't checked that yet, but there's a ","https:\u002F\u002Flaszlo.cloud\u002Fthe-ultimate-droneci-caching-guide","manual"," from ","https:\u002F\u002Flaszlo.cloud\u002F","Laszlo Fogas"," about that.","Sometimes it won't help, then connect to drone database with sqlite and change user's trusted flag to ","name"," - ","container_name","environment","DRONE_RPC_SECRET=rpc_secret","restart","always","volumes","ct-0734fc","export","ct-9f67ad","$","ct-55c6c3")) \ No newline at end of file diff --git a/docs/docker/drone-ci/index.html b/docs/docker/drone-ci/index.html index 2315e4c..274e8e6 100644 --- a/docs/docker/drone-ci/index.html +++ b/docs/docker/drone-ci/index.html @@ -1,6 +1,6 @@ -Drone Ci • Obsidian Garden -

Drone Ci

Can be used with Private docker registry to deploy things using #docker.

Pushing to private docker_registry

You should specify global_docker_login, global_docker_password, global_docker_registry organizations variables in your drone. And docker_repo variable for your repo as docker.yourdomain.com/your-image.

This is example of .droneci for private docker registry:

kind: pipelinename: buildtype: dockerplatform:  os: linux  arch: amd64steps:  - name: build-master    image: plugins/docker    when:      branch:        - master    settings:      dockerfile: Dockerfile      tag:        - ${DRONE_BRANCH}      username:        from_secret: global_docker_login      password:        from_secret: global_docker_password      registry:        from_secret: global_docker_registry      repo:        from_secret: docker_repo

Docker-compose file for drone-ci

The drone service is ui itself and drone-agent is runner for builds, that can be started on different machine (or machines).

Change secret_id, rpc_secret and drone.url to something you like.

version: "3"services:  drone:    container_name: drone    image: drone/drone:latest    environment:      - DRONE_GITHUB_CLIENT_ID=secret_id      - DRONE_GITHUB_CLIENT_SECRET=client_secret      - DRONE_RPC_SECRET=rpc_secret      - DRONE_SERVER_HOST=drone.url      - DRONE_USER_CREATE="username:user,admin:true"      - DRONE_SERVER_PROTO=https      - DRONE_TLS_AUTOCERT=false      - DRONE_GIT_ALWAYS_AUTH=false      - DRONE_LOGS_DEBUG=true      - DRONE_LOGS_TRACE=true    restart: always    volumes:      - ./data:/data    ports:      - 8090:80  drone-agent:    container_name: drone__agent    image: drone/agent:latest    command: agent    restart: always    volumes:      - /var/run/docker.sock:/var/run/docker.sock    environment:      - DRONE_RPC_SERVER=https://drone.url      - DRONE_RPC_SECRET=rpc_secret

Caching builds

Haven't checked that yet, but there's a manual from Laszlo Fogas about that.

Get user info

export DRONE_SERVER=https://drone.urlexport DRONE_TOKEN=passworddrone info

Mark user as trusted

Sometimes it won't help, then connect to drone database with sqlite and change user's trusted flag to 1.

drone repo update $1 --trusted=true && drone repo info $1
btw, have a nice day
(2018 - 2024) muerwre
+

Drone Ci

Can be used with Private docker registry to deploy things using #docker.

Pushing to private docker_registry

You should specify global_docker_login, global_docker_password, global_docker_registry organizations variables in your drone. And docker_repo variable for your repo as docker.yourdomain.com/your-image.

This is example of .droneci for private docker registry:

kind: pipelinename: buildtype: dockerplatform:  os: linux  arch: amd64steps:  - name: build-master    image: plugins/docker    when:      branch:        - master    settings:      dockerfile: Dockerfile      tag:        - ${DRONE_BRANCH}      username:        from_secret: global_docker_login      password:        from_secret: global_docker_password      registry:        from_secret: global_docker_registry      repo:        from_secret: docker_repo

Docker-compose file for drone-ci

The drone service is ui itself and drone-agent is runner for builds, that can be started on different machine (or machines).

Change secret_id, rpc_secret and drone.url to something you like.

version: "3"services:  drone:    container_name: drone    image: drone/drone:latest    environment:      - DRONE_GITHUB_CLIENT_ID=secret_id      - DRONE_GITHUB_CLIENT_SECRET=client_secret      - DRONE_RPC_SECRET=rpc_secret      - DRONE_SERVER_HOST=drone.url      - DRONE_USER_CREATE="username:user,admin:true"      - DRONE_SERVER_PROTO=https      - DRONE_TLS_AUTOCERT=false      - DRONE_GIT_ALWAYS_AUTH=false      - DRONE_LOGS_DEBUG=true      - DRONE_LOGS_TRACE=true    restart: always    volumes:      - ./data:/data    ports:      - 8090:80  drone-agent:    container_name: drone__agent    image: drone/agent:latest    command: agent    restart: always    volumes:      - /var/run/docker.sock:/var/run/docker.sock    environment:      - DRONE_RPC_SERVER=https://drone.url      - DRONE_RPC_SECRET=rpc_secret

Caching builds

Haven't checked that yet, but there's a manual from Laszlo Fogas about that.

Get user info

export DRONE_SERVER=https://drone.urlexport DRONE_TOKEN=passworddrone info

Mark user as trusted

Sometimes it won't help, then connect to drone database with sqlite and change user's trusted flag to 1.

drone repo update $1 --trusted=true && drone repo info $1
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/docker/github-pages-with-drone-ci/_payload.js b/docs/docker/github-pages-with-drone-ci/_payload.js index bb5edaf..11da2d7 100644 --- a/docs/docker/github-pages-with-drone-ci/_payload.js +++ b/docs/docker/github-pages-with-drone-ci/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:H,_path:I},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-ZOfNnzEGMw":{_path:I,_dir:J,_draft:x,_partial:x,_locale:"en",_empty:x,title:H,description:"To deploy github pages with Drone-ci you will need .drone.yml as specified below. You also should define secrets github_username and github_token (get it here) in your drone's repository setup.",excerpt:{type:K,children:[{type:a,tag:j,props:{},children:[{type:b,value:L},{type:a,tag:i,props:{href:p},children:[{type:b,value:p}]},{type:b,value:M},{type:a,tag:f,props:{},children:[{type:b,value:N}]},{type:b,value:O},{type:a,tag:f,props:{},children:[{type:b,value:y}]},{type:b,value:P},{type:a,tag:f,props:{},children:[{type:b,value:z}]},{type:b,value:Q},{type:a,tag:i,props:{href:R,rel:[k]},children:[{type:b,value:S}]},{type:b,value:T}]},{type:a,tag:j,props:{},children:[{type:b,value:U},{type:a,tag:f,props:{},children:[{type:b,value:V}]},{type:b,value:W},{type:a,tag:i,props:{href:q,rel:[k]},children:[{type:b,value:q}]},{type:b,value:X},{type:a,tag:i,props:{href:r,rel:[k]},children:[{type:b,value:r}]},{type:b,value:Y}]},{type:a,tag:j,props:{},children:[{type:b,value:Z},{type:a,tag:f,props:{},children:[{type:b,value:n}]},{type:b,value:_},{type:a,tag:f,props:{},children:[{type:b,value:$}]},{type:b,value:s}]},{type:a,tag:j,props:{},children:[{type:b,value:aa},{type:a,tag:f,props:{},children:[{type:b,value:n}]},{type:b,value:ab}]},{type:a,tag:t,props:{code:A,language:ac},children:[{type:a,tag:ad,props:{},children:[{type:a,tag:t,props:{__ignoreMap:B},children:[{type:b,value:A}]}]}]},{type:a,tag:j,props:{},children:[{type:b,value:ae},{type:a,tag:f,props:{},children:[{type:b,value:af}]},{type:b,value:ag},{type:a,tag:f,props:{},children:[{type:b,value:ah}]},{type:b,value:ai},{type:a,tag:f,props:{},children:[{type:b,value:aj}]},{type:b,value:ak}]},{type:a,tag:j,props:{},children:[{type:b,value:al},{type:a,tag:f,props:{},children:[{type:b,value:am}]},{type:b,value:an},{type:a,tag:i,props:{href:u,rel:[k]},children:[{type:b,value:ao}]},{type:b,value:s}]},{type:a,tag:ap,props:{id:C},children:[{type:b,value:D}]},{type:a,tag:aq,props:{},children:[{type:a,tag:v,props:{},children:[{type:a,tag:i,props:{href:ar,rel:[k]},children:[{type:b,value:as}]}]},{type:a,tag:v,props:{},children:[{type:a,tag:i,props:{href:u,rel:[k]},children:[{type:b,value:at}]}]}]}]},body:{type:K,children:[{type:a,tag:j,props:{},children:[{type:b,value:L},{type:a,tag:i,props:{href:p},children:[{type:b,value:p}]},{type:b,value:M},{type:a,tag:f,props:{},children:[{type:b,value:N}]},{type:b,value:O},{type:a,tag:f,props:{},children:[{type:b,value:y}]},{type:b,value:P},{type:a,tag:f,props:{},children:[{type:b,value:z}]},{type:b,value:Q},{type:a,tag:i,props:{href:R,rel:[k]},children:[{type:b,value:S}]},{type:b,value:T}]},{type:a,tag:j,props:{},children:[{type:b,value:U},{type:a,tag:f,props:{},children:[{type:b,value:V}]},{type:b,value:W},{type:a,tag:i,props:{href:q,rel:[k]},children:[{type:b,value:q}]},{type:b,value:X},{type:a,tag:i,props:{href:r,rel:[k]},children:[{type:b,value:r}]},{type:b,value:Y}]},{type:a,tag:j,props:{},children:[{type:b,value:Z},{type:a,tag:f,props:{},children:[{type:b,value:n}]},{type:b,value:_},{type:a,tag:f,props:{},children:[{type:b,value:$}]},{type:b,value:s}]},{type:a,tag:j,props:{},children:[{type:b,value:aa},{type:a,tag:f,props:{},children:[{type:b,value:n}]},{type:b,value:ab}]},{type:a,tag:t,props:{code:A,language:ac},children:[{type:a,tag:ad,props:{},children:[{type:a,tag:t,props:{__ignoreMap:B},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:"kind"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"pipeline"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:au}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:"type"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:J}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:"platform"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:av}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"os"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"linux"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:av}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"arch"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"amd64"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:"steps"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:aw}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:au}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:ax}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"node:16"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"commands"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"yarn"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"yarn generate"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"rm -rf .\u002Fdocs"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"mv .\u002F.output\u002Fpublic .\u002Fdocs"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"touch .\u002Fdocs\u002F.nojekyll"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:aw}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"publish"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:ax}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"plugins\u002Fgh-pages"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"settings"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:F}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"target_branch"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:n}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:F}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"username"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ay}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:az}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:y}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:F}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"password"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ay}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:az}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:z}]}]}]}]}]},{type:a,tag:j,props:{},children:[{type:b,value:ae},{type:a,tag:f,props:{},children:[{type:b,value:af}]},{type:b,value:ag},{type:a,tag:f,props:{},children:[{type:b,value:ah}]},{type:b,value:ai},{type:a,tag:f,props:{},children:[{type:b,value:aj}]},{type:b,value:ak}]},{type:a,tag:j,props:{},children:[{type:b,value:al},{type:a,tag:f,props:{},children:[{type:b,value:am}]},{type:b,value:an},{type:a,tag:i,props:{href:u,rel:[k]},children:[{type:b,value:ao}]},{type:b,value:s}]},{type:a,tag:ap,props:{id:C},children:[{type:b,value:D}]},{type:a,tag:aq,props:{},children:[{type:a,tag:v,props:{},children:[{type:a,tag:i,props:{href:ar,rel:[k]},children:[{type:b,value:as}]}]},{type:a,tag:v,props:{},children:[{type:a,tag:i,props:{href:u,rel:[k]},children:[{type:b,value:at}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-660a6f{color:#A5D6FF}.ct-7fc260{color:#C9D1D9}.ct-ff0620{color:#7EE787}.light .ct-ff0620{color:#268BD2}.light .ct-7fc260{color:#657B83}.light .ct-660a6f{color:#2AA198}"}]}],toc:{title:B,searchDepth:G,depth:G,links:[{id:C,depth:G,text:D}]}},_type:"markdown",_id:"content:Docker:Github pages with drone-ci.md",_source:"content",_file:"Docker\u002FGithub pages with drone-ci.md",_extension:"md"}},prerenderedAt:1711020226937}}("element","text","span","ct-7fc260","line","code-inline","ct-ff0620","ct-660a6f","a","p","nofollow",": ",":","gh-pages"," - ","Drone-ci","https:\u002F\u002Fyourname.github.io\u002F","https:\u002F\u002Fyourname.github.io\u002Frepo-name\u002F",".","code","https:\u002F\u002Fgithub.blog\u002F2009-12-29-bypassing-jekyll-on-github-pages\u002F","li"," ",false,"github_username","github_token","kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build\n image: node:16\n commands:\n - yarn\n - yarn generate\n - rm -rf .\u002Fdocs\n - mv .\u002F.output\u002Fpublic .\u002Fdocs\n - touch .\u002Fdocs\u002F.nojekyll\n - name: publish\n image: plugins\u002Fgh-pages\n settings:\n target_branch: gh-pages\n username:\n from_secret: github_username\n password:\n from_secret: github_token\n","","additional-reading","Additional reading","name"," ",2,"Github Pages With Drone Ci","\u002Fdocker\u002Fgithub-pages-with-drone-ci","docker","root","To deploy github pages with "," you will need ",".drone.yml"," as specified below. You also should define secrets "," and "," (get it ","https:\u002F\u002Fgithub.com\u002Fsettings\u002Ftokens","here",") in your drone's repository setup.","Github repository should be named as ","yourname.github.io"," and it could be accessed at ",". Otherwise it'll be available at ",", what you might not like.","You should create branch named "," in that repo and setup GH Pages at ","https:\u002F\u002Fgithub.com\u002F\u003Cyourusername\u003E\u002F\u003Cyourusername\u003E.github.io\u002Fsettings\u002Fpages","This config will update "," branch in your project, which will contain only generated content. I know, that's bad, but there's no better way to do that with generic drone plugins.","yaml","pre","Here we're moving ",".\u002F.output\u002Fpublic"," to ",".\u002Fdocs",", because #nuxt creates symlink for ","docs"," and git can't work with that.","Also we create ",".nojekyll"," at the root of repo, so github's internal engine won't ","ignore files that start with underscore","h2","ul","https:\u002F\u002Fplugins.drone.io\u002Fplugins\u002Fgh-pages","Drone Github Pages Documentation","Bypassing Jekyll on GitHub Pages","build"," "," - ","image"," ","from_secret")) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:H,_path:I},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-ZOfNnzEGMw":{_path:I,_dir:J,_draft:x,_partial:x,_locale:"en",_empty:x,title:H,description:"To deploy github pages with Drone-ci you will need .drone.yml as specified below. You also should define secrets github_username and github_token (get it here) in your drone's repository setup.",excerpt:{type:K,children:[{type:a,tag:j,props:{},children:[{type:b,value:L},{type:a,tag:i,props:{href:p},children:[{type:b,value:p}]},{type:b,value:M},{type:a,tag:f,props:{},children:[{type:b,value:N}]},{type:b,value:O},{type:a,tag:f,props:{},children:[{type:b,value:y}]},{type:b,value:P},{type:a,tag:f,props:{},children:[{type:b,value:z}]},{type:b,value:Q},{type:a,tag:i,props:{href:R,rel:[k]},children:[{type:b,value:S}]},{type:b,value:T}]},{type:a,tag:j,props:{},children:[{type:b,value:U},{type:a,tag:f,props:{},children:[{type:b,value:V}]},{type:b,value:W},{type:a,tag:i,props:{href:q,rel:[k]},children:[{type:b,value:q}]},{type:b,value:X},{type:a,tag:i,props:{href:r,rel:[k]},children:[{type:b,value:r}]},{type:b,value:Y}]},{type:a,tag:j,props:{},children:[{type:b,value:Z},{type:a,tag:f,props:{},children:[{type:b,value:n}]},{type:b,value:_},{type:a,tag:f,props:{},children:[{type:b,value:$}]},{type:b,value:s}]},{type:a,tag:j,props:{},children:[{type:b,value:aa},{type:a,tag:f,props:{},children:[{type:b,value:n}]},{type:b,value:ab}]},{type:a,tag:t,props:{code:A,language:ac},children:[{type:a,tag:ad,props:{},children:[{type:a,tag:t,props:{__ignoreMap:B},children:[{type:b,value:A}]}]}]},{type:a,tag:j,props:{},children:[{type:b,value:ae},{type:a,tag:f,props:{},children:[{type:b,value:af}]},{type:b,value:ag},{type:a,tag:f,props:{},children:[{type:b,value:ah}]},{type:b,value:ai},{type:a,tag:f,props:{},children:[{type:b,value:aj}]},{type:b,value:ak}]},{type:a,tag:j,props:{},children:[{type:b,value:al},{type:a,tag:f,props:{},children:[{type:b,value:am}]},{type:b,value:an},{type:a,tag:i,props:{href:u,rel:[k]},children:[{type:b,value:ao}]},{type:b,value:s}]},{type:a,tag:ap,props:{id:C},children:[{type:b,value:D}]},{type:a,tag:aq,props:{},children:[{type:a,tag:v,props:{},children:[{type:a,tag:i,props:{href:ar,rel:[k]},children:[{type:b,value:as}]}]},{type:a,tag:v,props:{},children:[{type:a,tag:i,props:{href:u,rel:[k]},children:[{type:b,value:at}]}]}]}]},body:{type:K,children:[{type:a,tag:j,props:{},children:[{type:b,value:L},{type:a,tag:i,props:{href:p},children:[{type:b,value:p}]},{type:b,value:M},{type:a,tag:f,props:{},children:[{type:b,value:N}]},{type:b,value:O},{type:a,tag:f,props:{},children:[{type:b,value:y}]},{type:b,value:P},{type:a,tag:f,props:{},children:[{type:b,value:z}]},{type:b,value:Q},{type:a,tag:i,props:{href:R,rel:[k]},children:[{type:b,value:S}]},{type:b,value:T}]},{type:a,tag:j,props:{},children:[{type:b,value:U},{type:a,tag:f,props:{},children:[{type:b,value:V}]},{type:b,value:W},{type:a,tag:i,props:{href:q,rel:[k]},children:[{type:b,value:q}]},{type:b,value:X},{type:a,tag:i,props:{href:r,rel:[k]},children:[{type:b,value:r}]},{type:b,value:Y}]},{type:a,tag:j,props:{},children:[{type:b,value:Z},{type:a,tag:f,props:{},children:[{type:b,value:n}]},{type:b,value:_},{type:a,tag:f,props:{},children:[{type:b,value:$}]},{type:b,value:s}]},{type:a,tag:j,props:{},children:[{type:b,value:aa},{type:a,tag:f,props:{},children:[{type:b,value:n}]},{type:b,value:ab}]},{type:a,tag:t,props:{code:A,language:ac},children:[{type:a,tag:ad,props:{},children:[{type:a,tag:t,props:{__ignoreMap:B},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:"kind"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"pipeline"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:au}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:"type"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:J}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:"platform"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:av}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"os"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"linux"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:av}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"arch"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"amd64"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:"steps"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:aw}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:au}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:ax}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"node:16"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"commands"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"yarn"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"yarn generate"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"rm -rf .\u002Fdocs"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"mv .\u002F.output\u002Fpublic .\u002Fdocs"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"touch .\u002Fdocs\u002F.nojekyll"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:aw}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"publish"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:ax}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"plugins\u002Fgh-pages"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"settings"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:F}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"target_branch"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:n}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:F}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"username"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ay}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:az}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:y}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:F}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"password"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:m}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ay}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:az}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:z}]}]}]}]}]},{type:a,tag:j,props:{},children:[{type:b,value:ae},{type:a,tag:f,props:{},children:[{type:b,value:af}]},{type:b,value:ag},{type:a,tag:f,props:{},children:[{type:b,value:ah}]},{type:b,value:ai},{type:a,tag:f,props:{},children:[{type:b,value:aj}]},{type:b,value:ak}]},{type:a,tag:j,props:{},children:[{type:b,value:al},{type:a,tag:f,props:{},children:[{type:b,value:am}]},{type:b,value:an},{type:a,tag:i,props:{href:u,rel:[k]},children:[{type:b,value:ao}]},{type:b,value:s}]},{type:a,tag:ap,props:{id:C},children:[{type:b,value:D}]},{type:a,tag:aq,props:{},children:[{type:a,tag:v,props:{},children:[{type:a,tag:i,props:{href:ar,rel:[k]},children:[{type:b,value:as}]}]},{type:a,tag:v,props:{},children:[{type:a,tag:i,props:{href:u,rel:[k]},children:[{type:b,value:at}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-ebd133{color:#A5D6FF}.ct-b98996{color:#C9D1D9}.ct-c98cc9{color:#7EE787}.light .ct-c98cc9{color:#268BD2}.light .ct-b98996{color:#657B83}.light .ct-ebd133{color:#2AA198}"}]}],toc:{title:B,searchDepth:G,depth:G,links:[{id:C,depth:G,text:D}]}},_type:"markdown",_id:"content:Docker:Github pages with drone-ci.md",_source:"content",_file:"Docker\u002FGithub pages with drone-ci.md",_extension:"md"}},prerenderedAt:1711020860767}}("element","text","span","ct-b98996","line","code-inline","ct-c98cc9","ct-ebd133","a","p","nofollow",": ",":","gh-pages"," - ","Drone-ci","https:\u002F\u002Fyourname.github.io\u002F","https:\u002F\u002Fyourname.github.io\u002Frepo-name\u002F",".","code","https:\u002F\u002Fgithub.blog\u002F2009-12-29-bypassing-jekyll-on-github-pages\u002F","li"," ",false,"github_username","github_token","kind: pipeline\nname: build\ntype: docker\n\nplatform:\n os: linux\n arch: amd64\n\nsteps:\n - name: build\n image: node:16\n commands:\n - yarn\n - yarn generate\n - rm -rf .\u002Fdocs\n - mv .\u002F.output\u002Fpublic .\u002Fdocs\n - touch .\u002Fdocs\u002F.nojekyll\n - name: publish\n image: plugins\u002Fgh-pages\n settings:\n target_branch: gh-pages\n username:\n from_secret: github_username\n password:\n from_secret: github_token\n","","additional-reading","Additional reading","name"," ",2,"Github Pages With Drone Ci","\u002Fdocker\u002Fgithub-pages-with-drone-ci","docker","root","To deploy github pages with "," you will need ",".drone.yml"," as specified below. You also should define secrets "," and "," (get it ","https:\u002F\u002Fgithub.com\u002Fsettings\u002Ftokens","here",") in your drone's repository setup.","Github repository should be named as ","yourname.github.io"," and it could be accessed at ",". Otherwise it'll be available at ",", what you might not like.","You should create branch named "," in that repo and setup GH Pages at ","https:\u002F\u002Fgithub.com\u002F\u003Cyourusername\u003E\u002F\u003Cyourusername\u003E.github.io\u002Fsettings\u002Fpages","This config will update "," branch in your project, which will contain only generated content. I know, that's bad, but there's no better way to do that with generic drone plugins.","yaml","pre","Here we're moving ",".\u002F.output\u002Fpublic"," to ",".\u002Fdocs",", because #nuxt creates symlink for ","docs"," and git can't work with that.","Also we create ",".nojekyll"," at the root of repo, so github's internal engine won't ","ignore files that start with underscore","h2","ul","https:\u002F\u002Fplugins.drone.io\u002Fplugins\u002Fgh-pages","Drone Github Pages Documentation","Bypassing Jekyll on GitHub Pages","build"," "," - ","image"," ","from_secret")) \ No newline at end of file diff --git a/docs/docker/github-pages-with-drone-ci/index.html b/docs/docker/github-pages-with-drone-ci/index.html index 38f3980..d68da92 100644 --- a/docs/docker/github-pages-with-drone-ci/index.html +++ b/docs/docker/github-pages-with-drone-ci/index.html @@ -1,6 +1,6 @@ -Github Pages With Drone Ci • Obsidian Garden -

Github Pages With Drone Ci

To deploy github pages with Drone-ci you will need .drone.yml as specified below. You also should define secrets github_username and github_token (get it here) in your drone's repository setup.

Github repository should be named as yourname.github.io and it could be accessed at https://yourname.github.io/. Otherwise it'll be available at https://yourname.github.io/repo-name/, what you might not like.

You should create branch named gh-pages in that repo and setup GH Pages at https://github.com/<yourusername>/<yourusername>.github.io/settings/pages.

This config will update gh-pages branch in your project, which will contain only generated content. I know, that's bad, but there's no better way to do that with generic drone plugins.

kind: pipelinename: buildtype: dockerplatform:  os: linux  arch: amd64steps:  - name: build    image: node:16    commands:      - yarn      - yarn generate      - rm -rf ./docs      - mv ./.output/public ./docs      - touch ./docs/.nojekyll  - name: publish    image: plugins/gh-pages    settings:      target_branch: gh-pages      username:        from_secret: github_username      password:        from_secret: github_token

Here we're moving ./.output/public to ./docs, because #nuxt creates symlink for docs and git can't work with that.

Also we create .nojekyll at the root of repo, so github's internal engine won't ignore files that start with underscore.

Additional reading

btw, have a nice day
(2018 - 2024) muerwre
+

Github Pages With Drone Ci

To deploy github pages with Drone-ci you will need .drone.yml as specified below. You also should define secrets github_username and github_token (get it here) in your drone's repository setup.

Github repository should be named as yourname.github.io and it could be accessed at https://yourname.github.io/. Otherwise it'll be available at https://yourname.github.io/repo-name/, what you might not like.

You should create branch named gh-pages in that repo and setup GH Pages at https://github.com/<yourusername>/<yourusername>.github.io/settings/pages.

This config will update gh-pages branch in your project, which will contain only generated content. I know, that's bad, but there's no better way to do that with generic drone plugins.

kind: pipelinename: buildtype: dockerplatform:  os: linux  arch: amd64steps:  - name: build    image: node:16    commands:      - yarn      - yarn generate      - rm -rf ./docs      - mv ./.output/public ./docs      - touch ./docs/.nojekyll  - name: publish    image: plugins/gh-pages    settings:      target_branch: gh-pages      username:        from_secret: github_username      password:        from_secret: github_token

Here we're moving ./.output/public to ./docs, because #nuxt creates symlink for docs and git can't work with that.

Also we create .nojekyll at the root of repo, so github's internal engine won't ignore files that start with underscore.

Additional reading

btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/docker/private-docker-registry/_payload.js b/docs/docker/private-docker-registry/_payload.js index 0ae14a3..c186ff0 100644 --- a/docs/docker/private-docker-registry/_payload.js +++ b/docs/docker/private-docker-registry/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:B,_path:C},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-3LsByI0Qek":{_path:C,_dir:"docker",_draft:t,_partial:t,_locale:"en",_empty:t,title:B,description:"Suitable to work with Drone-ci for hosting private #docker images.",excerpt:{type:D,children:[{type:a,tag:n,props:{},children:[{type:c,value:E},{type:a,tag:F,props:{href:p},children:[{type:c,value:p}]},{type:c,value:G}]},{type:a,tag:q,props:{id:u},children:[{type:c,value:v}]},{type:a,tag:n,props:{},children:[{type:c,value:H}]},{type:a,tag:i,props:{code:w,language:r},children:[{type:a,tag:o,props:{},children:[{type:a,tag:i,props:{__ignoreMap:l},children:[{type:c,value:w}]}]}]},{type:a,tag:i,props:{code:x,language:I},children:[{type:a,tag:o,props:{},children:[{type:a,tag:i,props:{__ignoreMap:l},children:[{type:c,value:x}]}]}]},{type:a,tag:q,props:{id:y},children:[{type:c,value:z}]},{type:a,tag:n,props:{},children:[{type:c,value:J}]},{type:a,tag:K,props:{},children:[{type:a,tag:L,props:{},children:[{type:c,value:M}]}]},{type:a,tag:i,props:{code:A,language:r},children:[{type:a,tag:o,props:{},children:[{type:a,tag:i,props:{__ignoreMap:l},children:[{type:c,value:A}]}]}]}]},body:{type:D,children:[{type:a,tag:n,props:{},children:[{type:c,value:E},{type:a,tag:F,props:{href:p},children:[{type:c,value:p}]},{type:c,value:G}]},{type:a,tag:q,props:{id:u},children:[{type:c,value:v}]},{type:a,tag:n,props:{},children:[{type:c,value:H}]},{type:a,tag:i,props:{code:w,language:r},children:[{type:a,tag:o,props:{},children:[{type:a,tag:i,props:{__ignoreMap:l},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" --entrypoint htpasswd registry:2 \\"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" -Bbn user mypassword "}]},{type:a,tag:b,props:{class:"ct-8ef278"},children:[{type:c,value:"\u003E"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" auth\u002Fregistry.password"}]}]}]}]}]},{type:a,tag:i,props:{code:x,language:I},children:[{type:a,tag:o,props:{},children:[{type:a,tag:i,props:{__ignoreMap:l},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:"version"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"\"3\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:"services"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"registry"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"docker__registry"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"registry:2"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"5000:5000"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:U}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=\u002Fdata"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"REGISTRY_AUTH=htpasswd"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"REGISTRY_AUTH_HTPASSWD_REALM=Registry"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"REGISTRY_AUTH_HTPASSWD_PATH=\u002Fauth\u002Fregistry.password"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"REGISTRY_HTTP_SECRET=password"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"REGISTRY_STORAGE_DELETE_ENABLED=true"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"volumes"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:".\u002Fregistry\u002Fauth:\u002Fauth"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:".\u002Fregistry\u002Fdata:\u002Fdata"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"ui"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"docker__ui"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"parabuzzle\u002Fcraneoperator:latest"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"80:80"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:U}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"REGISTRY_HOST=registry"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"REGISTRY_PORT=5000"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"REGISTRY_PROTOCOL=http"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"ALLOW_REGISTRY_LOGIN=true"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"REGISTRY_ALLOW_DELETE=true"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"USERNAME=registry"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PASSWORD=password"}]}]}]}]}]},{type:a,tag:q,props:{id:y},children:[{type:c,value:z}]},{type:a,tag:n,props:{},children:[{type:c,value:J}]},{type:a,tag:K,props:{},children:[{type:a,tag:L,props:{},children:[{type:c,value:M}]}]},{type:a,tag:i,props:{code:A,language:r},children:[{type:a,tag:o,props:{},children:[{type:a,tag:i,props:{__ignoreMap:l},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:W},children:[{type:c,value:"# Try this first"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" --rm anoxis\u002Fregistry-cli \\"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" -r https:\u002F\u002Fregistry.url \\"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" -l user:password \\"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" --delete \\"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" --num 2"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:W},children:[{type:c,value:"# Then this "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"docker run -it \\"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" -v \u002Fpath\u002Fto\u002Fregistry\u002Fdata:\u002Fregistry \\"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" -e REGISTRY_URL=https:\u002F\u002Fregistry.url \\"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" -e DRY_RUN="}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"\"false\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:X}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" -e REGISTRY_AUTH="}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"\"user:password\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:X}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" mortensrasmussen\u002Fdocker-registry-manifest-cleanup"}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-116223{color:#8B949E}.ct-8c53f0{color:#A5D6FF}.ct-5cf510{color:#7EE787}.ct-8ef278{color:#FF7B72}.ct-c7c611{color:#C9D1D9}.light .ct-c7c611{color:#657B83}.light .ct-8ef278{color:#859900}.light .ct-5cf510{color:#268BD2}.light .ct-8c53f0{color:#2AA198}.light .ct-116223{color:#93A1A1}"}]}],toc:{title:l,searchDepth:s,depth:s,links:[{id:u,depth:s,text:v},{id:y,depth:s,text:z}]}},_type:"markdown",_id:"content:Docker:Private docker registry.md",_source:"content",_file:"Docker\u002FPrivate docker registry.md",_extension:"md"}},prerenderedAt:1711020226969}}("element","span","text","ct-c7c611","line","ct-8c53f0","ct-5cf510"," - ","code"," ",":","",": ","p","pre","Drone-ci","h2","shell",2,false,"sample-docker-compose-for-custom-docker-registry","Sample docker-compose for custom docker registry","docker run \\\n --entrypoint htpasswd registry:2 \\\n -Bbn user mypassword \u003E auth\u002Fregistry.password\n","version: \"3\"\nservices:\n registry:\n container_name: docker__registry\n image: registry:2\n ports:\n - 5000:5000\n restart: always\n environment:\n - REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=\u002Fdata\n - REGISTRY_AUTH=htpasswd\n - REGISTRY_AUTH_HTPASSWD_REALM=Registry\n - REGISTRY_AUTH_HTPASSWD_PATH=\u002Fauth\u002Fregistry.password\n - REGISTRY_HTTP_SECRET=password\n - REGISTRY_STORAGE_DELETE_ENABLED=true\n volumes:\n - .\u002Fregistry\u002Fauth:\u002Fauth\n - .\u002Fregistry\u002Fdata:\u002Fdata\n ui:\n container_name: docker__ui\n image: parabuzzle\u002Fcraneoperator:latest\n ports:\n - 80:80\n restart: always\n environment:\n - REGISTRY_HOST=registry\n - REGISTRY_PORT=5000\n - REGISTRY_PROTOCOL=http\n - ALLOW_REGISTRY_LOGIN=true\n - REGISTRY_ALLOW_DELETE=true\n - USERNAME=registry\n - PASSWORD=password\n","squash-layers-on-registry","Squash layers on registry","# Try this first\ndocker run \\\n --rm anoxis\u002Fregistry-cli \\\n -r https:\u002F\u002Fregistry.url \\\n -l user:password \\\n --delete \\\n --num 2\n\n# Then this \ndocker run -it \\\n -v \u002Fpath\u002Fto\u002Fregistry\u002Fdata:\u002Fregistry \\\n -e REGISTRY_URL=https:\u002F\u002Fregistry.url \\\n -e DRY_RUN=\"false\" \\\n -e REGISTRY_AUTH=\"user:password\" \\\n mortensrasmussen\u002Fdocker-registry-manifest-cleanup\n","Private Docker Registry","\u002Fdocker\u002Fprivate-docker-registry","root","Suitable to work with ","a"," for hosting private #docker images.","This one brings up private docker registry with ui. First you'll need to generate password for it:","yaml","Sometimes you need to squash all layers in docker registry to free up disk space.","ol","li","Run this command to mark oldest layers","docker run \\"," ","container_name","image","ports"," - ","restart","always","environment","ct-116223"," \\")) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:B,_path:C},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-3LsByI0Qek":{_path:C,_dir:"docker",_draft:t,_partial:t,_locale:"en",_empty:t,title:B,description:"Suitable to work with Drone-ci for hosting private #docker images.",excerpt:{type:D,children:[{type:a,tag:n,props:{},children:[{type:c,value:E},{type:a,tag:F,props:{href:p},children:[{type:c,value:p}]},{type:c,value:G}]},{type:a,tag:q,props:{id:u},children:[{type:c,value:v}]},{type:a,tag:n,props:{},children:[{type:c,value:H}]},{type:a,tag:i,props:{code:w,language:r},children:[{type:a,tag:o,props:{},children:[{type:a,tag:i,props:{__ignoreMap:l},children:[{type:c,value:w}]}]}]},{type:a,tag:i,props:{code:x,language:I},children:[{type:a,tag:o,props:{},children:[{type:a,tag:i,props:{__ignoreMap:l},children:[{type:c,value:x}]}]}]},{type:a,tag:q,props:{id:y},children:[{type:c,value:z}]},{type:a,tag:n,props:{},children:[{type:c,value:J}]},{type:a,tag:K,props:{},children:[{type:a,tag:L,props:{},children:[{type:c,value:M}]}]},{type:a,tag:i,props:{code:A,language:r},children:[{type:a,tag:o,props:{},children:[{type:a,tag:i,props:{__ignoreMap:l},children:[{type:c,value:A}]}]}]}]},body:{type:D,children:[{type:a,tag:n,props:{},children:[{type:c,value:E},{type:a,tag:F,props:{href:p},children:[{type:c,value:p}]},{type:c,value:G}]},{type:a,tag:q,props:{id:u},children:[{type:c,value:v}]},{type:a,tag:n,props:{},children:[{type:c,value:H}]},{type:a,tag:i,props:{code:w,language:r},children:[{type:a,tag:o,props:{},children:[{type:a,tag:i,props:{__ignoreMap:l},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" --entrypoint htpasswd registry:2 \\"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" -Bbn user mypassword "}]},{type:a,tag:b,props:{class:"ct-ac602b"},children:[{type:c,value:"\u003E"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" auth\u002Fregistry.password"}]}]}]}]}]},{type:a,tag:i,props:{code:x,language:I},children:[{type:a,tag:o,props:{},children:[{type:a,tag:i,props:{__ignoreMap:l},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:"version"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"\"3\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:"services"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"registry"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"docker__registry"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"registry:2"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"5000:5000"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:U}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=\u002Fdata"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"REGISTRY_AUTH=htpasswd"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"REGISTRY_AUTH_HTPASSWD_REALM=Registry"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"REGISTRY_AUTH_HTPASSWD_PATH=\u002Fauth\u002Fregistry.password"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"REGISTRY_HTTP_SECRET=password"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"REGISTRY_STORAGE_DELETE_ENABLED=true"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"volumes"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:".\u002Fregistry\u002Fauth:\u002Fauth"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:".\u002Fregistry\u002Fdata:\u002Fdata"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"ui"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"docker__ui"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"parabuzzle\u002Fcraneoperator:latest"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"80:80"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:U}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"REGISTRY_HOST=registry"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"REGISTRY_PORT=5000"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"REGISTRY_PROTOCOL=http"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"ALLOW_REGISTRY_LOGIN=true"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"REGISTRY_ALLOW_DELETE=true"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"USERNAME=registry"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PASSWORD=password"}]}]}]}]}]},{type:a,tag:q,props:{id:y},children:[{type:c,value:z}]},{type:a,tag:n,props:{},children:[{type:c,value:J}]},{type:a,tag:K,props:{},children:[{type:a,tag:L,props:{},children:[{type:c,value:M}]}]},{type:a,tag:i,props:{code:A,language:r},children:[{type:a,tag:o,props:{},children:[{type:a,tag:i,props:{__ignoreMap:l},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:W},children:[{type:c,value:"# Try this first"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" --rm anoxis\u002Fregistry-cli \\"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" -r https:\u002F\u002Fregistry.url \\"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" -l user:password \\"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" --delete \\"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" --num 2"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:W},children:[{type:c,value:"# Then this "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"docker run -it \\"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" -v \u002Fpath\u002Fto\u002Fregistry\u002Fdata:\u002Fregistry \\"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" -e REGISTRY_URL=https:\u002F\u002Fregistry.url \\"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" -e DRY_RUN="}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"\"false\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:X}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" -e REGISTRY_AUTH="}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"\"user:password\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:X}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" mortensrasmussen\u002Fdocker-registry-manifest-cleanup"}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-a663a1{color:#8B949E}.ct-12b57b{color:#A5D6FF}.ct-0ddb55{color:#7EE787}.ct-ac602b{color:#FF7B72}.ct-28deb7{color:#C9D1D9}.light .ct-28deb7{color:#657B83}.light .ct-ac602b{color:#859900}.light .ct-0ddb55{color:#268BD2}.light .ct-12b57b{color:#2AA198}.light .ct-a663a1{color:#93A1A1}"}]}],toc:{title:l,searchDepth:s,depth:s,links:[{id:u,depth:s,text:v},{id:y,depth:s,text:z}]}},_type:"markdown",_id:"content:Docker:Private docker registry.md",_source:"content",_file:"Docker\u002FPrivate docker registry.md",_extension:"md"}},prerenderedAt:1711020860846}}("element","span","text","ct-28deb7","line","ct-12b57b","ct-0ddb55"," - ","code"," ",":","",": ","p","pre","Drone-ci","h2","shell",2,false,"sample-docker-compose-for-custom-docker-registry","Sample docker-compose for custom docker registry","docker run \\\n --entrypoint htpasswd registry:2 \\\n -Bbn user mypassword \u003E auth\u002Fregistry.password\n","version: \"3\"\nservices:\n registry:\n container_name: docker__registry\n image: registry:2\n ports:\n - 5000:5000\n restart: always\n environment:\n - REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=\u002Fdata\n - REGISTRY_AUTH=htpasswd\n - REGISTRY_AUTH_HTPASSWD_REALM=Registry\n - REGISTRY_AUTH_HTPASSWD_PATH=\u002Fauth\u002Fregistry.password\n - REGISTRY_HTTP_SECRET=password\n - REGISTRY_STORAGE_DELETE_ENABLED=true\n volumes:\n - .\u002Fregistry\u002Fauth:\u002Fauth\n - .\u002Fregistry\u002Fdata:\u002Fdata\n ui:\n container_name: docker__ui\n image: parabuzzle\u002Fcraneoperator:latest\n ports:\n - 80:80\n restart: always\n environment:\n - REGISTRY_HOST=registry\n - REGISTRY_PORT=5000\n - REGISTRY_PROTOCOL=http\n - ALLOW_REGISTRY_LOGIN=true\n - REGISTRY_ALLOW_DELETE=true\n - USERNAME=registry\n - PASSWORD=password\n","squash-layers-on-registry","Squash layers on registry","# Try this first\ndocker run \\\n --rm anoxis\u002Fregistry-cli \\\n -r https:\u002F\u002Fregistry.url \\\n -l user:password \\\n --delete \\\n --num 2\n\n# Then this \ndocker run -it \\\n -v \u002Fpath\u002Fto\u002Fregistry\u002Fdata:\u002Fregistry \\\n -e REGISTRY_URL=https:\u002F\u002Fregistry.url \\\n -e DRY_RUN=\"false\" \\\n -e REGISTRY_AUTH=\"user:password\" \\\n mortensrasmussen\u002Fdocker-registry-manifest-cleanup\n","Private Docker Registry","\u002Fdocker\u002Fprivate-docker-registry","root","Suitable to work with ","a"," for hosting private #docker images.","This one brings up private docker registry with ui. First you'll need to generate password for it:","yaml","Sometimes you need to squash all layers in docker registry to free up disk space.","ol","li","Run this command to mark oldest layers","docker run \\"," ","container_name","image","ports"," - ","restart","always","environment","ct-a663a1"," \\")) \ No newline at end of file diff --git a/docs/docker/private-docker-registry/index.html b/docs/docker/private-docker-registry/index.html index f5b496b..486b38c 100644 --- a/docs/docker/private-docker-registry/index.html +++ b/docs/docker/private-docker-registry/index.html @@ -1,6 +1,6 @@ -Private Docker Registry • Obsidian Garden -

Private Docker Registry

Suitable to work with Drone-ci for hosting private #docker images.

Sample docker-compose for custom docker registry

This one brings up private docker registry with ui. First you'll need to generate password for it:

docker run \  --entrypoint htpasswd registry:2 \  -Bbn user mypassword > auth/registry.password
version: "3"services:  registry:    container_name: docker__registry    image: registry:2    ports:    - 5000:5000    restart: always    environment:      - REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=/data      - REGISTRY_AUTH=htpasswd      - REGISTRY_AUTH_HTPASSWD_REALM=Registry      - REGISTRY_AUTH_HTPASSWD_PATH=/auth/registry.password      - REGISTRY_HTTP_SECRET=password      - REGISTRY_STORAGE_DELETE_ENABLED=true    volumes:      - ./registry/auth:/auth      - ./registry/data:/data  ui:    container_name: docker__ui    image: parabuzzle/craneoperator:latest    ports:    - 80:80    restart: always    environment:      - REGISTRY_HOST=registry      - REGISTRY_PORT=5000      - REGISTRY_PROTOCOL=http      - ALLOW_REGISTRY_LOGIN=true      - REGISTRY_ALLOW_DELETE=true      - USERNAME=registry      - PASSWORD=password

Squash layers on registry

Sometimes you need to squash all layers in docker registry to free up disk space.

  1. Run this command to mark oldest layers
# Try this firstdocker run \  --rm anoxis/registry-cli \  -r https://registry.url \  -l user:password \  --delete \  --num 2# Then this docker run -it \    -v /path/to/registry/data:/registry \    -e REGISTRY_URL=https://registry.url \    -e DRY_RUN="false" \    -e REGISTRY_AUTH="user:password" \    mortensrasmussen/docker-registry-manifest-cleanup
btw, have a nice day
(2018 - 2024) muerwre
+

Private Docker Registry

Suitable to work with Drone-ci for hosting private #docker images.

Sample docker-compose for custom docker registry

This one brings up private docker registry with ui. First you'll need to generate password for it:

docker run \  --entrypoint htpasswd registry:2 \  -Bbn user mypassword > auth/registry.password
version: "3"services:  registry:    container_name: docker__registry    image: registry:2    ports:    - 5000:5000    restart: always    environment:      - REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY=/data      - REGISTRY_AUTH=htpasswd      - REGISTRY_AUTH_HTPASSWD_REALM=Registry      - REGISTRY_AUTH_HTPASSWD_PATH=/auth/registry.password      - REGISTRY_HTTP_SECRET=password      - REGISTRY_STORAGE_DELETE_ENABLED=true    volumes:      - ./registry/auth:/auth      - ./registry/data:/data  ui:    container_name: docker__ui    image: parabuzzle/craneoperator:latest    ports:    - 80:80    restart: always    environment:      - REGISTRY_HOST=registry      - REGISTRY_PORT=5000      - REGISTRY_PROTOCOL=http      - ALLOW_REGISTRY_LOGIN=true      - REGISTRY_ALLOW_DELETE=true      - USERNAME=registry      - PASSWORD=password

Squash layers on registry

Sometimes you need to squash all layers in docker registry to free up disk space.

  1. Run this command to mark oldest layers
# Try this firstdocker run \  --rm anoxis/registry-cli \  -r https://registry.url \  -l user:password \  --delete \  --num 2# Then this docker run -it \    -v /path/to/registry/data:/registry \    -e REGISTRY_URL=https://registry.url \    -e DRY_RUN="false" \    -e REGISTRY_AUTH="user:password" \    mortensrasmussen/docker-registry-manifest-cleanup
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/docker/refresh-containers-on-pull/_payload.js b/docs/docker/refresh-containers-on-pull/_payload.js index 248d592..608fb85 100644 --- a/docs/docker/refresh-containers-on-pull/_payload.js +++ b/docs/docker/refresh-containers-on-pull/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:t,_path:u},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-8eno4meLw0":{_path:u,_dir:"docker",_draft:n,_partial:n,_locale:"en",_empty:n,title:t,description:k,excerpt:{type:v,children:[{type:a,tag:w,props:{id:o},children:[{type:b,value:p}]},{type:a,tag:x,props:{},children:[{type:a,tag:h,props:{href:y,rel:[z]},children:[{type:b,value:A}]},{type:b,value:B},{type:a,tag:h,props:{href:C},children:[{type:b,value:D}]},{type:b,value:E},{type:a,tag:h,props:{href:l},children:[{type:b,value:l}]},{type:b,value:F}]},{type:a,tag:m,props:{code:q,language:G},children:[{type:a,tag:H,props:{},children:[{type:a,tag:m,props:{__ignoreMap:k},children:[{type:b,value:q}]}]}]}]},body:{type:v,children:[{type:a,tag:w,props:{id:o},children:[{type:b,value:p}]},{type:a,tag:x,props:{},children:[{type:a,tag:h,props:{href:y,rel:[z]},children:[{type:b,value:A}]},{type:b,value:B},{type:a,tag:h,props:{href:C},children:[{type:b,value:D}]},{type:b,value:E},{type:a,tag:h,props:{href:l},children:[{type:b,value:l}]},{type:b,value:F}]},{type:a,tag:m,props:{code:q,language:G},children:[{type:a,tag:H,props:{},children:[{type:a,tag:m,props:{__ignoreMap:k},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"version"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"3\""}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"services"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"watchtower"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"container_name"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"docker__watchtower"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"image"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"v2tec\u002Fwatchtower"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"restart"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"always"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"volumes"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:I}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\u002Fvar\u002Frun\u002Fdocker.sock:\u002Fvar\u002Frun\u002Fdocker.sock"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:I}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\u002Fhome\u002Fuser\u002F.docker\u002Fconfig.json:\u002Fconfig.json"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"command"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"--interval 60 image_1 image_2"}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-8f1978{color:#A5D6FF}.ct-d50eff{color:#C9D1D9}.ct-5e83ab{color:#7EE787}.light .ct-5e83ab{color:#268BD2}.light .ct-d50eff{color:#657B83}.light .ct-8f1978{color:#2AA198}"}]}],toc:{title:k,searchDepth:s,depth:s,links:[{id:o,depth:s,text:p}]}},_type:"markdown",_id:"content:Docker:Refresh containers on pull.md",_source:"content",_file:"Docker\u002FRefresh containers on pull.md",_extension:"md"}},prerenderedAt:1711020227001}}("element","text","span","ct-d50eff","line","ct-5e83ab","ct-8f1978","a",": "," ","","Drone-ci","code",false,"setting-up-watchtower","Setting up watchtower","version: \"3\"\n\nservices:\n watchtower:\n container_name: docker__watchtower\n image: v2tec\u002Fwatchtower\n restart: always\n volumes:\n - \u002Fvar\u002Frun\u002Fdocker.sock:\u002Fvar\u002Frun\u002Fdocker.sock\n - \u002Fhome\u002Fuser\u002F.docker\u002Fconfig.json:\u002Fconfig.json\n command: --interval 60 image_1 image_2\n",":",2,"Refresh Containers On Pull","\u002Fdocker\u002Frefresh-containers-on-pull","root","h2","p","https:\u002F\u002Fcontainrrr.dev\u002Fwatchtower\u002F","nofollow","Watchtower"," will automatically pull updated #docker containers. Can be used with ","Private%20docker%20registry","Private docker registry"," and ",".","yaml","pre"," - ")) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:t,_path:u},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-8eno4meLw0":{_path:u,_dir:"docker",_draft:n,_partial:n,_locale:"en",_empty:n,title:t,description:k,excerpt:{type:v,children:[{type:a,tag:w,props:{id:o},children:[{type:b,value:p}]},{type:a,tag:x,props:{},children:[{type:a,tag:h,props:{href:y,rel:[z]},children:[{type:b,value:A}]},{type:b,value:B},{type:a,tag:h,props:{href:C},children:[{type:b,value:D}]},{type:b,value:E},{type:a,tag:h,props:{href:l},children:[{type:b,value:l}]},{type:b,value:F}]},{type:a,tag:m,props:{code:q,language:G},children:[{type:a,tag:H,props:{},children:[{type:a,tag:m,props:{__ignoreMap:k},children:[{type:b,value:q}]}]}]}]},body:{type:v,children:[{type:a,tag:w,props:{id:o},children:[{type:b,value:p}]},{type:a,tag:x,props:{},children:[{type:a,tag:h,props:{href:y,rel:[z]},children:[{type:b,value:A}]},{type:b,value:B},{type:a,tag:h,props:{href:C},children:[{type:b,value:D}]},{type:b,value:E},{type:a,tag:h,props:{href:l},children:[{type:b,value:l}]},{type:b,value:F}]},{type:a,tag:m,props:{code:q,language:G},children:[{type:a,tag:H,props:{},children:[{type:a,tag:m,props:{__ignoreMap:k},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"version"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"3\""}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"services"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"watchtower"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"container_name"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"docker__watchtower"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"image"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"v2tec\u002Fwatchtower"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"restart"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"always"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"volumes"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:I}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\u002Fvar\u002Frun\u002Fdocker.sock:\u002Fvar\u002Frun\u002Fdocker.sock"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:I}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\u002Fhome\u002Fuser\u002F.docker\u002Fconfig.json:\u002Fconfig.json"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"command"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"--interval 60 image_1 image_2"}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-7a2acd{color:#A5D6FF}.ct-b5287a{color:#C9D1D9}.ct-1eb56c{color:#7EE787}.light .ct-1eb56c{color:#268BD2}.light .ct-b5287a{color:#657B83}.light .ct-7a2acd{color:#2AA198}"}]}],toc:{title:k,searchDepth:s,depth:s,links:[{id:o,depth:s,text:p}]}},_type:"markdown",_id:"content:Docker:Refresh containers on pull.md",_source:"content",_file:"Docker\u002FRefresh containers on pull.md",_extension:"md"}},prerenderedAt:1711020860896}}("element","text","span","ct-b5287a","line","ct-1eb56c","ct-7a2acd","a",": "," ","","Drone-ci","code",false,"setting-up-watchtower","Setting up watchtower","version: \"3\"\n\nservices:\n watchtower:\n container_name: docker__watchtower\n image: v2tec\u002Fwatchtower\n restart: always\n volumes:\n - \u002Fvar\u002Frun\u002Fdocker.sock:\u002Fvar\u002Frun\u002Fdocker.sock\n - \u002Fhome\u002Fuser\u002F.docker\u002Fconfig.json:\u002Fconfig.json\n command: --interval 60 image_1 image_2\n",":",2,"Refresh Containers On Pull","\u002Fdocker\u002Frefresh-containers-on-pull","root","h2","p","https:\u002F\u002Fcontainrrr.dev\u002Fwatchtower\u002F","nofollow","Watchtower"," will automatically pull updated #docker containers. Can be used with ","Private%20docker%20registry","Private docker registry"," and ",".","yaml","pre"," - ")) \ No newline at end of file diff --git a/docs/docker/refresh-containers-on-pull/index.html b/docs/docker/refresh-containers-on-pull/index.html index 8e3a4a6..5e95e0b 100644 --- a/docs/docker/refresh-containers-on-pull/index.html +++ b/docs/docker/refresh-containers-on-pull/index.html @@ -1,6 +1,6 @@ -Refresh Containers On Pull • Obsidian Garden -

Refresh Containers On Pull

Setting up watchtower

Watchtower will automatically pull updated #docker containers. Can be used with Private docker registry and Drone-ci.

version: "3"services:  watchtower:    container_name: docker__watchtower    image: v2tec/watchtower    restart: always    volumes:      - /var/run/docker.sock:/var/run/docker.sock      - /home/user/.docker/config.json:/config.json    command: --interval 60 image_1 image_2
btw, have a nice day
(2018 - 2024) muerwre
+

Refresh Containers On Pull

Setting up watchtower

Watchtower will automatically pull updated #docker containers. Can be used with Private docker registry and Drone-ci.

version: "3"services:  watchtower:    container_name: docker__watchtower    image: v2tec/watchtower    restart: always    volumes:      - /var/run/docker.sock:/var/run/docker.sock      - /home/user/.docker/config.json:/config.json    command: --interval 60 image_1 image_2
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/docker/seed-dump-inside-docker/_payload.js b/docs/docker/seed-dump-inside-docker/_payload.js index f20ceba..1febc51 100644 --- a/docs/docker/seed-dump-inside-docker/_payload.js +++ b/docs/docker/seed-dump-inside-docker/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:o,_path:p},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-TQfPEagSjQ":{_path:p,_dir:"docker",_draft:j,_partial:j,_locale:"en",_empty:j,title:o,description:"If you need to seed .sql dump in #docker container, just run this command. Also you can try to rsync file with SSH to get it from remote host.",excerpt:{type:q,children:[{type:a,tag:r,props:{},children:[{type:b,value:s},{type:a,tag:t,props:{},children:[{type:b,value:u}]},{type:b,value:v},{type:a,tag:w,props:{href:x},children:[{type:b,value:y}]},{type:b,value:z}]},{type:a,tag:i,props:{code:k,language:A},children:[{type:a,tag:B,props:{},children:[{type:a,tag:i,props:{__ignoreMap:l},children:[{type:b,value:k}]}]}]}]},body:{type:q,children:[{type:a,tag:r,props:{},children:[{type:b,value:s},{type:a,tag:t,props:{},children:[{type:b,value:u}]},{type:b,value:v},{type:a,tag:w,props:{href:x},children:[{type:b,value:y}]},{type:b,value:z}]},{type:a,tag:i,props:{code:k,language:A},children:[{type:a,tag:B,props:{},children:[{type:a,tag:i,props:{__ignoreMap:l},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:m},children:[{type:b,value:C}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:m},children:[{type:b,value:"# usage: .\u002Fscript.sh \"\u002Fpath\u002Fto\u002Fdump.sql\""}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:m},children:[{type:b,value:C}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"DUMP_PATH="}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"1"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"CONTAINER="}]},{type:a,tag:c,props:{class:n},children:[{type:b,value:"\"db\""}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"USER=root"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"PASSWORD=password"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"DB=database"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"cat "}]},{type:a,tag:c,props:{class:n},children:[{type:b,value:D}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"DUMP_PATH"}]},{type:a,tag:c,props:{class:n},children:[{type:b,value:D}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:"ct-6812d8"},children:[{type:b,value:"|"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" docker "}]},{type:a,tag:c,props:{class:"ct-d59a0f"},children:[{type:b,value:"exec"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" -i "}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"CONTAINER"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" mysql -u"}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"USER"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" -p"}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"PASSWORD"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"DB"}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-d59a0f{color:#79C0FF}.ct-6812d8{color:#FF7B72}.ct-192c0b{color:#A5D6FF}.ct-0d02f9{color:#C9D1D9}.ct-fb993e{color:#C9D1D9}.ct-1df564{color:#C9D1D9}.ct-835db9{color:#8B949E}.light .ct-835db9{color:#93A1A1}.light .ct-1df564{color:#657B83}.light .ct-fb993e{color:#859900}.light .ct-0d02f9{color:#268BD2}.light .ct-192c0b{color:#2AA198}.light .ct-6812d8{color:#859900}.light .ct-d59a0f{color:#268BD2}"}]}],toc:{title:l,searchDepth:F,depth:F,links:[]}},_type:"markdown",_id:"content:Docker:Seed dump inside docker.md",_source:"content",_file:"Docker\u002FSeed dump inside docker.md",_extension:"md"}},prerenderedAt:1711020227026}}("element","text","span","ct-1df564","line","ct-fb993e","$","ct-0d02f9","code",false,"#####\n# usage: .\u002Fscript.sh \"\u002Fpath\u002Fto\u002Fdump.sql\"\n#####\n\nDUMP_PATH=$1\nCONTAINER=\"db\"\nUSER=root\nPASSWORD=password\nDB=database\n\ncat \"$DUMP_PATH\" | docker exec -i $CONTAINER mysql -u$USER -p$PASSWORD $DB\n","","ct-835db9","ct-192c0b","Seed Dump Inside Docker","\u002Fdocker\u002Fseed-dump-inside-docker","root","p","If you need to seed ","code-inline",".sql"," dump in #docker container, just run this command. Also you can try to ","a","\u002Flinux\u002FRsync%20file%20with%20SSH","rsync file with SSH"," to get it from remote host.","shell","pre","#####","\""," ",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:o,_path:p},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-TQfPEagSjQ":{_path:p,_dir:"docker",_draft:j,_partial:j,_locale:"en",_empty:j,title:o,description:"If you need to seed .sql dump in #docker container, just run this command. Also you can try to rsync file with SSH to get it from remote host.",excerpt:{type:q,children:[{type:a,tag:r,props:{},children:[{type:b,value:s},{type:a,tag:t,props:{},children:[{type:b,value:u}]},{type:b,value:v},{type:a,tag:w,props:{href:x},children:[{type:b,value:y}]},{type:b,value:z}]},{type:a,tag:i,props:{code:k,language:A},children:[{type:a,tag:B,props:{},children:[{type:a,tag:i,props:{__ignoreMap:l},children:[{type:b,value:k}]}]}]}]},body:{type:q,children:[{type:a,tag:r,props:{},children:[{type:b,value:s},{type:a,tag:t,props:{},children:[{type:b,value:u}]},{type:b,value:v},{type:a,tag:w,props:{href:x},children:[{type:b,value:y}]},{type:b,value:z}]},{type:a,tag:i,props:{code:k,language:A},children:[{type:a,tag:B,props:{},children:[{type:a,tag:i,props:{__ignoreMap:l},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:m},children:[{type:b,value:C}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:m},children:[{type:b,value:"# usage: .\u002Fscript.sh \"\u002Fpath\u002Fto\u002Fdump.sql\""}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:m},children:[{type:b,value:C}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"DUMP_PATH="}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"1"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"CONTAINER="}]},{type:a,tag:c,props:{class:n},children:[{type:b,value:"\"db\""}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"USER=root"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"PASSWORD=password"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"DB=database"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"cat "}]},{type:a,tag:c,props:{class:n},children:[{type:b,value:D}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"DUMP_PATH"}]},{type:a,tag:c,props:{class:n},children:[{type:b,value:D}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:"ct-e38e69"},children:[{type:b,value:"|"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" docker "}]},{type:a,tag:c,props:{class:"ct-010366"},children:[{type:b,value:"exec"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" -i "}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"CONTAINER"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" mysql -u"}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"USER"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" -p"}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"PASSWORD"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"DB"}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-010366{color:#79C0FF}.ct-e38e69{color:#FF7B72}.ct-919b14{color:#A5D6FF}.ct-f3d07f{color:#C9D1D9}.ct-0f4d33{color:#C9D1D9}.ct-7b2cb4{color:#C9D1D9}.ct-a24274{color:#8B949E}.light .ct-a24274{color:#93A1A1}.light .ct-7b2cb4{color:#657B83}.light .ct-0f4d33{color:#859900}.light .ct-f3d07f{color:#268BD2}.light .ct-919b14{color:#2AA198}.light .ct-e38e69{color:#859900}.light .ct-010366{color:#268BD2}"}]}],toc:{title:l,searchDepth:F,depth:F,links:[]}},_type:"markdown",_id:"content:Docker:Seed dump inside docker.md",_source:"content",_file:"Docker\u002FSeed dump inside docker.md",_extension:"md"}},prerenderedAt:1711020860925}}("element","text","span","ct-7b2cb4","line","ct-0f4d33","$","ct-f3d07f","code",false,"#####\n# usage: .\u002Fscript.sh \"\u002Fpath\u002Fto\u002Fdump.sql\"\n#####\n\nDUMP_PATH=$1\nCONTAINER=\"db\"\nUSER=root\nPASSWORD=password\nDB=database\n\ncat \"$DUMP_PATH\" | docker exec -i $CONTAINER mysql -u$USER -p$PASSWORD $DB\n","","ct-a24274","ct-919b14","Seed Dump Inside Docker","\u002Fdocker\u002Fseed-dump-inside-docker","root","p","If you need to seed ","code-inline",".sql"," dump in #docker container, just run this command. Also you can try to ","a","\u002Flinux\u002FRsync%20file%20with%20SSH","rsync file with SSH"," to get it from remote host.","shell","pre","#####","\""," ",2)) \ No newline at end of file diff --git a/docs/docker/seed-dump-inside-docker/index.html b/docs/docker/seed-dump-inside-docker/index.html index 53e471a..6fcb3d6 100644 --- a/docs/docker/seed-dump-inside-docker/index.html +++ b/docs/docker/seed-dump-inside-docker/index.html @@ -1,6 +1,6 @@ -Seed Dump Inside Docker • Obsidian Garden -

Seed Dump Inside Docker

If you need to seed .sql dump in #docker container, just run this command. Also you can try to rsync file with SSH to get it from remote host.

###### usage: ./script.sh "/path/to/dump.sql"#####DUMP_PATH=$1CONTAINER="db"USER=rootPASSWORD=passwordDB=databasecat "$DUMP_PATH" | docker exec -i $CONTAINER mysql -u$USER -p$PASSWORD $DB
btw, have a nice day
(2018 - 2024) muerwre
+

Seed Dump Inside Docker

If you need to seed .sql dump in #docker container, just run this command. Also you can try to rsync file with SSH to get it from remote host.

###### usage: ./script.sh "/path/to/dump.sql"#####DUMP_PATH=$1CONTAINER="db"USER=rootPASSWORD=passwordDB=databasecat "$DUMP_PATH" | docker exec -i $CONTAINER mysql -u$USER -p$PASSWORD $DB
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/docker/wait-for-mysql/_payload.js b/docs/docker/wait-for-mysql/_payload.js index e10469a..77e5908 100644 --- a/docs/docker/wait-for-mysql/_payload.js +++ b/docs/docker/wait-for-mysql/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:z,_path:A},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-LRHpXC9dvS":{_path:A,_dir:"docker",_draft:r,_partial:r,_locale:"en",_empty:r,title:z,description:"wait-for-it.sh doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before #mysql is ready to accept connections",excerpt:{type:B,children:[{type:a,tag:i,props:{},children:[{type:a,tag:m,props:{href:C,rel:[D]},children:[{type:c,value:E}]},{type:c,value:F}]},{type:a,tag:i,props:{},children:[{type:c,value:G}]},{type:a,tag:i,props:{},children:[{type:c,value:H},{type:a,tag:I,props:{},children:[{type:c,value:J}]},{type:c,value:K}]},{type:a,tag:n,props:{code:s,language:L},children:[{type:a,tag:M,props:{},children:[{type:a,tag:n,props:{__ignoreMap:t},children:[{type:c,value:s}]}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:m,props:{href:N},children:[{type:c,value:O}]}]}]},body:{type:B,children:[{type:a,tag:i,props:{},children:[{type:a,tag:m,props:{href:C,rel:[D]},children:[{type:c,value:E}]},{type:c,value:F}]},{type:a,tag:i,props:{},children:[{type:c,value:G}]},{type:a,tag:i,props:{},children:[{type:c,value:H},{type:a,tag:I,props:{},children:[{type:c,value:J}]},{type:c,value:K}]},{type:a,tag:n,props:{code:s,language:L},children:[{type:a,tag:M,props:{},children:[{type:a,tag:n,props:{__ignoreMap:t},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:u},children:[{type:c,value:"# Waits for mysql to become actually available"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:"ct-fcae9b"},children:[{type:c,value:"wait_for_mysql"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"() {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" query="}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"\"SELECT count(*) FROM users\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" timeout=180 "}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"# 3 minutes limit"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" i=0"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"while"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"!"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" docker "}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:"exec"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" -it "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" mysql --user="}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"2"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" -e "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"query"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"do"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" sleep 1"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" i="}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"$(("}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"+"}]},{type:a,tag:b,props:{class:"ct-2c5bcb"},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"))"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"if"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" [[ "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"-ge"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"timeout"}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" ]]"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"then"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:"echo"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"\"[Error] can't properly query MySQL after "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:" secs\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:"exit"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" 1"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"fi"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"done"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:u},children:[{type:c,value:"# usage: wait_for_mysql miin-mysql-dev root password database"}]}]}]}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:m,props:{href:N},children:[{type:c,value:O}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-2c5bcb{color:#79C0FF}.ct-32fef5{color:#C9D1D9}.ct-f2f437{color:#C9D1D9}.ct-5b78c6{color:#79C0FF}.ct-09cbe0{color:#FF7B72}.ct-30990b{color:#A5D6FF}.ct-088cdc{color:#C9D1D9}.ct-fcae9b{color:#D2A8FF}.ct-ee899c{color:#8B949E}.light .ct-ee899c{color:#93A1A1}.light .ct-fcae9b{color:#268BD2}.light .ct-088cdc{color:#657B83}.light .ct-30990b{color:#2AA198}.light .ct-09cbe0{color:#859900}.light .ct-5b78c6{color:#268BD2}.light .ct-f2f437{color:#859900}.light .ct-32fef5{color:#268BD2}.light .ct-2c5bcb{color:#D33682}"}]}],toc:{title:t,searchDepth:S,depth:S,links:[]}},_type:"markdown",_id:"content:Docker:Wait for mysql.md",_source:"content",_file:"Docker\u002FWait for mysql.md",_extension:"md"}},prerenderedAt:1711020227050}}("element","span","text","ct-088cdc","line","ct-30990b","ct-09cbe0","ct-f2f437","p","\"","ct-32fef5"," ","a","code"," ","$","}",false,"# Waits for mysql to become actually available\nwait_for_mysql() {\n query=\"SELECT count(*) FROM users\"\n \n timeout=180 # 3 minutes limit\n i=0\n \n while ! docker exec -it \"$1\" mysql --user=\"$2\" --password=\"$3\" -e \"$query\" $4 \u003E\u002Fdev\u002Fnull 2\u003E&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly query MySQL after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_mysql miin-mysql-dev root password database\n","","ct-ee899c","ct-5b78c6",";","i","${","Wait For Mysql","\u002Fdocker\u002Fwait-for-mysql","root","https:\u002F\u002Fgithub.com\u002Fvishnubob\u002Fwait-for-it","nofollow","wait-for-it.sh"," doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before #mysql is ready to accept connections","This script waits for first successful query from database or exits with non-zero status after timeout.","Don't forget to change ","code-inline","$query"," for the actually working one.","shell","pre","Wait%20for%20redis","Wait for redis","1"," "," ",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:z,_path:A},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-LRHpXC9dvS":{_path:A,_dir:"docker",_draft:r,_partial:r,_locale:"en",_empty:r,title:z,description:"wait-for-it.sh doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before #mysql is ready to accept connections",excerpt:{type:B,children:[{type:a,tag:i,props:{},children:[{type:a,tag:m,props:{href:C,rel:[D]},children:[{type:c,value:E}]},{type:c,value:F}]},{type:a,tag:i,props:{},children:[{type:c,value:G}]},{type:a,tag:i,props:{},children:[{type:c,value:H},{type:a,tag:I,props:{},children:[{type:c,value:J}]},{type:c,value:K}]},{type:a,tag:n,props:{code:s,language:L},children:[{type:a,tag:M,props:{},children:[{type:a,tag:n,props:{__ignoreMap:t},children:[{type:c,value:s}]}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:m,props:{href:N},children:[{type:c,value:O}]}]}]},body:{type:B,children:[{type:a,tag:i,props:{},children:[{type:a,tag:m,props:{href:C,rel:[D]},children:[{type:c,value:E}]},{type:c,value:F}]},{type:a,tag:i,props:{},children:[{type:c,value:G}]},{type:a,tag:i,props:{},children:[{type:c,value:H},{type:a,tag:I,props:{},children:[{type:c,value:J}]},{type:c,value:K}]},{type:a,tag:n,props:{code:s,language:L},children:[{type:a,tag:M,props:{},children:[{type:a,tag:n,props:{__ignoreMap:t},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:u},children:[{type:c,value:"# Waits for mysql to become actually available"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:"ct-46a328"},children:[{type:c,value:"wait_for_mysql"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"() {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" query="}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"\"SELECT count(*) FROM users\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" timeout=180 "}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"# 3 minutes limit"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" i=0"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"while"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"!"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" docker "}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:"exec"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" -it "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" mysql --user="}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"2"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" -e "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"query"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"do"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" sleep 1"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" i="}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"$(("}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"+"}]},{type:a,tag:b,props:{class:"ct-ad6a7c"},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"))"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"if"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" [[ "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"-ge"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"timeout"}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" ]]"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"then"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:"echo"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"\"[Error] can't properly query MySQL after "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:" secs\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:"exit"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" 1"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"fi"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"done"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:u},children:[{type:c,value:"# usage: wait_for_mysql miin-mysql-dev root password database"}]}]}]}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:m,props:{href:N},children:[{type:c,value:O}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-ad6a7c{color:#79C0FF}.ct-b5713d{color:#C9D1D9}.ct-7edd79{color:#C9D1D9}.ct-174785{color:#79C0FF}.ct-bb4b9c{color:#FF7B72}.ct-4afbe3{color:#A5D6FF}.ct-ec2995{color:#C9D1D9}.ct-46a328{color:#D2A8FF}.ct-5b14eb{color:#8B949E}.light .ct-5b14eb{color:#93A1A1}.light .ct-46a328{color:#268BD2}.light .ct-ec2995{color:#657B83}.light .ct-4afbe3{color:#2AA198}.light .ct-bb4b9c{color:#859900}.light .ct-174785{color:#268BD2}.light .ct-7edd79{color:#859900}.light .ct-b5713d{color:#268BD2}.light .ct-ad6a7c{color:#D33682}"}]}],toc:{title:t,searchDepth:S,depth:S,links:[]}},_type:"markdown",_id:"content:Docker:Wait for mysql.md",_source:"content",_file:"Docker\u002FWait for mysql.md",_extension:"md"}},prerenderedAt:1711020860958}}("element","span","text","ct-ec2995","line","ct-4afbe3","ct-bb4b9c","ct-7edd79","p","\"","ct-b5713d"," ","a","code"," ","$","}",false,"# Waits for mysql to become actually available\nwait_for_mysql() {\n query=\"SELECT count(*) FROM users\"\n \n timeout=180 # 3 minutes limit\n i=0\n \n while ! docker exec -it \"$1\" mysql --user=\"$2\" --password=\"$3\" -e \"$query\" $4 \u003E\u002Fdev\u002Fnull 2\u003E&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly query MySQL after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_mysql miin-mysql-dev root password database\n","","ct-5b14eb","ct-174785",";","i","${","Wait For Mysql","\u002Fdocker\u002Fwait-for-mysql","root","https:\u002F\u002Fgithub.com\u002Fvishnubob\u002Fwait-for-it","nofollow","wait-for-it.sh"," doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before #mysql is ready to accept connections","This script waits for first successful query from database or exits with non-zero status after timeout.","Don't forget to change ","code-inline","$query"," for the actually working one.","shell","pre","Wait%20for%20redis","Wait for redis","1"," "," ",2)) \ No newline at end of file diff --git a/docs/docker/wait-for-mysql/index.html b/docs/docker/wait-for-mysql/index.html index 2bcd225..a737546 100644 --- a/docs/docker/wait-for-mysql/index.html +++ b/docs/docker/wait-for-mysql/index.html @@ -1,6 +1,6 @@ -Wait For Mysql • Obsidian Garden -

Wait For Mysql

wait-for-it.sh doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before #mysql is ready to accept connections

This script waits for first successful query from database or exits with non-zero status after timeout.

Don't forget to change $query for the actually working one.

# Waits for mysql to become actually availablewait_for_mysql() {  query="SELECT count(*) FROM users"    timeout=180 # 3 minutes limit  i=0    while ! docker exec -it "$1" mysql --user="$2"" -e "$query" do    sleep 1;    i=$(($i+1))    if [[ ${i} -ge ${timeout} ]]; then      echo "[Error] can't properly query MySQL after ${i} secs"      exit 1;    fi  done}# usage: wait_for_mysql miin-mysql-dev root password database

Wait for redis

btw, have a nice day
(2018 - 2024) muerwre
+

Wait For Mysql

wait-for-it.sh doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before #mysql is ready to accept connections

This script waits for first successful query from database or exits with non-zero status after timeout.

Don't forget to change $query for the actually working one.

# Waits for mysql to become actually availablewait_for_mysql() {  query="SELECT count(*) FROM users"    timeout=180 # 3 minutes limit  i=0    while ! docker exec -it "$1" mysql --user="$2"" -e "$query" do    sleep 1;    i=$(($i+1))    if [[ ${i} -ge ${timeout} ]]; then      echo "[Error] can't properly query MySQL after ${i} secs"      exit 1;    fi  done}# usage: wait_for_mysql miin-mysql-dev root password database

Wait for redis

btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/docker/wait-for-redis/_payload.js b/docs/docker/wait-for-redis/_payload.js index 312c4d5..8bc8c35 100644 --- a/docs/docker/wait-for-redis/_payload.js +++ b/docs/docker/wait-for-redis/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:y,_path:z}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-Wzyty7vOmU":{_path:z,_dir:"docker",_draft:p,_partial:p,_locale:"en",_empty:p,title:y,description:"wait-for-it.sh doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before redis is ready to accept connections",excerpt:{type:A,children:[{type:a,tag:j,props:{},children:[{type:a,tag:l,props:{href:B,rel:[C]},children:[{type:c,value:D}]},{type:c,value:E}]},{type:a,tag:j,props:{},children:[{type:c,value:F}]},{type:a,tag:m,props:{code:q,language:G},children:[{type:a,tag:H,props:{},children:[{type:a,tag:m,props:{__ignoreMap:r},children:[{type:c,value:q}]}]}]},{type:a,tag:j,props:{},children:[{type:a,tag:l,props:{href:I},children:[{type:c,value:J}]}]}]},body:{type:A,children:[{type:a,tag:j,props:{},children:[{type:a,tag:l,props:{href:B,rel:[C]},children:[{type:c,value:D}]},{type:c,value:E}]},{type:a,tag:j,props:{},children:[{type:c,value:F}]},{type:a,tag:m,props:{code:q,language:G},children:[{type:a,tag:H,props:{},children:[{type:a,tag:m,props:{__ignoreMap:r},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:"# Waits for redis to become actually available"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:"ct-6003c4"},children:[{type:c,value:"wait_for_redis"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"() {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" timeout=180 "}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"# 3 minutes"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" i=0"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"while"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"!"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" docker "}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:"exec"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" -it "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" redis-cli -h localhost -p 6379 -a "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"2"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" ping "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"|"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" grep "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"PONG\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"\u003E"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"\u002Fdev\u002Fnull "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"2\u003E&1;"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"do"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" sleep 1"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" i="}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"$(("}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"+"}]},{type:a,tag:b,props:{class:"ct-300474"},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"))"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"if"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" [[ "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"-ge"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"timeout"}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" ]]"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"then"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:"echo"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"[Error] can't properly ping Redis container after "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:" secs\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:"exit"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" 1"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"fi"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"done"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:"# usage: wait_for_redis miin-redis-dev password"}]}]}]}]}]},{type:a,tag:j,props:{},children:[{type:a,tag:l,props:{href:I},children:[{type:c,value:J}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-300474{color:#79C0FF}.ct-3c6a3e{color:#C9D1D9}.ct-45c1f7{color:#C9D1D9}.ct-1a89b4{color:#A5D6FF}.ct-f19cb2{color:#79C0FF}.ct-8a1f59{color:#FF7B72}.ct-20f250{color:#C9D1D9}.ct-6003c4{color:#D2A8FF}.ct-763b9c{color:#8B949E}.light .ct-763b9c{color:#93A1A1}.light .ct-6003c4{color:#268BD2}.light .ct-20f250{color:#657B83}.light .ct-8a1f59{color:#859900}.light .ct-f19cb2{color:#268BD2}.light .ct-1a89b4{color:#2AA198}.light .ct-45c1f7{color:#859900}.light .ct-3c6a3e{color:#268BD2}.light .ct-300474{color:#D33682}"}]}],toc:{title:r,searchDepth:O,depth:O,links:[]}},_type:"markdown",_id:"content:Docker:Wait for redis.md",_source:"content",_file:"Docker\u002FWait for redis.md",_extension:"md"}},prerenderedAt:1711020227073}}("element","span","text","ct-20f250","line","ct-8a1f59","ct-1a89b4","ct-45c1f7"," ","p","ct-3c6a3e","a","code","\"","}",false,"# Waits for redis to become actually available\nwait_for_redis() {\n timeout=180 # 3 minutes\n i=0\n while ! docker exec -it \"$1\" redis-cli -h localhost -p 6379 -a \"$2\" ping | grep \"PONG\" \u003E\u002Fdev\u002Fnull 2\u003E&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly ping Redis container after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_redis miin-redis-dev password\n","","ct-763b9c","ct-f19cb2","$",";","i","${","Wait For Redis","\u002Fdocker\u002Fwait-for-redis","root","https:\u002F\u002Fgithub.com\u002Fvishnubob\u002Fwait-for-it","nofollow","wait-for-it.sh"," doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before redis is ready to accept connections","This script waits for first successful ping or exits with non-zero status after 3 minutes.","shell","pre","Wait%20for%20mysql","Wait for mysql"," ","1"," "," ",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:y,_path:z}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-Wzyty7vOmU":{_path:z,_dir:"docker",_draft:p,_partial:p,_locale:"en",_empty:p,title:y,description:"wait-for-it.sh doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before redis is ready to accept connections",excerpt:{type:A,children:[{type:a,tag:j,props:{},children:[{type:a,tag:l,props:{href:B,rel:[C]},children:[{type:c,value:D}]},{type:c,value:E}]},{type:a,tag:j,props:{},children:[{type:c,value:F}]},{type:a,tag:m,props:{code:q,language:G},children:[{type:a,tag:H,props:{},children:[{type:a,tag:m,props:{__ignoreMap:r},children:[{type:c,value:q}]}]}]},{type:a,tag:j,props:{},children:[{type:a,tag:l,props:{href:I},children:[{type:c,value:J}]}]}]},body:{type:A,children:[{type:a,tag:j,props:{},children:[{type:a,tag:l,props:{href:B,rel:[C]},children:[{type:c,value:D}]},{type:c,value:E}]},{type:a,tag:j,props:{},children:[{type:c,value:F}]},{type:a,tag:m,props:{code:q,language:G},children:[{type:a,tag:H,props:{},children:[{type:a,tag:m,props:{__ignoreMap:r},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:"# Waits for redis to become actually available"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:"ct-a45584"},children:[{type:c,value:"wait_for_redis"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"() {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" timeout=180 "}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"# 3 minutes"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" i=0"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"while"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"!"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" docker "}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:"exec"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" -it "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" redis-cli -h localhost -p 6379 -a "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"2"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" ping "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"|"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" grep "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"PONG\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"\u003E"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"\u002Fdev\u002Fnull "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"2\u003E&1;"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"do"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" sleep 1"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" i="}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"$(("}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"+"}]},{type:a,tag:b,props:{class:"ct-e51a4c"},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"))"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"if"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" [[ "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"-ge"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"timeout"}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" ]]"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"then"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:"echo"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"[Error] can't properly ping Redis container after "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:" secs\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:"exit"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" 1"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"fi"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"done"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:"# usage: wait_for_redis miin-redis-dev password"}]}]}]}]}]},{type:a,tag:j,props:{},children:[{type:a,tag:l,props:{href:I},children:[{type:c,value:J}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-e51a4c{color:#79C0FF}.ct-9f136f{color:#C9D1D9}.ct-1904d6{color:#C9D1D9}.ct-5a6fca{color:#A5D6FF}.ct-48c63c{color:#79C0FF}.ct-363153{color:#FF7B72}.ct-717443{color:#C9D1D9}.ct-a45584{color:#D2A8FF}.ct-3d82fe{color:#8B949E}.light .ct-3d82fe{color:#93A1A1}.light .ct-a45584{color:#268BD2}.light .ct-717443{color:#657B83}.light .ct-363153{color:#859900}.light .ct-48c63c{color:#268BD2}.light .ct-5a6fca{color:#2AA198}.light .ct-1904d6{color:#859900}.light .ct-9f136f{color:#268BD2}.light .ct-e51a4c{color:#D33682}"}]}],toc:{title:r,searchDepth:O,depth:O,links:[]}},_type:"markdown",_id:"content:Docker:Wait for redis.md",_source:"content",_file:"Docker\u002FWait for redis.md",_extension:"md"}},prerenderedAt:1711020860993}}("element","span","text","ct-717443","line","ct-363153","ct-5a6fca","ct-1904d6"," ","p","ct-9f136f","a","code","\"","}",false,"# Waits for redis to become actually available\nwait_for_redis() {\n timeout=180 # 3 minutes\n i=0\n while ! docker exec -it \"$1\" redis-cli -h localhost -p 6379 -a \"$2\" ping | grep \"PONG\" \u003E\u002Fdev\u002Fnull 2\u003E&1; do\n sleep 1;\n\n i=$(($i+1))\n if [[ ${i} -ge ${timeout} ]]; then\n echo \"[Error] can't properly ping Redis container after ${i} secs\"\n exit 1;\n fi\n done\n}\n\n# usage: wait_for_redis miin-redis-dev password\n","","ct-3d82fe","ct-48c63c","$",";","i","${","Wait For Redis","\u002Fdocker\u002Fwait-for-redis","root","https:\u002F\u002Fgithub.com\u002Fvishnubob\u002Fwait-for-it","nofollow","wait-for-it.sh"," doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before redis is ready to accept connections","This script waits for first successful ping or exits with non-zero status after 3 minutes.","shell","pre","Wait%20for%20mysql","Wait for mysql"," ","1"," "," ",2)) \ No newline at end of file diff --git a/docs/docker/wait-for-redis/index.html b/docs/docker/wait-for-redis/index.html index f8b6bef..a58d523 100644 --- a/docs/docker/wait-for-redis/index.html +++ b/docs/docker/wait-for-redis/index.html @@ -1,6 +1,6 @@ -Wait For Redis • Obsidian Garden -

Wait For Redis

wait-for-it.sh doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before redis is ready to accept connections

This script waits for first successful ping or exits with non-zero status after 3 minutes.

# Waits for redis to become actually availablewait_for_redis() {  timeout=180 # 3 minutes  i=0  while ! docker exec -it "$1" redis-cli -h localhost -p 6379 -a "$2" ping | grep "PONG" >/dev/null 2>&1; do    sleep 1;    i=$(($i+1))    if [[ ${i} -ge ${timeout} ]]; then      echo "[Error] can't properly ping Redis container after ${i} secs"      exit 1;    fi  done}# usage: wait_for_redis miin-redis-dev password

Wait for mysql

btw, have a nice day
(2018 - 2024) muerwre
+

Wait For Redis

wait-for-it.sh doing a great job of waiting for different services to become alive, but on #MacOs #docker is binding port on container start, seconds before redis is ready to accept connections

This script waits for first successful ping or exits with non-zero status after 3 minutes.

# Waits for redis to become actually availablewait_for_redis() {  timeout=180 # 3 minutes  i=0  while ! docker exec -it "$1" redis-cli -h localhost -p 6379 -a "$2" ping | grep "PONG" >/dev/null 2>&1; do    sleep 1;    i=$(($i+1))    if [[ ${i} -ge ${timeout} ]]; then      echo "[Error] can't properly ping Redis container after ${i} secs"      exit 1;    fi  done}# usage: wait_for_redis miin-redis-dev password

Wait for mysql

btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/frontend/react-native/oauth2-login/_payload.js b/docs/frontend/react-native/oauth2-login/_payload.js index bd77c67..e15527a 100644 --- a/docs/frontend/react-native/oauth2-login/_payload.js +++ b/docs/frontend/react-native/oauth2-login/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:U,_path:V},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-zuvbG5OO4q":{_path:V,_dir:"react-native",_draft:A,_partial:A,_locale:"en",_empty:A,title:U,description:B,excerpt:{type:W,children:[{type:a,tag:l,props:{},children:[{type:b,value:B}]},{type:a,tag:r,props:{id:C},children:[{type:b,value:D}]},{type:a,tag:l,props:{},children:[{type:b,value:X},{type:a,tag:m,props:{href:s},children:[{type:b,value:s}]},{type:b,value:Y},{type:a,tag:Z,props:{},children:[{type:b,value:_}]},{type:b,value:E}]},{type:a,tag:t,props:{id:F},children:[{type:b,value:G}]},{type:a,tag:k,props:{code:H,language:u},children:[{type:a,tag:v,props:{},children:[{type:a,tag:k,props:{__ignoreMap:q},children:[{type:b,value:H}]}]}]},{type:a,tag:t,props:{id:I},children:[{type:b,value:J}]},{type:a,tag:k,props:{code:K,language:u},children:[{type:a,tag:v,props:{},children:[{type:a,tag:k,props:{__ignoreMap:q},children:[{type:b,value:K}]}]}]},{type:a,tag:r,props:{id:L},children:[{type:b,value:M}]},{type:a,tag:l,props:{},children:[{type:a,tag:m,props:{href:$,rel:[w]},children:[{type:b,value:aa}]},{type:b,value:ab},{type:a,tag:m,props:{href:ac,rel:[w]},children:[{type:b,value:ad}]},{type:b,value:ae}]}]},body:{type:W,children:[{type:a,tag:l,props:{},children:[{type:b,value:B}]},{type:a,tag:r,props:{id:C},children:[{type:b,value:D}]},{type:a,tag:l,props:{},children:[{type:b,value:X},{type:a,tag:m,props:{href:s},children:[{type:b,value:s}]},{type:b,value:Y},{type:a,tag:Z,props:{},children:[{type:b,value:_}]},{type:b,value:E}]},{type:a,tag:t,props:{id:F},children:[{type:b,value:G}]},{type:a,tag:k,props:{code:H,language:u},children:[{type:a,tag:v,props:{},children:[{type:a,tag:k,props:{__ignoreMap:q},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:i},children:[{type:b,value:"import"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" { "}]},{type:a,tag:c,props:{class:N},children:[{type:b,value:O}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" } "}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:"from"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"'react-native-app-auth'"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:x}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:n},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:af}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:P}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:x}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:Q},children:[{type:b,value:"\u002F\u002F ..."}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:n},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:R}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:ag}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:S},children:[{type:b,value:O}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:ah}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" issuer: "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"'https:\u002F\u002Faccounts.google.com'"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ai}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:aj}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:af}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"}.apps.googleusercontent.com`"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ak}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"`com.yourapp:\u002Foauth2redirect\u002Fgoogle`"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:al}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"'openid'"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:am}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"'profile'"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:an}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ao}]},{type:a,tag:c,props:{class:ap},children:[{type:b,value:aq}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ar}]}]}]}]}]},{type:a,tag:t,props:{id:I},children:[{type:b,value:J}]},{type:a,tag:k,props:{code:K,language:u},children:[{type:a,tag:v,props:{},children:[{type:a,tag:k,props:{__ignoreMap:q},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:n},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:y}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:P}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:x}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:n},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:as}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:P}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"; "}]},{type:a,tag:c,props:{class:Q},children:[{type:b,value:"\u002F\u002F better hide it somehow"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:n},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:T}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"'com.yourapp'"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:x}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:n},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:R}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:ag}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:S},children:[{type:b,value:O}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:ah}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" serviceConfiguration: {"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" authorizationEndpoint: "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"`https:\u002F\u002Foauth.yandex.ru\u002Fauthorize?response_type=code&client_id=${"}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:y}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"}&redirect_uri=${"}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:T}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:at}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:Q},children:[{type:b,value:"\u002F\u002F TODO: replace it with your own backend to secure client_secret:"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" tokenEndpoint: "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"`https:\u002F\u002Foauth.yandex.ru\u002Ftoken?grant_type=authorization_code&client_id=${"}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:y}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"}&client_secret=${"}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:as}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"}`"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" },"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ai}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:y}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ak}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:aj}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:T}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:at}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:al}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"'login:info'"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:am}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"'login:avatar'"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:an}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ao}]},{type:a,tag:c,props:{class:ap},children:[{type:b,value:aq}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ar}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:S},children:[{type:b,value:"callback"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"("}]},{type:a,tag:c,props:{class:N},children:[{type:b,value:R}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:N},children:[{type:b,value:"accessToken"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:");"}]}]}]}]}]},{type:a,tag:r,props:{id:L},children:[{type:b,value:M}]},{type:a,tag:l,props:{},children:[{type:a,tag:m,props:{href:$,rel:[w]},children:[{type:b,value:aa}]},{type:b,value:ab},{type:a,tag:m,props:{href:ac,rel:[w]},children:[{type:b,value:ad}]},{type:b,value:ae}]},{type:a,tag:"style",children:[{type:b,value:".ct-919484{color:#79C0FF}.ct-d5d2b2{color:#D2A8FF}.ct-719333{color:#8B949E}.ct-b47256{color:#79C0FF}.ct-6e5da4{color:#FF7B72}.ct-e50739{color:#A5D6FF}.ct-868453{color:#C9D1D9}.ct-f06536{color:#C9D1D9}.ct-eaff2e{color:#FF7B72}.light .ct-eaff2e{color:#859900}.light .ct-f06536{color:#657B83}.light .ct-868453{color:#268BD2}.light .ct-e50739{color:#2AA198}.light .ct-6e5da4{color:#073642}.light .ct-b47256{color:#268BD2}.light .ct-719333{color:#93A1A1}.light .ct-d5d2b2{color:#268BD2}.light .ct-919484{color:#B58900}"}]}],toc:{title:q,searchDepth:z,depth:z,links:[{id:C,depth:z,text:D,children:[{id:F,depth:au,text:G},{id:I,depth:au,text:J}]},{id:L,depth:z,text:M}]}},_type:"markdown",_id:"content:Frontend:React Native:OAuth2 login.md",_source:"content",_file:"Frontend\u002FReact Native\u002FOAuth2 login.md",_extension:"md"}},prerenderedAt:1711020227099}}("element","text","span","ct-f06536","line"," ","ct-e50739","ct-b47256","ct-eaff2e",",","code","p","a","ct-6e5da4","const","=","","h2","react-native-app-auth","h3","typescript","pre","nofollow",";","YANDEX_OAUTH_CLIENT",2,false,"Use #oauth2 login with React-Native","common-oauth2-providers","Common OAuth2 providers",".","example-for-google","Example for #Google","import { authorize } from 'react-native-app-auth';\n\nconst GOOGLE_OAUTH_CLIENT = '...';\n\n\u002F\u002F ...\nconst authState = await authorize({\n issuer: 'https:\u002F\u002Faccounts.google.com',\n clientId: `${GOOGLE_OAUTH_CLIENT}.apps.googleusercontent.com`,\n redirectUrl: `com.yourapp:\u002Foauth2redirect\u002Fgoogle`,\n scopes: ['openid', 'profile'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n","example-for-yandex","Example for #Yandex","const YANDEX_OAUTH_CLIENT = '...';\nconst YANDEX_OAUTH_SECRET = '...'; \u002F\u002F better hide it somehow\nconst APP_ID = 'com.yourapp';\n\nconst authState = await authorize({\n serviceConfiguration: {\n authorizationEndpoint: `https:\u002F\u002Foauth.yandex.ru\u002Fauthorize?response_type=code&client_id=${YANDEX_OAUTH_CLIENT}&redirect_uri=${APP_ID}:\u002Foauth2redirect`,\n \u002F\u002F TODO: replace it with your own backend to secure client_secret:\n tokenEndpoint: `https:\u002F\u002Foauth.yandex.ru\u002Ftoken?grant_type=authorization_code&client_id=${YANDEX_OAUTH_CLIENT}&client_secret=${YANDEX_OAUTH_SECRET}`,\n },\n clientId: YANDEX_OAUTH_CLIENT,\n redirectUrl: `${APP_ID}:\u002Foauth2redirect`,\n scopes: ['login:info', 'login:avatar'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n\ncallback(authState.accessToken);\n","apple-id-login","Apple ID login","ct-868453","authorize","'...'","ct-719333","authState","ct-d5d2b2","APP_ID","OAuth2 Login","\u002Ffrontend\u002Freact-native\u002Foauth2-login","root","Can be handled by "," by redirecting to url ","code-inline","com.yourapp:\u002F\u002Foauth2provider","https:\u002F\u002Fgithub.com\u002Finvertase\u002Freact-native-apple-authentication","react-native-apple-authentication"," has its own ","https:\u002F\u002Fgithub.com\u002Finvertase\u002Freact-native-apple-authentication\u002Ftree\u002Fmain\u002Fdocs","documentation"," on setting up OAuth using Apple ID.","GOOGLE_OAUTH_CLIENT","await","({"," clientId: ","`${"," redirectUrl: "," scopes: [",", ","],"," dangerouslyAllowInsecureHttpRequests: ","ct-919484","true","});","YANDEX_OAUTH_SECRET","}:\u002Foauth2redirect`",3)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:U,_path:V},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-zuvbG5OO4q":{_path:V,_dir:"react-native",_draft:A,_partial:A,_locale:"en",_empty:A,title:U,description:B,excerpt:{type:W,children:[{type:a,tag:l,props:{},children:[{type:b,value:B}]},{type:a,tag:r,props:{id:C},children:[{type:b,value:D}]},{type:a,tag:l,props:{},children:[{type:b,value:X},{type:a,tag:m,props:{href:s},children:[{type:b,value:s}]},{type:b,value:Y},{type:a,tag:Z,props:{},children:[{type:b,value:_}]},{type:b,value:E}]},{type:a,tag:t,props:{id:F},children:[{type:b,value:G}]},{type:a,tag:k,props:{code:H,language:u},children:[{type:a,tag:v,props:{},children:[{type:a,tag:k,props:{__ignoreMap:q},children:[{type:b,value:H}]}]}]},{type:a,tag:t,props:{id:I},children:[{type:b,value:J}]},{type:a,tag:k,props:{code:K,language:u},children:[{type:a,tag:v,props:{},children:[{type:a,tag:k,props:{__ignoreMap:q},children:[{type:b,value:K}]}]}]},{type:a,tag:r,props:{id:L},children:[{type:b,value:M}]},{type:a,tag:l,props:{},children:[{type:a,tag:m,props:{href:$,rel:[w]},children:[{type:b,value:aa}]},{type:b,value:ab},{type:a,tag:m,props:{href:ac,rel:[w]},children:[{type:b,value:ad}]},{type:b,value:ae}]}]},body:{type:W,children:[{type:a,tag:l,props:{},children:[{type:b,value:B}]},{type:a,tag:r,props:{id:C},children:[{type:b,value:D}]},{type:a,tag:l,props:{},children:[{type:b,value:X},{type:a,tag:m,props:{href:s},children:[{type:b,value:s}]},{type:b,value:Y},{type:a,tag:Z,props:{},children:[{type:b,value:_}]},{type:b,value:E}]},{type:a,tag:t,props:{id:F},children:[{type:b,value:G}]},{type:a,tag:k,props:{code:H,language:u},children:[{type:a,tag:v,props:{},children:[{type:a,tag:k,props:{__ignoreMap:q},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:i},children:[{type:b,value:"import"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" { "}]},{type:a,tag:c,props:{class:N},children:[{type:b,value:O}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" } "}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:"from"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"'react-native-app-auth'"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:x}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:n},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:af}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:P}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:x}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:Q},children:[{type:b,value:"\u002F\u002F ..."}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:n},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:R}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:ag}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:S},children:[{type:b,value:O}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:ah}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" issuer: "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"'https:\u002F\u002Faccounts.google.com'"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ai}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:aj}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:af}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"}.apps.googleusercontent.com`"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ak}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"`com.yourapp:\u002Foauth2redirect\u002Fgoogle`"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:al}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"'openid'"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:am}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"'profile'"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:an}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ao}]},{type:a,tag:c,props:{class:ap},children:[{type:b,value:aq}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ar}]}]}]}]}]},{type:a,tag:t,props:{id:I},children:[{type:b,value:J}]},{type:a,tag:k,props:{code:K,language:u},children:[{type:a,tag:v,props:{},children:[{type:a,tag:k,props:{__ignoreMap:q},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:n},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:y}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:P}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:x}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:n},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:as}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:P}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"; "}]},{type:a,tag:c,props:{class:Q},children:[{type:b,value:"\u002F\u002F better hide it somehow"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:n},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:T}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"'com.yourapp'"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:x}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:n},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:R}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:ag}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:S},children:[{type:b,value:O}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:ah}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" serviceConfiguration: {"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" authorizationEndpoint: "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"`https:\u002F\u002Foauth.yandex.ru\u002Fauthorize?response_type=code&client_id=${"}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:y}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"}&redirect_uri=${"}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:T}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:at}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:Q},children:[{type:b,value:"\u002F\u002F TODO: replace it with your own backend to secure client_secret:"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" tokenEndpoint: "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"`https:\u002F\u002Foauth.yandex.ru\u002Ftoken?grant_type=authorization_code&client_id=${"}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:y}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"}&client_secret=${"}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:as}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"}`"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" },"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ai}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:y}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ak}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:aj}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:T}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:at}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:al}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"'login:info'"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:am}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"'login:avatar'"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:an}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ao}]},{type:a,tag:c,props:{class:ap},children:[{type:b,value:aq}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ar}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:S},children:[{type:b,value:"callback"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"("}]},{type:a,tag:c,props:{class:N},children:[{type:b,value:R}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:N},children:[{type:b,value:"accessToken"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:");"}]}]}]}]}]},{type:a,tag:r,props:{id:L},children:[{type:b,value:M}]},{type:a,tag:l,props:{},children:[{type:a,tag:m,props:{href:$,rel:[w]},children:[{type:b,value:aa}]},{type:b,value:ab},{type:a,tag:m,props:{href:ac,rel:[w]},children:[{type:b,value:ad}]},{type:b,value:ae}]},{type:a,tag:"style",children:[{type:b,value:".ct-d8fab0{color:#79C0FF}.ct-d120b8{color:#D2A8FF}.ct-066bc3{color:#8B949E}.ct-9cb20b{color:#79C0FF}.ct-61e140{color:#FF7B72}.ct-536010{color:#A5D6FF}.ct-7e1821{color:#C9D1D9}.ct-43a365{color:#C9D1D9}.ct-fcc1c9{color:#FF7B72}.light .ct-fcc1c9{color:#859900}.light .ct-43a365{color:#657B83}.light .ct-7e1821{color:#268BD2}.light .ct-536010{color:#2AA198}.light .ct-61e140{color:#073642}.light .ct-9cb20b{color:#268BD2}.light .ct-066bc3{color:#93A1A1}.light .ct-d120b8{color:#268BD2}.light .ct-d8fab0{color:#B58900}"}]}],toc:{title:q,searchDepth:z,depth:z,links:[{id:C,depth:z,text:D,children:[{id:F,depth:au,text:G},{id:I,depth:au,text:J}]},{id:L,depth:z,text:M}]}},_type:"markdown",_id:"content:Frontend:React Native:OAuth2 login.md",_source:"content",_file:"Frontend\u002FReact Native\u002FOAuth2 login.md",_extension:"md"}},prerenderedAt:1711020861028}}("element","text","span","ct-43a365","line"," ","ct-536010","ct-9cb20b","ct-fcc1c9",",","code","p","a","ct-61e140","const","=","","h2","react-native-app-auth","h3","typescript","pre","nofollow",";","YANDEX_OAUTH_CLIENT",2,false,"Use #oauth2 login with React-Native","common-oauth2-providers","Common OAuth2 providers",".","example-for-google","Example for #Google","import { authorize } from 'react-native-app-auth';\n\nconst GOOGLE_OAUTH_CLIENT = '...';\n\n\u002F\u002F ...\nconst authState = await authorize({\n issuer: 'https:\u002F\u002Faccounts.google.com',\n clientId: `${GOOGLE_OAUTH_CLIENT}.apps.googleusercontent.com`,\n redirectUrl: `com.yourapp:\u002Foauth2redirect\u002Fgoogle`,\n scopes: ['openid', 'profile'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n","example-for-yandex","Example for #Yandex","const YANDEX_OAUTH_CLIENT = '...';\nconst YANDEX_OAUTH_SECRET = '...'; \u002F\u002F better hide it somehow\nconst APP_ID = 'com.yourapp';\n\nconst authState = await authorize({\n serviceConfiguration: {\n authorizationEndpoint: `https:\u002F\u002Foauth.yandex.ru\u002Fauthorize?response_type=code&client_id=${YANDEX_OAUTH_CLIENT}&redirect_uri=${APP_ID}:\u002Foauth2redirect`,\n \u002F\u002F TODO: replace it with your own backend to secure client_secret:\n tokenEndpoint: `https:\u002F\u002Foauth.yandex.ru\u002Ftoken?grant_type=authorization_code&client_id=${YANDEX_OAUTH_CLIENT}&client_secret=${YANDEX_OAUTH_SECRET}`,\n },\n clientId: YANDEX_OAUTH_CLIENT,\n redirectUrl: `${APP_ID}:\u002Foauth2redirect`,\n scopes: ['login:info', 'login:avatar'],\n dangerouslyAllowInsecureHttpRequests: true,\n});\n\ncallback(authState.accessToken);\n","apple-id-login","Apple ID login","ct-7e1821","authorize","'...'","ct-066bc3","authState","ct-d120b8","APP_ID","OAuth2 Login","\u002Ffrontend\u002Freact-native\u002Foauth2-login","root","Can be handled by "," by redirecting to url ","code-inline","com.yourapp:\u002F\u002Foauth2provider","https:\u002F\u002Fgithub.com\u002Finvertase\u002Freact-native-apple-authentication","react-native-apple-authentication"," has its own ","https:\u002F\u002Fgithub.com\u002Finvertase\u002Freact-native-apple-authentication\u002Ftree\u002Fmain\u002Fdocs","documentation"," on setting up OAuth using Apple ID.","GOOGLE_OAUTH_CLIENT","await","({"," clientId: ","`${"," redirectUrl: "," scopes: [",", ","],"," dangerouslyAllowInsecureHttpRequests: ","ct-d8fab0","true","});","YANDEX_OAUTH_SECRET","}:\u002Foauth2redirect`",3)) \ No newline at end of file diff --git a/docs/frontend/react-native/oauth2-login/index.html b/docs/frontend/react-native/oauth2-login/index.html index 9fa5fc6..b5e955f 100644 --- a/docs/frontend/react-native/oauth2-login/index.html +++ b/docs/frontend/react-native/oauth2-login/index.html @@ -1,6 +1,6 @@ -OAuth2 Login • Obsidian Garden -

OAuth2 Login

Use #oauth2 login with React-Native

Common OAuth2 providers

Can be handled by react-native-app-auth by redirecting to url com.yourapp://oauth2provider.

Example for #Google

import { authorize } from 'react-native-app-auth';const GOOGLE_OAUTH_CLIENT = '...';// ...const authState = await authorize({  issuer: 'https://accounts.google.com',  clientId: `${GOOGLE_OAUTH_CLIENT}.apps.googleusercontent.com`,  redirectUrl: `com.yourapp:/oauth2redirect/google`,  scopes: ['openid', 'profile'],  dangerouslyAllowInsecureHttpRequests: true,});

Example for #Yandex

const YANDEX_OAUTH_CLIENT = '...';const YANDEX_OAUTH_SECRET = '...'; // better hide it somehowconst APP_ID = 'com.yourapp';const authState = await authorize({  serviceConfiguration: {    authorizationEndpoint: `https://oauth.yandex.ru/authorize?response_type=code&client_id=${YANDEX_OAUTH_CLIENT}&redirect_uri=${APP_ID}:/oauth2redirect`,    // TODO: replace it with your own backend to secure client_secret:    tokenEndpoint: `https://oauth.yandex.ru/token?grant_type=authorization_code&client_id=${YANDEX_OAUTH_CLIENT}&client_secret=${YANDEX_OAUTH_SECRET}`,  },  clientId: YANDEX_OAUTH_CLIENT,  redirectUrl: `${APP_ID}:/oauth2redirect`,  scopes: ['login:info', 'login:avatar'],  dangerouslyAllowInsecureHttpRequests: true,});callback(authState.accessToken);

Apple ID login

react-native-apple-authentication has its own documentation on setting up OAuth using Apple ID.

btw, have a nice day
(2018 - 2024) muerwre
+

OAuth2 Login

Use #oauth2 login with React-Native

Common OAuth2 providers

Can be handled by react-native-app-auth by redirecting to url com.yourapp://oauth2provider.

Example for #Google

import { authorize } from 'react-native-app-auth';const GOOGLE_OAUTH_CLIENT = '...';// ...const authState = await authorize({  issuer: 'https://accounts.google.com',  clientId: `${GOOGLE_OAUTH_CLIENT}.apps.googleusercontent.com`,  redirectUrl: `com.yourapp:/oauth2redirect/google`,  scopes: ['openid', 'profile'],  dangerouslyAllowInsecureHttpRequests: true,});

Example for #Yandex

const YANDEX_OAUTH_CLIENT = '...';const YANDEX_OAUTH_SECRET = '...'; // better hide it somehowconst APP_ID = 'com.yourapp';const authState = await authorize({  serviceConfiguration: {    authorizationEndpoint: `https://oauth.yandex.ru/authorize?response_type=code&client_id=${YANDEX_OAUTH_CLIENT}&redirect_uri=${APP_ID}:/oauth2redirect`,    // TODO: replace it with your own backend to secure client_secret:    tokenEndpoint: `https://oauth.yandex.ru/token?grant_type=authorization_code&client_id=${YANDEX_OAUTH_CLIENT}&client_secret=${YANDEX_OAUTH_SECRET}`,  },  clientId: YANDEX_OAUTH_CLIENT,  redirectUrl: `${APP_ID}:/oauth2redirect`,  scopes: ['login:info', 'login:avatar'],  dangerouslyAllowInsecureHttpRequests: true,});callback(authState.accessToken);

Apple ID login

react-native-apple-authentication has its own documentation on setting up OAuth using Apple ID.

btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/frontend/react-native/preserve-flatlist-scroll-position-in-react-native/_payload.js b/docs/frontend/react-native/preserve-flatlist-scroll-position-in-react-native/_payload.js index 1d53e2d..6b9170b 100644 --- a/docs/frontend/react-native/preserve-flatlist-scroll-position-in-react-native/_payload.js +++ b/docs/frontend/react-native/preserve-flatlist-scroll-position-in-react-native/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:$,_path:aa},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-Rv2z2spCBs":{_path:aa,_dir:"react-native",_draft:M,_partial:M,_locale:"en",_empty:M,title:$,description:"Sometimes you need to keep scroll position of FlatList in React Native after some user interactions.",excerpt:{type:ab,children:[{type:a,tag:ac,props:{},children:[{type:c,value:ad},{type:a,tag:ae,props:{},children:[{type:c,value:N}]},{type:c,value:af}]},{type:a,tag:C,props:{code:O,language:ag},children:[{type:a,tag:ah,props:{},children:[{type:a,tag:C,props:{__ignoreMap:P},children:[{type:c,value:O}]}]}]}]},body:{type:ab,children:[{type:a,tag:ac,props:{},children:[{type:c,value:ad},{type:a,tag:ae,props:{},children:[{type:c,value:N}]},{type:c,value:af}]},{type:a,tag:C,props:{code:O,language:ag},children:[{type:a,tag:ah,props:{},children:[{type:a,tag:C,props:{__ignoreMap:P},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:D},children:[{type:c,value:"\u002F\u002F interact() is doing some stuff, that changes FlatList scroll size"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:"type"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:"ct-244c86"},children:[{type:c,value:ai}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" { "}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" () "}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:"ct-3ddc63"},children:[{type:c,value:"void"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"; }"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:x},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:aj},children:[{type:c,value:"SomeList"}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:E},children:[{type:c,value:"FC"}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:E},children:[{type:c,value:ai}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"\u003E "}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:" ({ "}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:" }) "}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:u}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:D},children:[{type:c,value:"\u002F\u002F set it to `true` before interaction and back to `false` right after"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:J},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:i},children:[{type:c,value:" ("}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:ak}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:E},children:[{type:c,value:"NativeSyntheticEvent"}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:E},children:[{type:c,value:"NativeScrollEvent"}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"\u003E) "}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:u}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ak}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"nativeEvent"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"contentOffset"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"y"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:al}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" [],"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:am}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:i},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:"ct-428713"},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:aj},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"(("}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:"_"}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:an},children:[{type:c,value:ao}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:", "}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:an},children:[{type:c,value:ao}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:") "}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:u}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"if"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"!"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:") {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"?."}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"scrollToOffset"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"({"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" offset: "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"+"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"-"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"),"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" animated: "}]},{type:a,tag:b,props:{class:J},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:","}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" });"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }, []);"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:D},children:[{type:c,value:"\u002F\u002F onInteraction wraps interaction to preserve scroll position"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"onInteraction"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" () "}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:J},children:[{type:c,value:"true"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"();"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:J},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:"500"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:al}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" ["}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"setSelectedSubThemes"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"],"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:am}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:"ct-75fcd0"},children:[{type:c,value:N}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:D},children:[{type:c,value:"\u002F\u002F ...required FlatList options"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:au}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:au}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"\u002F\u003E"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" )"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-75fcd0{color:#FFA657}.ct-481e50{color:#79C0FF}.ct-428713{color:#79C0FF}.ct-2686a0{color:#C9D1D9}.ct-df769e{color:#79C0FF}.ct-87df16{color:#79C0FF}.ct-482fe5{color:#79C0FF}.ct-b1edfd{color:#FFA657}.ct-623bef{color:#FFA657}.ct-52106b{color:#FF7B72}.ct-fb9d68{color:#D2A8FF}.ct-86daaf{color:#C9D1D9}.ct-2557c5{color:#FF7B72}.ct-3ddc63{color:#79C0FF}.ct-a7b241{color:#D2A8FF}.ct-61ac67{color:#FF7B72}.ct-244c86{color:#FFA657}.ct-f062c5{color:#C9D1D9}.ct-a145b1{color:#FF7B72}.ct-c6b575{color:#8B949E}.light .ct-c6b575{color:#93A1A1}.light .ct-a145b1{color:#073642}.light .ct-f062c5{color:#657B83}.light .ct-244c86{color:#268BD2}.light .ct-61ac67{color:#859900}.light .ct-a7b241{color:#268BD2}.light .ct-3ddc63{color:#859900}.light .ct-2557c5{color:#073642}.light .ct-86daaf{color:#657B83}.light .ct-fb9d68{color:#268BD2}.light .ct-52106b{color:#859900}.light .ct-623bef{color:#268BD2}.light .ct-b1edfd{color:#657B83}.light .ct-482fe5{color:#268BD2}.light .ct-87df16{color:#D33682}.light .ct-df769e{color:#B58900}.light .ct-2686a0{color:#268BD2}.light .ct-428713{color:#268BD2}.light .ct-481e50{color:#859900}.light .ct-75fcd0{color:#657B83}"}]}],toc:{title:P,searchDepth:av,depth:av,links:[]}},_type:"markdown",_id:"content:Frontend:React Native:Preserve FlatList scroll position in React Native.md",_source:"content",_file:"Frontend\u002FReact Native\u002FPreserve FlatList scroll position in React Native.md",_extension:"md"}},prerenderedAt:1711020227125}}("element","span","text","ct-f062c5","line"," ","ct-2686a0","ct-61ac67","ct-86daaf","=","."," "," ","ct-a145b1","current","ct-a7b241","=\u003E","const","ct-482fe5","ct-52106b"," {",";",":","ct-2557c5","(",");"," ","}","code","ct-c6b575","ct-623bef","ct-b1edfd","ct-87df16","scrollHeight","shouldKeepScrollPosition","ct-df769e","h","{",false,"FlatList","\u002F\u002F interact() is doing some stuff, that changes FlatList scroll size\ntype Props = { interact: () =\u003E void; }\n\nconst SomeList: FC\u003CProps\u003E = ({ interact }) =\u003E {\n const scrollPosition = useRef(0);\n const scrollHeight = useRef(0);\n \n \u002F\u002F set it to `true` before interaction and back to `false` right after\n const shouldKeepScrollPosition = useRef(false);\n\n const onScroll = useCallback(\n (event: NativeSyntheticEvent\u003CNativeScrollEvent\u003E) =\u003E {\n scrollPosition.current = event.nativeEvent.contentOffset.y;\n },\n [],\n );\n\n const onContentSizeChange = useCallback((_: number, h: number) =\u003E {\n if (!shouldKeepScrollPosition.current) {\n scrollHeight.current = h;\n return;\n }\n\n ref.current?.scrollToOffset({\n offset: scrollPosition.current + (h - scrollHeight.current),\n animated: false,\n });\n\n scrollHeight.current = h;\n }, []);\n\n \u002F\u002F onInteraction wraps interaction to preserve scroll position\n const onInteraction = useCallback(\n () =\u003E {\n shouldKeepScrollPosition.current = true;\n\n setTimeout(() =\u003E {\n interact();\n }, 0);\n\n setTimeout(() =\u003E {\n shouldKeepScrollPosition.current = false;\n }, 500);\n },\n [setSelectedSubThemes],\n );\n \n return (\n \u003CFlatList\n \u002F\u002F ...required FlatList options\n ref={ref}\n onContentSizeChange={onContentSizeChange}\n onRefresh={onRefresh}\n onScroll={onScroll}\n \u002F\u003E\n )\n}\n","","interact","\u003C","scrollPosition","useRef","0","false","onScroll","useCallback","onContentSizeChange"," (","ref","Preserve FlatList Scroll Position In React Native","\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native","root","p","Sometimes you need to keep scroll position of ","code-inline"," in React Native after some user interactions.","typescript","pre","Props","ct-fb9d68","event"," },"," );","ct-481e50","number","return","setTimeout","(() "," "," }, ","onRefresh",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:$,_path:aa},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-Rv2z2spCBs":{_path:aa,_dir:"react-native",_draft:M,_partial:M,_locale:"en",_empty:M,title:$,description:"Sometimes you need to keep scroll position of FlatList in React Native after some user interactions.",excerpt:{type:ab,children:[{type:a,tag:ac,props:{},children:[{type:c,value:ad},{type:a,tag:ae,props:{},children:[{type:c,value:N}]},{type:c,value:af}]},{type:a,tag:C,props:{code:O,language:ag},children:[{type:a,tag:ah,props:{},children:[{type:a,tag:C,props:{__ignoreMap:P},children:[{type:c,value:O}]}]}]}]},body:{type:ab,children:[{type:a,tag:ac,props:{},children:[{type:c,value:ad},{type:a,tag:ae,props:{},children:[{type:c,value:N}]},{type:c,value:af}]},{type:a,tag:C,props:{code:O,language:ag},children:[{type:a,tag:ah,props:{},children:[{type:a,tag:C,props:{__ignoreMap:P},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:D},children:[{type:c,value:"\u002F\u002F interact() is doing some stuff, that changes FlatList scroll size"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:"type"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:"ct-2a35fc"},children:[{type:c,value:ai}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" { "}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" () "}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:"ct-96b611"},children:[{type:c,value:"void"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"; }"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:x},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:aj},children:[{type:c,value:"SomeList"}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:E},children:[{type:c,value:"FC"}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:E},children:[{type:c,value:ai}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"\u003E "}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:" ({ "}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:" }) "}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:u}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:D},children:[{type:c,value:"\u002F\u002F set it to `true` before interaction and back to `false` right after"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:J},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:i},children:[{type:c,value:" ("}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:ak}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:E},children:[{type:c,value:"NativeSyntheticEvent"}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:E},children:[{type:c,value:"NativeScrollEvent"}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"\u003E) "}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:u}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ak}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"nativeEvent"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"contentOffset"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"y"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:al}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" [],"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:am}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:i},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:"ct-75adcf"},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:aj},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"(("}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:"_"}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:an},children:[{type:c,value:ao}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:", "}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:t},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:an},children:[{type:c,value:ao}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:") "}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:u}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"if"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"!"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:") {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"?."}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"scrollToOffset"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"({"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" offset: "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"+"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"-"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"),"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" animated: "}]},{type:a,tag:b,props:{class:J},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:","}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" });"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }, []);"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:D},children:[{type:c,value:"\u002F\u002F onInteraction wraps interaction to preserve scroll position"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"onInteraction"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" () "}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:J},children:[{type:c,value:"true"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"();"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:J},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:"500"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:al}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" ["}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"setSelectedSubThemes"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"],"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:am}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:"ct-459b98"},children:[{type:c,value:N}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:D},children:[{type:c,value:"\u002F\u002F ...required FlatList options"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:au}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:au}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"\u002F\u003E"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" )"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-459b98{color:#FFA657}.ct-628890{color:#79C0FF}.ct-75adcf{color:#79C0FF}.ct-592d02{color:#C9D1D9}.ct-c502a7{color:#79C0FF}.ct-c7d63c{color:#79C0FF}.ct-f8e248{color:#79C0FF}.ct-6a1dbc{color:#FFA657}.ct-9684c2{color:#FFA657}.ct-f3fc59{color:#FF7B72}.ct-2333e8{color:#D2A8FF}.ct-36565b{color:#C9D1D9}.ct-57abf7{color:#FF7B72}.ct-96b611{color:#79C0FF}.ct-27f128{color:#D2A8FF}.ct-6295d2{color:#FF7B72}.ct-2a35fc{color:#FFA657}.ct-691188{color:#C9D1D9}.ct-0920bc{color:#FF7B72}.ct-8b01d3{color:#8B949E}.light .ct-8b01d3{color:#93A1A1}.light .ct-0920bc{color:#073642}.light .ct-691188{color:#657B83}.light .ct-2a35fc{color:#268BD2}.light .ct-6295d2{color:#859900}.light .ct-27f128{color:#268BD2}.light .ct-96b611{color:#859900}.light .ct-57abf7{color:#073642}.light .ct-36565b{color:#657B83}.light .ct-2333e8{color:#268BD2}.light .ct-f3fc59{color:#859900}.light .ct-9684c2{color:#268BD2}.light .ct-6a1dbc{color:#657B83}.light .ct-f8e248{color:#268BD2}.light .ct-c7d63c{color:#D33682}.light .ct-c502a7{color:#B58900}.light .ct-592d02{color:#268BD2}.light .ct-75adcf{color:#268BD2}.light .ct-628890{color:#859900}.light .ct-459b98{color:#657B83}"}]}],toc:{title:P,searchDepth:av,depth:av,links:[]}},_type:"markdown",_id:"content:Frontend:React Native:Preserve FlatList scroll position in React Native.md",_source:"content",_file:"Frontend\u002FReact Native\u002FPreserve FlatList scroll position in React Native.md",_extension:"md"}},prerenderedAt:1711020861067}}("element","span","text","ct-691188","line"," ","ct-592d02","ct-6295d2","ct-36565b","=","."," "," ","ct-0920bc","current","ct-27f128","=\u003E","const","ct-f8e248","ct-f3fc59"," {",";",":","ct-57abf7","(",");"," ","}","code","ct-8b01d3","ct-9684c2","ct-6a1dbc","ct-c7d63c","scrollHeight","shouldKeepScrollPosition","ct-c502a7","h","{",false,"FlatList","\u002F\u002F interact() is doing some stuff, that changes FlatList scroll size\ntype Props = { interact: () =\u003E void; }\n\nconst SomeList: FC\u003CProps\u003E = ({ interact }) =\u003E {\n const scrollPosition = useRef(0);\n const scrollHeight = useRef(0);\n \n \u002F\u002F set it to `true` before interaction and back to `false` right after\n const shouldKeepScrollPosition = useRef(false);\n\n const onScroll = useCallback(\n (event: NativeSyntheticEvent\u003CNativeScrollEvent\u003E) =\u003E {\n scrollPosition.current = event.nativeEvent.contentOffset.y;\n },\n [],\n );\n\n const onContentSizeChange = useCallback((_: number, h: number) =\u003E {\n if (!shouldKeepScrollPosition.current) {\n scrollHeight.current = h;\n return;\n }\n\n ref.current?.scrollToOffset({\n offset: scrollPosition.current + (h - scrollHeight.current),\n animated: false,\n });\n\n scrollHeight.current = h;\n }, []);\n\n \u002F\u002F onInteraction wraps interaction to preserve scroll position\n const onInteraction = useCallback(\n () =\u003E {\n shouldKeepScrollPosition.current = true;\n\n setTimeout(() =\u003E {\n interact();\n }, 0);\n\n setTimeout(() =\u003E {\n shouldKeepScrollPosition.current = false;\n }, 500);\n },\n [setSelectedSubThemes],\n );\n \n return (\n \u003CFlatList\n \u002F\u002F ...required FlatList options\n ref={ref}\n onContentSizeChange={onContentSizeChange}\n onRefresh={onRefresh}\n onScroll={onScroll}\n \u002F\u003E\n )\n}\n","","interact","\u003C","scrollPosition","useRef","0","false","onScroll","useCallback","onContentSizeChange"," (","ref","Preserve FlatList Scroll Position In React Native","\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native","root","p","Sometimes you need to keep scroll position of ","code-inline"," in React Native after some user interactions.","typescript","pre","Props","ct-2333e8","event"," },"," );","ct-628890","number","return","setTimeout","(() "," "," }, ","onRefresh",2)) \ No newline at end of file diff --git a/docs/frontend/react-native/preserve-flatlist-scroll-position-in-react-native/index.html b/docs/frontend/react-native/preserve-flatlist-scroll-position-in-react-native/index.html index 310b033..75ba02a 100644 --- a/docs/frontend/react-native/preserve-flatlist-scroll-position-in-react-native/index.html +++ b/docs/frontend/react-native/preserve-flatlist-scroll-position-in-react-native/index.html @@ -1,6 +1,6 @@ -Preserve FlatList Scroll Position In React Native • Obsidian Garden -

Preserve FlatList Scroll Position In React Native

Sometimes you need to keep scroll position of FlatList in React Native after some user interactions.

// interact() is doing some stuff, that changes FlatList scroll sizetype Props = { interact: () => void; }const SomeList: FC<Props> = ({ interact }) => {  const scrollPosition = useRef(0);  const scrollHeight = useRef(0);    // set it to `true` before interaction and back to `false` right after  const shouldKeepScrollPosition = useRef(false);  const onScroll = useCallback(    (event: NativeSyntheticEvent<NativeScrollEvent>) => {      scrollPosition.current = event.nativeEvent.contentOffset.y;    },    [],  );  const onContentSizeChange = useCallback((_: number, h: number) => {    if (!shouldKeepScrollPosition.current) {      scrollHeight.current = h;      return;    }    ref.current?.scrollToOffset({      offset: scrollPosition.current + (h - scrollHeight.current),      animated: false,    });    scrollHeight.current = h;  }, []);  // onInteraction wraps interaction to preserve scroll position  const onInteraction = useCallback(    () => {      shouldKeepScrollPosition.current = true;      setTimeout(() => {        interact();      }, 0);      setTimeout(() => {        shouldKeepScrollPosition.current = false;      }, 500);    },    [setSelectedSubThemes],  );    return (    <FlatList      // ...required FlatList options      ref={ref}      onContentSizeChange={onContentSizeChange}      onRefresh={onRefresh}      onScroll={onScroll}    />  )}
btw, have a nice day
(2018 - 2024) muerwre
+

Preserve FlatList Scroll Position In React Native

Sometimes you need to keep scroll position of FlatList in React Native after some user interactions.

// interact() is doing some stuff, that changes FlatList scroll sizetype Props = { interact: () => void; }const SomeList: FC<Props> = ({ interact }) => {  const scrollPosition = useRef(0);  const scrollHeight = useRef(0);    // set it to `true` before interaction and back to `false` right after  const shouldKeepScrollPosition = useRef(false);  const onScroll = useCallback(    (event: NativeSyntheticEvent<NativeScrollEvent>) => {      scrollPosition.current = event.nativeEvent.contentOffset.y;    },    [],  );  const onContentSizeChange = useCallback((_: number, h: number) => {    if (!shouldKeepScrollPosition.current) {      scrollHeight.current = h;      return;    }    ref.current?.scrollToOffset({      offset: scrollPosition.current + (h - scrollHeight.current),      animated: false,    });    scrollHeight.current = h;  }, []);  // onInteraction wraps interaction to preserve scroll position  const onInteraction = useCallback(    () => {      shouldKeepScrollPosition.current = true;      setTimeout(() => {        interact();      }, 0);      setTimeout(() => {        shouldKeepScrollPosition.current = false;      }, 500);    },    [setSelectedSubThemes],  );    return (    <FlatList      // ...required FlatList options      ref={ref}      onContentSizeChange={onContentSizeChange}      onRefresh={onRefresh}      onScroll={onScroll}    />  )}
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/frontend/react-native/react-native-app-auth/_payload.js b/docs/frontend/react-native/react-native-app-auth/_payload.js index 0a78360..2e19137 100644 --- a/docs/frontend/react-native/react-native-app-auth/_payload.js +++ b/docs/frontend/react-native/react-native-app-auth/_payload.js @@ -1 +1 @@ -export default {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-Ul5QREg0An":null},prerenderedAt:1711020228180} \ No newline at end of file +export default {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-Ul5QREg0An":null},prerenderedAt:1711020862800} \ No newline at end of file diff --git a/docs/frontend/react-native/react-native-app-auth/index.html b/docs/frontend/react-native/react-native-app-auth/index.html index 278138d..9636ad8 100644 --- a/docs/frontend/react-native/react-native-app-auth/index.html +++ b/docs/frontend/react-native/react-native-app-auth/index.html @@ -1,6 +1,6 @@ -Obsidian Garden - + \ No newline at end of file diff --git a/docs/frontend/react-native/useful-comands/_payload.js b/docs/frontend/react-native/useful-comands/_payload.js index 6286c4b..cd9980a 100644 --- a/docs/frontend/react-native/useful-comands/_payload.js +++ b/docs/frontend/react-native/useful-comands/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:X,_path:Y}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-90RMToCghI":{_path:Y,_dir:"react-native",_draft:y,_partial:y,_locale:"en",_empty:y,title:X,description:g,excerpt:{type:Z,children:[{type:a,tag:i,props:{id:z},children:[{type:b,value:A}]},{type:a,tag:f,props:{code:B,language:j},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:b,value:B}]}]}]},{type:a,tag:i,props:{id:C},children:[{type:b,value:D}]},{type:a,tag:f,props:{code:E,language:_},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:b,value:E}]}]}]},{type:a,tag:i,props:{id:F},children:[{type:b,value:G}]},{type:a,tag:$,props:{},children:[{type:b,value:aa}]},{type:a,tag:f,props:{code:H,language:j},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:b,value:H}]}]}]},{type:a,tag:i,props:{id:I},children:[{type:b,value:J}]},{type:a,tag:f,props:{code:K,language:j},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:b,value:K}]}]}]},{type:a,tag:i,props:{id:L},children:[{type:b,value:M}]},{type:a,tag:ab,props:{},children:[{type:a,tag:l,props:{},children:[{type:a,tag:m,props:{href:r,rel:[n]},children:[{type:b,value:r}]}]},{type:a,tag:l,props:{},children:[{type:a,tag:m,props:{href:s,rel:[n]},children:[{type:b,value:s}]}]},{type:a,tag:l,props:{},children:[{type:a,tag:m,props:{href:t,rel:[n]},children:[{type:b,value:t}]}]}]},{type:a,tag:u,props:{id:N},children:[{type:b,value:O}]},{type:a,tag:f,props:{code:P,language:j},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:b,value:P}]}]}]},{type:a,tag:u,props:{id:Q},children:[{type:b,value:R}]},{type:a,tag:f,props:{code:S,language:j},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:b,value:S}]}]}]}]},body:{type:Z,children:[{type:a,tag:i,props:{id:z},children:[{type:b,value:A}]},{type:a,tag:f,props:{code:B,language:j},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:"adb logcat com.application:I "}]},{type:a,tag:c,props:{class:v},children:[{type:b,value:"\"*:S\""}]}]}]}]}]},{type:a,tag:i,props:{id:C},children:[{type:b,value:D}]},{type:a,tag:f,props:{code:E,language:_},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:"keytool -printcert -jarfile "}]},{type:a,tag:c,props:{class:v},children:[{type:b,value:ac}]},{type:a,tag:c,props:{class:o},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:q},children:[{type:b,value:T}]},{type:a,tag:c,props:{class:v},children:[{type:b,value:ac}]}]}]}]}]},{type:a,tag:i,props:{id:F},children:[{type:b,value:G}]},{type:a,tag:$,props:{},children:[{type:b,value:aa}]},{type:a,tag:f,props:{code:H,language:j},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:"npx react-native bundle \\"}]}]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:" --platform android \\"}]}]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:" --dev "}]},{type:a,tag:c,props:{class:U},children:[{type:b,value:"false"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:V}]}]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:" --entry-file index.js \\"}]}]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:" --bundle-output android\u002Fapp\u002Fsrc\u002Fmain\u002Fassets\u002Findex.android.bundle \\"}]}]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:" --assets-dest android\u002Fapp\u002Fsrc\u002Fmain\u002Fres\u002F"}]}]},{type:a,tag:c,props:{class:d},children:[]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:U},children:[{type:b,value:ad}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:" android "}]},{type:a,tag:c,props:{class:w},children:[{type:b,value:x}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:" .\u002Fgradlew assembleDebug"}]}]},{type:a,tag:c,props:{class:d},children:[]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:W},children:[{type:b,value:"# do your stuff"}]}]},{type:a,tag:c,props:{class:d},children:[]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:".\u002Fgradlew clean"}]}]}]}]}]},{type:a,tag:i,props:{id:I},children:[{type:b,value:J}]},{type:a,tag:f,props:{code:K,language:j},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:U},children:[{type:b,value:ad}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:" .\u002Fandroid \\"}]}]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:ae}]},{type:a,tag:c,props:{class:w},children:[{type:b,value:x}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:" .\u002Fgradlew assembleRelease \\"}]}]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:ae}]},{type:a,tag:c,props:{class:w},children:[{type:b,value:x}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:" adb install .\u002Fapp\u002Fbuild\u002Foutputs\u002Fapk\u002Frelease\u002Fapp-release.apk"}]}]}]}]}]},{type:a,tag:i,props:{id:L},children:[{type:b,value:M}]},{type:a,tag:ab,props:{},children:[{type:a,tag:l,props:{},children:[{type:a,tag:m,props:{href:r,rel:[n]},children:[{type:b,value:r}]}]},{type:a,tag:l,props:{},children:[{type:a,tag:m,props:{href:s,rel:[n]},children:[{type:b,value:s}]}]},{type:a,tag:l,props:{},children:[{type:a,tag:m,props:{href:t,rel:[n]},children:[{type:b,value:t}]}]}]},{type:a,tag:u,props:{id:N},children:[{type:b,value:O}]},{type:a,tag:f,props:{code:P,language:j},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:W},children:[{type:b,value:"# ios "}]}]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:"xcrun simctl openurl booted "}]},{type:a,tag:c,props:{class:o},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:q},children:[{type:b,value:T}]}]},{type:a,tag:c,props:{class:d},children:[]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:W},children:[{type:b,value:"# android"}]}]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:"adb shell am start -W -a android.intent.action.VIEW -d "}]},{type:a,tag:c,props:{class:o},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:q},children:[{type:b,value:T}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:V}]}]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:"com.application"}]}]}]}]}]},{type:a,tag:u,props:{id:Q},children:[{type:b,value:R}]},{type:a,tag:f,props:{code:S,language:j},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:"PACKAGE="}]},{type:a,tag:c,props:{class:v},children:[{type:b,value:"\"com.application\""}]}]},{type:a,tag:c,props:{class:d},children:[]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:"adb shell pm set-app-links --package "}]},{type:a,tag:c,props:{class:o},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:q},children:[{type:b,value:af}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:" 0 all "}]},{type:a,tag:c,props:{class:w},children:[{type:b,value:x}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:V}]}]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:" adb shell pm verify-app-links --re-verify "}]},{type:a,tag:c,props:{class:o},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:q},children:[{type:b,value:af}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-96a46f{color:#8B949E}.ct-7aad02{color:#FF7B72}.ct-3ec95f{color:#79C0FF}.ct-152964{color:#C9D1D9}.ct-ccecdb{color:#C9D1D9}.ct-a26332{color:#A5D6FF}.ct-e9d7d1{color:#C9D1D9}.light .ct-e9d7d1{color:#657B83}.light .ct-a26332{color:#2AA198}.light .ct-ccecdb{color:#859900}.light .ct-152964{color:#268BD2}.light .ct-3ec95f{color:#268BD2}.light .ct-7aad02{color:#859900}.light .ct-96a46f{color:#93A1A1}"}]}],toc:{title:g,searchDepth:k,depth:k,links:[{id:z,depth:k,text:A},{id:C,depth:k,text:D},{id:F,depth:k,text:G},{id:I,depth:k,text:J},{id:L,depth:k,text:M,children:[{id:N,depth:ag,text:O},{id:Q,depth:ag,text:R}]}]}},_type:"markdown",_id:"content:Frontend:React Native:Useful comands.md",_source:"content",_file:"Frontend\u002FReact Native\u002FUseful comands.md",_extension:"md"}},prerenderedAt:1711020227161}}("element","text","span","line","ct-e9d7d1","code","","pre","h2","shell",2,"li","a","nofollow","ct-ccecdb","$","ct-152964","https:\u002F\u002Fzarah.dev\u002F2022\u002F02\u002F08\u002Fandroid12-deeplinks.html","https:\u002F\u002Fdeveloper.android.com\u002Ftraining\u002Fapp-links\u002Fverify-site-associations#invoke-domain-verification","https:\u002F\u002Fdigitalassetlinks.googleapis.com\u002Fv1\u002Fstatements:list?source.web.site=https:\u002F\u002Fmiin.ru&relation=delegate_permission\u002Fcommon.handle_all_urls","h3","ct-a26332","ct-7aad02","&&",false,"show-android-logcat","Show android logcat","adb logcat com.application:I \"*:S\"\n","get-apks-sha-256","Get .apk's SHA-256","keytool -printcert -jarfile \"$1\"\n","assemble-debug-release-on-android","Assemble debug release on Android","npx react-native bundle \\\n --platform android \\\n --dev false \\\n --entry-file index.js \\\n --bundle-output android\u002Fapp\u002Fsrc\u002Fmain\u002Fassets\u002Findex.android.bundle \\\n --assets-dest android\u002Fapp\u002Fsrc\u002Fmain\u002Fres\u002F\n\ncd android && .\u002Fgradlew assembleDebug\n\n# do your stuff\n\n.\u002Fgradlew clean\n","send-release-to-android-device","Send release to Android device","cd .\u002Fandroid \\\n && .\u002Fgradlew assembleRelease \\\n && adb install .\u002Fapp\u002Fbuild\u002Foutputs\u002Fapk\u002Frelease\u002Fapp-release.apk\n","deep-links","Deep links","open-deep-links","Open deep links","# ios \nxcrun simctl openurl booted $1\n\n# android\nadb shell am start -W -a android.intent.action.VIEW -d $1 \\\ncom.application\n","reverify-links-on-android","Reverify links on Android","PACKAGE=\"com.application\"\n\nadb shell pm set-app-links --package $PACKAGE 0 all && \\\n adb shell pm verify-app-links --re-verify $PACKAGE\n","1","ct-3ec95f"," \\","ct-96a46f","Useful Comands","\u002Ffrontend\u002Freact-native\u002Fuseful-comands","root","bash","p","Packages release with bundled resources.","ul","\"","cd"," ","PACKAGE",3)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:X,_path:Y}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-90RMToCghI":{_path:Y,_dir:"react-native",_draft:y,_partial:y,_locale:"en",_empty:y,title:X,description:g,excerpt:{type:Z,children:[{type:a,tag:i,props:{id:z},children:[{type:b,value:A}]},{type:a,tag:f,props:{code:B,language:j},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:b,value:B}]}]}]},{type:a,tag:i,props:{id:C},children:[{type:b,value:D}]},{type:a,tag:f,props:{code:E,language:_},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:b,value:E}]}]}]},{type:a,tag:i,props:{id:F},children:[{type:b,value:G}]},{type:a,tag:$,props:{},children:[{type:b,value:aa}]},{type:a,tag:f,props:{code:H,language:j},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:b,value:H}]}]}]},{type:a,tag:i,props:{id:I},children:[{type:b,value:J}]},{type:a,tag:f,props:{code:K,language:j},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:b,value:K}]}]}]},{type:a,tag:i,props:{id:L},children:[{type:b,value:M}]},{type:a,tag:ab,props:{},children:[{type:a,tag:l,props:{},children:[{type:a,tag:m,props:{href:r,rel:[n]},children:[{type:b,value:r}]}]},{type:a,tag:l,props:{},children:[{type:a,tag:m,props:{href:s,rel:[n]},children:[{type:b,value:s}]}]},{type:a,tag:l,props:{},children:[{type:a,tag:m,props:{href:t,rel:[n]},children:[{type:b,value:t}]}]}]},{type:a,tag:u,props:{id:N},children:[{type:b,value:O}]},{type:a,tag:f,props:{code:P,language:j},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:b,value:P}]}]}]},{type:a,tag:u,props:{id:Q},children:[{type:b,value:R}]},{type:a,tag:f,props:{code:S,language:j},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:b,value:S}]}]}]}]},body:{type:Z,children:[{type:a,tag:i,props:{id:z},children:[{type:b,value:A}]},{type:a,tag:f,props:{code:B,language:j},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:"adb logcat com.application:I "}]},{type:a,tag:c,props:{class:v},children:[{type:b,value:"\"*:S\""}]}]}]}]}]},{type:a,tag:i,props:{id:C},children:[{type:b,value:D}]},{type:a,tag:f,props:{code:E,language:_},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:"keytool -printcert -jarfile "}]},{type:a,tag:c,props:{class:v},children:[{type:b,value:ac}]},{type:a,tag:c,props:{class:o},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:q},children:[{type:b,value:T}]},{type:a,tag:c,props:{class:v},children:[{type:b,value:ac}]}]}]}]}]},{type:a,tag:i,props:{id:F},children:[{type:b,value:G}]},{type:a,tag:$,props:{},children:[{type:b,value:aa}]},{type:a,tag:f,props:{code:H,language:j},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:"npx react-native bundle \\"}]}]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:" --platform android \\"}]}]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:" --dev "}]},{type:a,tag:c,props:{class:U},children:[{type:b,value:"false"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:V}]}]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:" --entry-file index.js \\"}]}]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:" --bundle-output android\u002Fapp\u002Fsrc\u002Fmain\u002Fassets\u002Findex.android.bundle \\"}]}]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:" --assets-dest android\u002Fapp\u002Fsrc\u002Fmain\u002Fres\u002F"}]}]},{type:a,tag:c,props:{class:d},children:[]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:U},children:[{type:b,value:ad}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:" android "}]},{type:a,tag:c,props:{class:w},children:[{type:b,value:x}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:" .\u002Fgradlew assembleDebug"}]}]},{type:a,tag:c,props:{class:d},children:[]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:W},children:[{type:b,value:"# do your stuff"}]}]},{type:a,tag:c,props:{class:d},children:[]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:".\u002Fgradlew clean"}]}]}]}]}]},{type:a,tag:i,props:{id:I},children:[{type:b,value:J}]},{type:a,tag:f,props:{code:K,language:j},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:U},children:[{type:b,value:ad}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:" .\u002Fandroid \\"}]}]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:ae}]},{type:a,tag:c,props:{class:w},children:[{type:b,value:x}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:" .\u002Fgradlew assembleRelease \\"}]}]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:ae}]},{type:a,tag:c,props:{class:w},children:[{type:b,value:x}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:" adb install .\u002Fapp\u002Fbuild\u002Foutputs\u002Fapk\u002Frelease\u002Fapp-release.apk"}]}]}]}]}]},{type:a,tag:i,props:{id:L},children:[{type:b,value:M}]},{type:a,tag:ab,props:{},children:[{type:a,tag:l,props:{},children:[{type:a,tag:m,props:{href:r,rel:[n]},children:[{type:b,value:r}]}]},{type:a,tag:l,props:{},children:[{type:a,tag:m,props:{href:s,rel:[n]},children:[{type:b,value:s}]}]},{type:a,tag:l,props:{},children:[{type:a,tag:m,props:{href:t,rel:[n]},children:[{type:b,value:t}]}]}]},{type:a,tag:u,props:{id:N},children:[{type:b,value:O}]},{type:a,tag:f,props:{code:P,language:j},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:W},children:[{type:b,value:"# ios "}]}]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:"xcrun simctl openurl booted "}]},{type:a,tag:c,props:{class:o},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:q},children:[{type:b,value:T}]}]},{type:a,tag:c,props:{class:d},children:[]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:W},children:[{type:b,value:"# android"}]}]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:"adb shell am start -W -a android.intent.action.VIEW -d "}]},{type:a,tag:c,props:{class:o},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:q},children:[{type:b,value:T}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:V}]}]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:"com.application"}]}]}]}]}]},{type:a,tag:u,props:{id:Q},children:[{type:b,value:R}]},{type:a,tag:f,props:{code:S,language:j},children:[{type:a,tag:h,props:{},children:[{type:a,tag:f,props:{__ignoreMap:g},children:[{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:"PACKAGE="}]},{type:a,tag:c,props:{class:v},children:[{type:b,value:"\"com.application\""}]}]},{type:a,tag:c,props:{class:d},children:[]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:"adb shell pm set-app-links --package "}]},{type:a,tag:c,props:{class:o},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:q},children:[{type:b,value:af}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:" 0 all "}]},{type:a,tag:c,props:{class:w},children:[{type:b,value:x}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:V}]}]},{type:a,tag:c,props:{class:d},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:" adb shell pm verify-app-links --re-verify "}]},{type:a,tag:c,props:{class:o},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:q},children:[{type:b,value:af}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-25c1b4{color:#8B949E}.ct-1200ba{color:#FF7B72}.ct-4e0208{color:#79C0FF}.ct-7e13bb{color:#C9D1D9}.ct-5cb82a{color:#C9D1D9}.ct-ff9586{color:#A5D6FF}.ct-af80c7{color:#C9D1D9}.light .ct-af80c7{color:#657B83}.light .ct-ff9586{color:#2AA198}.light .ct-5cb82a{color:#859900}.light .ct-7e13bb{color:#268BD2}.light .ct-4e0208{color:#268BD2}.light .ct-1200ba{color:#859900}.light .ct-25c1b4{color:#93A1A1}"}]}],toc:{title:g,searchDepth:k,depth:k,links:[{id:z,depth:k,text:A},{id:C,depth:k,text:D},{id:F,depth:k,text:G},{id:I,depth:k,text:J},{id:L,depth:k,text:M,children:[{id:N,depth:ag,text:O},{id:Q,depth:ag,text:R}]}]}},_type:"markdown",_id:"content:Frontend:React Native:Useful comands.md",_source:"content",_file:"Frontend\u002FReact Native\u002FUseful comands.md",_extension:"md"}},prerenderedAt:1711020861124}}("element","text","span","line","ct-af80c7","code","","pre","h2","shell",2,"li","a","nofollow","ct-5cb82a","$","ct-7e13bb","https:\u002F\u002Fzarah.dev\u002F2022\u002F02\u002F08\u002Fandroid12-deeplinks.html","https:\u002F\u002Fdeveloper.android.com\u002Ftraining\u002Fapp-links\u002Fverify-site-associations#invoke-domain-verification","https:\u002F\u002Fdigitalassetlinks.googleapis.com\u002Fv1\u002Fstatements:list?source.web.site=https:\u002F\u002Fmiin.ru&relation=delegate_permission\u002Fcommon.handle_all_urls","h3","ct-ff9586","ct-1200ba","&&",false,"show-android-logcat","Show android logcat","adb logcat com.application:I \"*:S\"\n","get-apks-sha-256","Get .apk's SHA-256","keytool -printcert -jarfile \"$1\"\n","assemble-debug-release-on-android","Assemble debug release on Android","npx react-native bundle \\\n --platform android \\\n --dev false \\\n --entry-file index.js \\\n --bundle-output android\u002Fapp\u002Fsrc\u002Fmain\u002Fassets\u002Findex.android.bundle \\\n --assets-dest android\u002Fapp\u002Fsrc\u002Fmain\u002Fres\u002F\n\ncd android && .\u002Fgradlew assembleDebug\n\n# do your stuff\n\n.\u002Fgradlew clean\n","send-release-to-android-device","Send release to Android device","cd .\u002Fandroid \\\n && .\u002Fgradlew assembleRelease \\\n && adb install .\u002Fapp\u002Fbuild\u002Foutputs\u002Fapk\u002Frelease\u002Fapp-release.apk\n","deep-links","Deep links","open-deep-links","Open deep links","# ios \nxcrun simctl openurl booted $1\n\n# android\nadb shell am start -W -a android.intent.action.VIEW -d $1 \\\ncom.application\n","reverify-links-on-android","Reverify links on Android","PACKAGE=\"com.application\"\n\nadb shell pm set-app-links --package $PACKAGE 0 all && \\\n adb shell pm verify-app-links --re-verify $PACKAGE\n","1","ct-4e0208"," \\","ct-25c1b4","Useful Comands","\u002Ffrontend\u002Freact-native\u002Fuseful-comands","root","bash","p","Packages release with bundled resources.","ul","\"","cd"," ","PACKAGE",3)) \ No newline at end of file diff --git a/docs/frontend/react-native/useful-comands/index.html b/docs/frontend/react-native/useful-comands/index.html index ce9a00f..76db3ea 100644 --- a/docs/frontend/react-native/useful-comands/index.html +++ b/docs/frontend/react-native/useful-comands/index.html @@ -1,6 +1,6 @@ -Useful Comands • Obsidian Garden -

Useful Comands

Show android logcat

adb logcat com.application:I "*:S"

Get .apk's SHA-256

keytool -printcert -jarfile "$1"

Assemble debug release on Android

Packages release with bundled resources.

npx react-native bundle \  --platform android \  --dev false \  --entry-file index.js \  --bundle-output android/app/src/main/assets/index.android.bundle \  --assets-dest android/app/src/main/res/cd android && ./gradlew assembleDebug# do your stuff./gradlew clean

Send release to Android device

cd ./android \  && ./gradlew assembleRelease \  && adb install ./app/build/outputs/apk/release/app-release.apk
# ios xcrun simctl openurl booted $1# androidadb shell am start -W -a android.intent.action.VIEW -d $1 \com.application
PACKAGE="com.application"adb shell pm set-app-links --package $PACKAGE 0 all && \  adb shell pm verify-app-links --re-verify $PACKAGE
btw, have a nice day
(2018 - 2024) muerwre
+

Useful Comands

Show android logcat

adb logcat com.application:I "*:S"

Get .apk's SHA-256

keytool -printcert -jarfile "$1"

Assemble debug release on Android

Packages release with bundled resources.

npx react-native bundle \  --platform android \  --dev false \  --entry-file index.js \  --bundle-output android/app/src/main/assets/index.android.bundle \  --assets-dest android/app/src/main/res/cd android && ./gradlew assembleDebug# do your stuff./gradlew clean

Send release to Android device

cd ./android \  && ./gradlew assembleRelease \  && adb install ./app/build/outputs/apk/release/app-release.apk
# ios xcrun simctl openurl booted $1# androidadb shell am start -W -a android.intent.action.VIEW -d $1 \com.application
PACKAGE="com.application"adb shell pm set-app-links --package $PACKAGE 0 all && \  adb shell pm verify-app-links --re-verify $PACKAGE
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/frontend/react/axios-refresh-token-on-react/_payload.js b/docs/frontend/react/axios-refresh-token-on-react/_payload.js index 8d46379..39aa925 100644 --- a/docs/frontend/react/axios-refresh-token-on-react/_payload.js +++ b/docs/frontend/react/axios-refresh-token-on-react/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC,aD,aE,aF,aG,aH,aI,aJ,aK,aL,aM,aN,aO,aP,aQ,aR,aS,aT,aU,aV,aW,aX,aY,aZ,a_,a$,ba,bb){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:ae,_path:"\u002Ffrontend\u002Freact",children:[{title:af,_path:ag},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-lzTEE4EzmV":{_path:ag,_dir:"react",_draft:U,_partial:U,_locale:"en",_empty:U,title:af,description:"\u003CApiProvider \u002F\u003E component, that will handle token refresh if needed. Refresh function should, probably, be passed through component props.",excerpt:{type:ah,children:[{type:a,tag:ai,props:{},children:[{type:a,tag:aj,props:{},children:[{type:c,value:ak}]},{type:c,value:al}]},{type:a,tag:M,props:{code:V,language:am},children:[{type:a,tag:an,props:{},children:[{type:a,tag:M,props:{__ignoreMap:W},children:[{type:c,value:V}]}]}]}]},body:{type:ah,children:[{type:a,tag:ai,props:{},children:[{type:a,tag:aj,props:{},children:[{type:c,value:ak}]},{type:c,value:al}]},{type:a,tag:M,props:{code:V,language:am},children:[{type:a,tag:an,props:{},children:[{type:a,tag:M,props:{__ignoreMap:W},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:ao}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:B},children:[{type:c,value:"\"axios\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:ao}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:", {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:au}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:av}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"} "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:B},children:[{type:c,value:"\"react\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:w},children:[{type:c,value:"interface"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:"ct-e481b8"},children:[{type:c,value:ax}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:"extends"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:"ct-780082"},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:r}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:X},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:r}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:X},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:ay},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:X},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:ay},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:H},children:[{type:c,value:"void"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aA}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:m},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Q}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" client: "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Q}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" baseURL: "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }),"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"});"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:m},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aF}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:aG},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aH}]},{type:a,tag:b,props:{class:aG},children:[{type:c,value:ax}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"\u003E "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" ({ "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:D}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:D}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aI}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"}) "}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:r}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Q}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" baseURL: "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" })"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" )."}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"current"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"\u003C() "}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:H},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"\u003E(() "}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:r}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:$},children:[{type:c,value:"\u002F\u002F TODO: implement me"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"throw"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"new"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:H},children:[{type:c,value:"Error"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:B},children:[{type:c,value:"\"not implemented\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:I}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }, []);"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:av}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"(() "}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:r}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aJ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aK}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:$},children:[{type:c,value:"\u002F\u002F append `access` token to all requests"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:aL}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aM}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:aN}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:r}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aO}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:r}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" Authorization: "}]},{type:a,tag:b,props:{class:B},children:[{type:c,value:"`Bearer ${"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:"ct-4724b7"},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:B},children:[{type:c,value:"}`"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aP}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:aQ}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:r}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:H},children:[{type:c,value:aR}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aS}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:I}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aT}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aU}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:$},children:[{type:c,value:"\u002F\u002F refreshing interceptor"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:aV}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aM}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:aQ}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:r}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aP}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:aN}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:"function"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aa}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aJ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"status"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"==="}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:"ct-cf9447"},children:[{type:c,value:"401"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"&&"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aK}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aW}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aW}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:"ct-292051"},children:[{type:c,value:"true"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:aX}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Q}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aY}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" headers: {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aY}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aO}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" Authorization: "}]},{type:a,tag:b,props:{class:B},children:[{type:c,value:"\"Bearer \""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"+"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aX}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" },"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" });"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"();"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:H},children:[{type:c,value:aR}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aS}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:I}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aT}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aU}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:r}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aZ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aL}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:I}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aZ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aV}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:I}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }, ["}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"]);"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aH}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:a_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"value"}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"{{ "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" }}"}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:a$}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:" {"}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:aI}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aA}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"\u003C\u002F"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:a_}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:a$}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" );"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"};"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:ba}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"useAPI"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:au}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:")."}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:ba}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" { "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aF}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-292051{color:#79C0FF}.ct-cf9447{color:#79C0FF}.ct-4724b7{color:#A5D6FF}.ct-5a9ff7{color:#8B949E}.ct-c99834{color:#FFA657}.ct-4226d5{color:#79C0FF}.ct-e9f818{color:#79C0FF}.ct-451a9f{color:#FF7B72}.ct-d6c589{color:#D2A8FF}.ct-4aa59b{color:#79C0FF}.ct-3caf7d{color:#FF7B72}.ct-a371f4{color:#FFA657}.ct-780082{color:#79C0FF}.ct-e481b8{color:#FFA657}.ct-836525{color:#C9D1D9}.ct-44620b{color:#FF7B72}.ct-7514a2{color:#A5D6FF}.ct-da557f{color:#C9D1D9}.ct-ec59ec{color:#C9D1D9}.ct-d1490f{color:#FF7B72}.light .ct-d1490f{color:#859900}.light .ct-ec59ec{color:#657B83}.light .ct-da557f{color:#268BD2}.light .ct-7514a2{color:#2AA198}.light .ct-44620b{color:#073642}.light .ct-836525{color:#657B83}.light .ct-e481b8{color:#268BD2}.light .ct-780082{color:#657B83}.light .ct-a371f4{color:#657B83}.light .ct-3caf7d{color:#859900}.light .ct-4aa59b{color:#859900}.light .ct-d6c589{color:#268BD2}.light .ct-451a9f{color:#073642}.light .ct-e9f818{color:#859900}.light .ct-4226d5{color:#268BD2}.light .ct-c99834{color:#268BD2}.light .ct-5a9ff7{color:#93A1A1}.light .ct-4724b7{color:#657B83}.light .ct-cf9447{color:#D33682}.light .ct-292051{color:#B58900}"}]}],toc:{title:W,searchDepth:bb,depth:bb,links:[]}},_type:"markdown",_id:"content:Frontend:React:Axios refresh token on React.md",_source:"content",_file:"Frontend\u002FReact\u002FAxios refresh token on React.md",_extension:"md"}},prerenderedAt:1711020227182}}("element","span","text","ct-ec59ec","line","ct-da557f"," ","ct-d1490f",".","ct-836525","ct-d6c589"," ","ct-451a9f",",",";"," ","="," {","=\u003E","const","ct-4226d5","(","ct-44620b","ct-a371f4"," ","return","axios","ct-7514a2","tokens",", ","client","error",":","ct-e9f818",");"," ("," ","originalRequest","code","access","logout","APIContext","({","interceptors","config","response",false,"import axios from \"axios\";\nimport React, {\n createContext,\n FC,\n PropsWithChildren,\n useCallback,\n useContext,\n useEffect,\n useRef,\n} from \"react\";\n\ninterface APIProviderProps extends PropsWithChildren {\n tokens: {\n access: string;\n refresh: string;\n };\n logout: () =\u003E void;\n}\n\nconst APIContext = createContext({\n client: axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n }),\n});\n\nconst APIProvider: FC\u003CAPIProviderProps\u003E = ({ \n tokens, \n logout, \n children,\n}) =\u003E {\n const client = useRef(\n axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n })\n ).current;\n\n const refreshTokens = useCallback\u003C() =\u003E string\u003E(() =\u003E {\n \u002F\u002F TODO: implement me\n throw new Error(\"not implemented\");\n }, []);\n\n useEffect(() =\u003E {\n if (!tokens.access) {\n return;\n }\n\n \u002F\u002F append `access` token to all requests\n const req = client.interceptors.request.use(\n async (config) =\u003E {\n config.headers = {\n Authorization: `Bearer ${tokens.access}`,\n };\n return config;\n },\n (error) =\u003E {\n Promise.reject(error);\n }\n );\n\n \u002F\u002F refreshing interceptor\n const resp = client.interceptors.response.use(\n (response) =\u003E {\n return response;\n },\n async function (error) {\n const originalRequest = error.config;\n\n if (error.response.status === 401 && !originalRequest._retry) {\n originalRequest._retry = true;\n\n const newToken = refreshTokens;\n\n return axios({\n ...originalRequest,\n headers: {\n ...originalRequest.headers,\n Authorization: \"Bearer \" + newToken,\n },\n });\n }\n\n logout();\n return Promise.reject(error);\n }\n );\n\n return () =\u003E {\n axios.interceptors.request.eject(req);\n axios.interceptors.request.eject(resp);\n };\n }, [client, tokens.access, tokens.refresh, refreshTokens, logout]);\n\n return (\n \u003CAPIContext.Provider value={{ client }}\u003E\n {children}\n \u003C\u002FAPIContext.Provider\u003E\n );\n};\n\nexport const useAPI = () =\u003E useContext(APIContext).client;\n\nexport { APIProvider };\n","","ct-3caf7d","string"," () ","refreshTokens","ct-5a9ff7",") {","request",") "," ","React","Axios Refresh Token On React","\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react","root","p","code-inline","\u003CApiProvider \u002F\u003E"," component, that will handle token refresh if needed. Refresh function should, probably, be passed through component props.","typescript","pre","import","from","createContext","FC","PropsWithChildren","useCallback","useContext","useEffect","useRef","APIProviderProps","ct-4aa59b","refresh","}","create","process","env","NEXT_PUBLIC_API_ENDPOINT","APIProvider","ct-c99834","\u003C","children","if","!","req","use","async","headers"," },"," (","Promise","reject"," }"," );","resp","_retry","newToken","...","eject","Provider","\u003E","export",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC,aD,aE,aF,aG,aH,aI,aJ,aK,aL,aM,aN,aO,aP,aQ,aR,aS,aT,aU,aV,aW,aX,aY,aZ,a_,a$,ba,bb){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:ae,_path:"\u002Ffrontend\u002Freact",children:[{title:af,_path:ag},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-lzTEE4EzmV":{_path:ag,_dir:"react",_draft:U,_partial:U,_locale:"en",_empty:U,title:af,description:"\u003CApiProvider \u002F\u003E component, that will handle token refresh if needed. Refresh function should, probably, be passed through component props.",excerpt:{type:ah,children:[{type:a,tag:ai,props:{},children:[{type:a,tag:aj,props:{},children:[{type:c,value:ak}]},{type:c,value:al}]},{type:a,tag:M,props:{code:V,language:am},children:[{type:a,tag:an,props:{},children:[{type:a,tag:M,props:{__ignoreMap:W},children:[{type:c,value:V}]}]}]}]},body:{type:ah,children:[{type:a,tag:ai,props:{},children:[{type:a,tag:aj,props:{},children:[{type:c,value:ak}]},{type:c,value:al}]},{type:a,tag:M,props:{code:V,language:am},children:[{type:a,tag:an,props:{},children:[{type:a,tag:M,props:{__ignoreMap:W},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:ao}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:B},children:[{type:c,value:"\"axios\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:ao}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:", {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:au}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:av}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"} "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:B},children:[{type:c,value:"\"react\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:w},children:[{type:c,value:"interface"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:"ct-b2c705"},children:[{type:c,value:ax}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:"extends"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:"ct-855152"},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:r}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:X},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:r}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:X},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:ay},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:X},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:ay},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:H},children:[{type:c,value:"void"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aA}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:m},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Q}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" client: "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Q}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" baseURL: "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }),"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"});"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:m},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aF}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:aG},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aH}]},{type:a,tag:b,props:{class:aG},children:[{type:c,value:ax}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"\u003E "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" ({ "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:D}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:D}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aI}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"}) "}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:r}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Q}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" baseURL: "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" })"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" )."}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"current"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"\u003C() "}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:H},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"\u003E(() "}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:r}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:$},children:[{type:c,value:"\u002F\u002F TODO: implement me"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"throw"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"new"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:H},children:[{type:c,value:"Error"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:B},children:[{type:c,value:"\"not implemented\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:I}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }, []);"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:av}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"(() "}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:r}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aJ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aK}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:$},children:[{type:c,value:"\u002F\u002F append `access` token to all requests"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:aL}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aM}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:aN}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:r}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aO}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:r}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" Authorization: "}]},{type:a,tag:b,props:{class:B},children:[{type:c,value:"`Bearer ${"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:"ct-728c60"},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:B},children:[{type:c,value:"}`"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aP}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:aQ}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:r}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:H},children:[{type:c,value:aR}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aS}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:I}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aT}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aU}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:$},children:[{type:c,value:"\u002F\u002F refreshing interceptor"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:aV}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aM}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:aQ}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:r}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aP}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:aN}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:"function"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aa}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aJ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"status"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"==="}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:"ct-5a5940"},children:[{type:c,value:"401"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"&&"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aK}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aW}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aW}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:"ct-353674"},children:[{type:c,value:"true"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:aX}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Q}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aY}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" headers: {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aY}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aO}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" Authorization: "}]},{type:a,tag:b,props:{class:B},children:[{type:c,value:"\"Bearer \""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"+"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aX}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" },"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" });"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"();"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:H},children:[{type:c,value:aR}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aS}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:I}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aT}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aU}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:r}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aZ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aL}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:I}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:aZ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aV}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:I}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }, ["}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"]);"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aH}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:a_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"value"}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"{{ "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" }}"}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:a$}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:" {"}]},{type:a,tag:b,props:{class:x},children:[{type:c,value:aI}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aA}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"\u003C\u002F"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:a_}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:a$}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" );"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"};"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:ba}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"useAPI"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:au}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:")."}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:ba}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" { "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aF}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-353674{color:#79C0FF}.ct-5a5940{color:#79C0FF}.ct-728c60{color:#A5D6FF}.ct-135b0e{color:#8B949E}.ct-6b2d63{color:#FFA657}.ct-58393f{color:#79C0FF}.ct-a583ad{color:#79C0FF}.ct-07feb9{color:#FF7B72}.ct-21d2db{color:#D2A8FF}.ct-c11ef6{color:#79C0FF}.ct-7ae1e4{color:#FF7B72}.ct-9edd0f{color:#FFA657}.ct-855152{color:#79C0FF}.ct-b2c705{color:#FFA657}.ct-50c2af{color:#C9D1D9}.ct-30e61a{color:#FF7B72}.ct-b5f116{color:#A5D6FF}.ct-90fb8b{color:#C9D1D9}.ct-1c1ddb{color:#C9D1D9}.ct-65a859{color:#FF7B72}.light .ct-65a859{color:#859900}.light .ct-1c1ddb{color:#657B83}.light .ct-90fb8b{color:#268BD2}.light .ct-b5f116{color:#2AA198}.light .ct-30e61a{color:#073642}.light .ct-50c2af{color:#657B83}.light .ct-b2c705{color:#268BD2}.light .ct-855152{color:#657B83}.light .ct-9edd0f{color:#657B83}.light .ct-7ae1e4{color:#859900}.light .ct-c11ef6{color:#859900}.light .ct-21d2db{color:#268BD2}.light .ct-07feb9{color:#073642}.light .ct-a583ad{color:#859900}.light .ct-58393f{color:#268BD2}.light .ct-6b2d63{color:#268BD2}.light .ct-135b0e{color:#93A1A1}.light .ct-728c60{color:#657B83}.light .ct-5a5940{color:#D33682}.light .ct-353674{color:#B58900}"}]}],toc:{title:W,searchDepth:bb,depth:bb,links:[]}},_type:"markdown",_id:"content:Frontend:React:Axios refresh token on React.md",_source:"content",_file:"Frontend\u002FReact\u002FAxios refresh token on React.md",_extension:"md"}},prerenderedAt:1711020861175}}("element","span","text","ct-1c1ddb","line","ct-90fb8b"," ","ct-65a859",".","ct-50c2af","ct-21d2db"," ","ct-07feb9",",",";"," ","="," {","=\u003E","const","ct-58393f","(","ct-30e61a","ct-9edd0f"," ","return","axios","ct-b5f116","tokens",", ","client","error",":","ct-a583ad",");"," ("," ","originalRequest","code","access","logout","APIContext","({","interceptors","config","response",false,"import axios from \"axios\";\nimport React, {\n createContext,\n FC,\n PropsWithChildren,\n useCallback,\n useContext,\n useEffect,\n useRef,\n} from \"react\";\n\ninterface APIProviderProps extends PropsWithChildren {\n tokens: {\n access: string;\n refresh: string;\n };\n logout: () =\u003E void;\n}\n\nconst APIContext = createContext({\n client: axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n }),\n});\n\nconst APIProvider: FC\u003CAPIProviderProps\u003E = ({ \n tokens, \n logout, \n children,\n}) =\u003E {\n const client = useRef(\n axios.create({\n baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,\n })\n ).current;\n\n const refreshTokens = useCallback\u003C() =\u003E string\u003E(() =\u003E {\n \u002F\u002F TODO: implement me\n throw new Error(\"not implemented\");\n }, []);\n\n useEffect(() =\u003E {\n if (!tokens.access) {\n return;\n }\n\n \u002F\u002F append `access` token to all requests\n const req = client.interceptors.request.use(\n async (config) =\u003E {\n config.headers = {\n Authorization: `Bearer ${tokens.access}`,\n };\n return config;\n },\n (error) =\u003E {\n Promise.reject(error);\n }\n );\n\n \u002F\u002F refreshing interceptor\n const resp = client.interceptors.response.use(\n (response) =\u003E {\n return response;\n },\n async function (error) {\n const originalRequest = error.config;\n\n if (error.response.status === 401 && !originalRequest._retry) {\n originalRequest._retry = true;\n\n const newToken = refreshTokens;\n\n return axios({\n ...originalRequest,\n headers: {\n ...originalRequest.headers,\n Authorization: \"Bearer \" + newToken,\n },\n });\n }\n\n logout();\n return Promise.reject(error);\n }\n );\n\n return () =\u003E {\n axios.interceptors.request.eject(req);\n axios.interceptors.request.eject(resp);\n };\n }, [client, tokens.access, tokens.refresh, refreshTokens, logout]);\n\n return (\n \u003CAPIContext.Provider value={{ client }}\u003E\n {children}\n \u003C\u002FAPIContext.Provider\u003E\n );\n};\n\nexport const useAPI = () =\u003E useContext(APIContext).client;\n\nexport { APIProvider };\n","","ct-7ae1e4","string"," () ","refreshTokens","ct-135b0e",") {","request",") "," ","React","Axios Refresh Token On React","\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react","root","p","code-inline","\u003CApiProvider \u002F\u003E"," component, that will handle token refresh if needed. Refresh function should, probably, be passed through component props.","typescript","pre","import","from","createContext","FC","PropsWithChildren","useCallback","useContext","useEffect","useRef","APIProviderProps","ct-c11ef6","refresh","}","create","process","env","NEXT_PUBLIC_API_ENDPOINT","APIProvider","ct-6b2d63","\u003C","children","if","!","req","use","async","headers"," },"," (","Promise","reject"," }"," );","resp","_retry","newToken","...","eject","Provider","\u003E","export",2)) \ No newline at end of file diff --git a/docs/frontend/react/axios-refresh-token-on-react/index.html b/docs/frontend/react/axios-refresh-token-on-react/index.html index 3130cff..9eb7fcb 100644 --- a/docs/frontend/react/axios-refresh-token-on-react/index.html +++ b/docs/frontend/react/axios-refresh-token-on-react/index.html @@ -1,6 +1,6 @@ -Axios Refresh Token On React • Obsidian Garden -

Axios Refresh Token On React

<ApiProvider /> component, that will handle token refresh if needed. Refresh function should, probably, be passed through component props.

import axios from "axios";import React, {  createContext,  FC,  PropsWithChildren,  useCallback,  useContext,  useEffect,  useRef,} from "react";interface APIProviderProps extends PropsWithChildren {  tokens: {    access: string;    refresh: string;  };  logout: () => void;}const APIContext = createContext({  client: axios.create({    baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,  }),});const APIProvider: FC<APIProviderProps> = ({     tokens,     logout,     children,}) => {  const client = useRef(    axios.create({      baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,    })  ).current;  const refreshTokens = useCallback<() => string>(() => {    // TODO: implement me    throw new Error("not implemented");  }, []);  useEffect(() => {    if (!tokens.access) {      return;    }    // append `access` token to all requests    const req = client.interceptors.request.use(      async (config) => {        config.headers = {          Authorization: `Bearer ${tokens.access}`,        };        return config;      },      (error) => {        Promise.reject(error);      }    );    // refreshing interceptor    const resp = client.interceptors.response.use(      (response) => {        return response;      },      async function (error) {        const originalRequest = error.config;        if (error.response.status === 401 && !originalRequest._retry) {          originalRequest._retry = true;          const newToken = refreshTokens;          return axios({            ...originalRequest,            headers: {              ...originalRequest.headers,              Authorization: "Bearer " + newToken,            },          });        }        logout();        return Promise.reject(error);      }    );    return () => {      axios.interceptors.request.eject(req);      axios.interceptors.request.eject(resp);    };  }, [client, tokens.access, tokens.refresh, refreshTokens, logout]);  return (    <APIContext.Provider value={{ client }}>        {children}    </APIContext.Provider>  );};export const useAPI = () => useContext(APIContext).client;export { APIProvider };
btw, have a nice day
(2018 - 2024) muerwre
+

Axios Refresh Token On React

<ApiProvider /> component, that will handle token refresh if needed. Refresh function should, probably, be passed through component props.

import axios from "axios";import React, {  createContext,  FC,  PropsWithChildren,  useCallback,  useContext,  useEffect,  useRef,} from "react";interface APIProviderProps extends PropsWithChildren {  tokens: {    access: string;    refresh: string;  };  logout: () => void;}const APIContext = createContext({  client: axios.create({    baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,  }),});const APIProvider: FC<APIProviderProps> = ({     tokens,     logout,     children,}) => {  const client = useRef(    axios.create({      baseURL: process.env.NEXT_PUBLIC_API_ENDPOINT,    })  ).current;  const refreshTokens = useCallback<() => string>(() => {    // TODO: implement me    throw new Error("not implemented");  }, []);  useEffect(() => {    if (!tokens.access) {      return;    }    // append `access` token to all requests    const req = client.interceptors.request.use(      async (config) => {        config.headers = {          Authorization: `Bearer ${tokens.access}`,        };        return config;      },      (error) => {        Promise.reject(error);      }    );    // refreshing interceptor    const resp = client.interceptors.response.use(      (response) => {        return response;      },      async function (error) {        const originalRequest = error.config;        if (error.response.status === 401 && !originalRequest._retry) {          originalRequest._retry = true;          const newToken = refreshTokens;          return axios({            ...originalRequest,            headers: {              ...originalRequest.headers,              Authorization: "Bearer " + newToken,            },          });        }        logout();        return Promise.reject(error);      }    );    return () => {      axios.interceptors.request.eject(req);      axios.interceptors.request.eject(resp);    };  }, [client, tokens.access, tokens.refresh, refreshTokens, logout]);  return (    <APIContext.Provider value={{ client }}>        {children}    </APIContext.Provider>  );};export const useAPI = () => useContext(APIContext).client;export { APIProvider };
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/frontend/react/axios-with-abortcontroller/_payload.js b/docs/frontend/react/axios-with-abortcontroller/_payload.js index c369894..70c4f2f 100644 --- a/docs/frontend/react/axios-with-abortcontroller/_payload.js +++ b/docs/frontend/react/axios-with-abortcontroller/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:G,_path:H},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-9RFKZoeNNl":{_path:H,_dir:"react",_draft:u,_partial:u,_locale:"en",_empty:u,title:G,description:"If you need to cancel some request, use axios with AbortController. Previously axios used cancellation token, but now it's deprecated.",excerpt:{type:I,children:[{type:a,tag:r,props:{},children:[{type:c,value:J},{type:a,tag:K,props:{href:L,rel:[M]},children:[{type:c,value:N}]},{type:c,value:O}]},{type:a,tag:r,props:{},children:[{type:a,tag:P,props:{},children:[{type:c,value:s}]},{type:c,value:Q}]},{type:a,tag:t,props:{code:v,language:R},children:[{type:a,tag:S,props:{},children:[{type:a,tag:t,props:{__ignoreMap:w},children:[{type:c,value:v}]}]}]}]},body:{type:I,children:[{type:a,tag:r,props:{},children:[{type:c,value:J},{type:a,tag:K,props:{href:L,rel:[M]},children:[{type:c,value:N}]},{type:c,value:O}]},{type:a,tag:r,props:{},children:[{type:a,tag:P,props:{},children:[{type:c,value:s}]},{type:c,value:Q}]},{type:a,tag:t,props:{code:v,language:R},children:[{type:a,tag:S,props:{},children:[{type:a,tag:t,props:{__ignoreMap:w},children:[{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" } "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:"\"react\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:"'axios'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:f},children:[]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:i},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"create"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]}]},{type:a,tag:b,props:{class:f},children:[]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:"export"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"useGetUsers"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:C}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"());"}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"async"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:C}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"await"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:"\"\u002F\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:", {"}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]},{type:a,tag:b,props:{class:ab},children:[{type:c,value:"\u002F\u002F params and props here"}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" signal: "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"signal"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:","}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" });"}]}]},{type:a,tag:b,props:{class:f},children:[]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"data"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }, []);"}]}]},{type:a,tag:b,props:{class:f},children:[]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"(() "}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:C}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"abort"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:ab},children:[{type:c,value:"\u002F\u002F controller should be rewritten or all requests will fail"}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }, ["}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"]);"}]}]},{type:a,tag:b,props:{class:f},children:[]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"};"}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-1fa0ed{color:#8B949E}.ct-b9c34f{color:#D2A8FF}.ct-34d3f4{color:#79C0FF}.ct-424511{color:#FF7B72}.ct-509459{color:#A5D6FF}.ct-b3c3b1{color:#C9D1D9}.ct-763991{color:#C9D1D9}.ct-20c8c4{color:#FF7B72}.light .ct-20c8c4{color:#859900}.light .ct-763991{color:#657B83}.light .ct-b3c3b1{color:#268BD2}.light .ct-509459{color:#2AA198}.light .ct-424511{color:#073642}.light .ct-34d3f4{color:#268BD2}.light .ct-b9c34f{color:#268BD2}.light .ct-1fa0ed{color:#93A1A1}"}]}],toc:{title:w,searchDepth:ae,depth:ae,links:[]}},_type:"markdown",_id:"content:Frontend:React:Axios with AbortController.md",_source:"content",_file:"Frontend\u002FReact\u002FAxios with AbortController.md",_extension:"md"}},prerenderedAt:1711020227232}}("element","span","text","ct-763991"," ","line","ct-20c8c4","ct-b3c3b1","ct-424511","ct-b9c34f",".","=","const"," ","ct-34d3f4"," ","controller","p","AbortController","code",false,"import { useCallback, useRef } from \"react\";\nimport axios from 'axios';\n\nconst client = axios.create();\n\nexport const useGetUsers = () =\u003E {\n const controller = useRef(new AbortController());\n \n const get = useCallback(async () =\u003E {\n const result = await client.get(\"\u002F\", {\n \u002F\u002F params and props here\n signal: controller.current.signal,\n });\n\n return result.data;\n }, []);\n\n const cancel = useCallback(() =\u003E {\n controller.current.abort();\n \n \u002F\u002F controller should be rewritten or all requests will fail\n controller.current = new AbortController();\n }, [controller]);\n\n return { get, cancel };\n};\n","","useCallback","ct-509459",";","();","=\u003E"," {","(","get","current","Axios With AbortController","\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller","root","If you need to cancel some request, use ","a","https:\u002F\u002Faxios-http.com\u002Fdocs\u002Fcancellation","nofollow","axios with AbortController",". Previously axios used cancellation token, but now it's deprecated.","code-inline"," can be used with a multiple requests to cancel them at once.","typescript","pre","import"," { ",", ","useRef","from","axios","client"," () ","new","result","ct-1fa0ed","return","cancel",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:G,_path:H},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-9RFKZoeNNl":{_path:H,_dir:"react",_draft:u,_partial:u,_locale:"en",_empty:u,title:G,description:"If you need to cancel some request, use axios with AbortController. Previously axios used cancellation token, but now it's deprecated.",excerpt:{type:I,children:[{type:a,tag:r,props:{},children:[{type:c,value:J},{type:a,tag:K,props:{href:L,rel:[M]},children:[{type:c,value:N}]},{type:c,value:O}]},{type:a,tag:r,props:{},children:[{type:a,tag:P,props:{},children:[{type:c,value:s}]},{type:c,value:Q}]},{type:a,tag:t,props:{code:v,language:R},children:[{type:a,tag:S,props:{},children:[{type:a,tag:t,props:{__ignoreMap:w},children:[{type:c,value:v}]}]}]}]},body:{type:I,children:[{type:a,tag:r,props:{},children:[{type:c,value:J},{type:a,tag:K,props:{href:L,rel:[M]},children:[{type:c,value:N}]},{type:c,value:O}]},{type:a,tag:r,props:{},children:[{type:a,tag:P,props:{},children:[{type:c,value:s}]},{type:c,value:Q}]},{type:a,tag:t,props:{code:v,language:R},children:[{type:a,tag:S,props:{},children:[{type:a,tag:t,props:{__ignoreMap:w},children:[{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" } "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:"\"react\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:"'axios'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:f},children:[]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:i},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"create"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]}]},{type:a,tag:b,props:{class:f},children:[]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:"export"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"useGetUsers"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:C}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"());"}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"async"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:C}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"await"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:"\"\u002F\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:", {"}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]},{type:a,tag:b,props:{class:ab},children:[{type:c,value:"\u002F\u002F params and props here"}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" signal: "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"signal"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:","}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" });"}]}]},{type:a,tag:b,props:{class:f},children:[]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"data"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }, []);"}]}]},{type:a,tag:b,props:{class:f},children:[]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"(() "}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:C}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"abort"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:ab},children:[{type:c,value:"\u002F\u002F controller should be rewritten or all requests will fail"}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }, ["}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"]);"}]}]},{type:a,tag:b,props:{class:f},children:[]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"};"}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-964aa7{color:#8B949E}.ct-b05c66{color:#D2A8FF}.ct-fdde86{color:#79C0FF}.ct-080c78{color:#FF7B72}.ct-d31196{color:#A5D6FF}.ct-b5803b{color:#C9D1D9}.ct-5512bc{color:#C9D1D9}.ct-6d2f6e{color:#FF7B72}.light .ct-6d2f6e{color:#859900}.light .ct-5512bc{color:#657B83}.light .ct-b5803b{color:#268BD2}.light .ct-d31196{color:#2AA198}.light .ct-080c78{color:#073642}.light .ct-fdde86{color:#268BD2}.light .ct-b05c66{color:#268BD2}.light .ct-964aa7{color:#93A1A1}"}]}],toc:{title:w,searchDepth:ae,depth:ae,links:[]}},_type:"markdown",_id:"content:Frontend:React:Axios with AbortController.md",_source:"content",_file:"Frontend\u002FReact\u002FAxios with AbortController.md",_extension:"md"}},prerenderedAt:1711020861266}}("element","span","text","ct-5512bc"," ","line","ct-6d2f6e","ct-b5803b","ct-080c78","ct-b05c66",".","=","const"," ","ct-fdde86"," ","controller","p","AbortController","code",false,"import { useCallback, useRef } from \"react\";\nimport axios from 'axios';\n\nconst client = axios.create();\n\nexport const useGetUsers = () =\u003E {\n const controller = useRef(new AbortController());\n \n const get = useCallback(async () =\u003E {\n const result = await client.get(\"\u002F\", {\n \u002F\u002F params and props here\n signal: controller.current.signal,\n });\n\n return result.data;\n }, []);\n\n const cancel = useCallback(() =\u003E {\n controller.current.abort();\n \n \u002F\u002F controller should be rewritten or all requests will fail\n controller.current = new AbortController();\n }, [controller]);\n\n return { get, cancel };\n};\n","","useCallback","ct-d31196",";","();","=\u003E"," {","(","get","current","Axios With AbortController","\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller","root","If you need to cancel some request, use ","a","https:\u002F\u002Faxios-http.com\u002Fdocs\u002Fcancellation","nofollow","axios with AbortController",". Previously axios used cancellation token, but now it's deprecated.","code-inline"," can be used with a multiple requests to cancel them at once.","typescript","pre","import"," { ",", ","useRef","from","axios","client"," () ","new","result","ct-964aa7","return","cancel",2)) \ No newline at end of file diff --git a/docs/frontend/react/axios-with-abortcontroller/index.html b/docs/frontend/react/axios-with-abortcontroller/index.html index a0af907..cf1871f 100644 --- a/docs/frontend/react/axios-with-abortcontroller/index.html +++ b/docs/frontend/react/axios-with-abortcontroller/index.html @@ -1,6 +1,6 @@ -Axios With AbortController • Obsidian Garden -

Axios With AbortController

If you need to cancel some request, use axios with AbortController. Previously axios used cancellation token, but now it's deprecated.

AbortController can be used with a multiple requests to cancel them at once.

import { useCallback, useRef } from "react";import axios from 'axios';const client = axios.create();export const useGetUsers = () => {  const controller = useRef(new AbortController());    const get = useCallback(async () => {    const result = await client.get("/", {        // params and props here        signal: controller.current.signal,    });    return result.data;  }, []);  const cancel = useCallback(() => {    controller.current.abort();        // controller should be rewritten or all requests will fail    controller.current = new AbortController();  }, [controller]);  return { get, cancel };};
btw, have a nice day
(2018 - 2024) muerwre
+

Axios With AbortController

If you need to cancel some request, use axios with AbortController. Previously axios used cancellation token, but now it's deprecated.

AbortController can be used with a multiple requests to cancel them at once.

import { useCallback, useRef } from "react";import axios from 'axios';const client = axios.create();export const useGetUsers = () => {  const controller = useRef(new AbortController());    const get = useCallback(async () => {    const result = await client.get("/", {        // params and props here        signal: controller.current.signal,    });    return result.data;  }, []);  const cancel = useCallback(() => {    controller.current.abort();        // controller should be rewritten or all requests will fail    controller.current = new AbortController();  }, [controller]);  return { get, cancel };};
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/frontend/react/detect-hook-deps-changes-with-usewhatschanged/_payload.js b/docs/frontend/react/detect-hook-deps-changes-with-usewhatschanged/_payload.js index dc180b0..e081737 100644 --- a/docs/frontend/react/detect-hook-deps-changes-with-usewhatschanged/_payload.js +++ b/docs/frontend/react/detect-hook-deps-changes-with-usewhatschanged/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:A,_path:B}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-1DsgTOuGa0":{_path:B,_dir:"react",_draft:t,_partial:t,_locale:"en",_empty:t,title:A,description:k,excerpt:{type:C,children:[{type:a,tag:l,props:{code:u,language:D},children:[{type:a,tag:E,props:{},children:[{type:a,tag:l,props:{__ignoreMap:k},children:[{type:c,value:u}]}]}]}]},body:{type:C,children:[{type:a,tag:l,props:{code:u,language:D},children:[{type:a,tag:E,props:{},children:[{type:a,tag:l,props:{__ignoreMap:k},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:"import"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" { "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" } "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"from"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"'react'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:m},children:[{type:c,value:"\u002F** Pass dictionary of `props` as argument and it will"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:m},children:[{type:c,value:" * tell you, which one changed after rerender."}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:m},children:[{type:c,value:" * Use `prefix` to distinguish props of different components."}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:m},children:[{type:c,value:" *\u002F"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:"export"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"useWhatsChanged"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:i},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:"ct-2785b1"},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:"ct-d5ec24"},children:[{type:c,value:":"}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:"ct-520617"},children:[{type:c,value:"Record"}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"\u003C"}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:"string"}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:"unknown"}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"\u003E,"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"''"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:","}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:") "}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:"ct-692261"},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"(() "}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:i},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:"Object"}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:"ct-2412ed"},children:[{type:c,value:"entries"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"if"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"["}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"] "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"!=="}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"value"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" ) {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"console"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"log"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"`${"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"} ${"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"} has changed`"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" });"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }, ["}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"]);"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"};"}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-2412ed{color:#D2A8FF}.ct-692261{color:#79C0FF}.ct-ed0b46{color:#79C0FF}.ct-520617{color:#FFA657}.ct-d5ec24{color:#FF7B72}.ct-2785b1{color:#FFA657}.ct-e7e798{color:#C9D1D9}.ct-6e8da2{color:#D2A8FF}.ct-a12dc4{color:#FF7B72}.ct-b09843{color:#8B949E}.ct-34dada{color:#A5D6FF}.ct-4d5aa5{color:#C9D1D9}.ct-20cbd5{color:#C9D1D9}.ct-ca2f8e{color:#FF7B72}.light .ct-ca2f8e{color:#859900}.light .ct-20cbd5{color:#657B83}.light .ct-4d5aa5{color:#268BD2}.light .ct-34dada{color:#2AA198}.light .ct-b09843{color:#93A1A1}.light .ct-a12dc4{color:#073642}.light .ct-6e8da2{color:#268BD2}.light .ct-e7e798{color:#657B83}.light .ct-2785b1{color:#657B83}.light .ct-d5ec24{color:#859900}.light .ct-520617{color:#268BD2}.light .ct-ed0b46{color:#859900}.light .ct-692261{color:#268BD2}.light .ct-2412ed{color:#268BD2}"}]}],toc:{title:k,searchDepth:R,depth:R,links:[]}},_type:"markdown",_id:"content:Frontend:React:Detect hook deps changes with useWhatsChanged.md",_source:"content",_file:"Frontend\u002FReact\u002FDetect hook deps changes with useWhatsChanged.md",_extension:"md"}},prerenderedAt:1711020227267}}("element","span","text","ct-20cbd5","line","ct-4d5aa5"," ","ct-ca2f8e","ct-e7e798","ct-34dada","","code","ct-b09843","ct-a12dc4","ct-6e8da2","="," ","props",".",false,"import { useEffect, useRef } from 'react';\n\n\u002F** Pass dictionary of `props` as argument and it will\n * tell you, which one changed after rerender.\n * Use `prefix` to distinguish props of different components.\n *\u002F\nexport const useWhatsChanged = (\n props: Record\u003Cstring, unknown\u003E,\n prefix = '',\n) =\u003E {\n const prevProps = useRef(props);\n\n useEffect(() =\u003E {\n Object.entries(props).forEach(([key, value]) =\u003E {\n if (\n !Object.prototype.hasOwnProperty.call(prevProps.current, key) ||\n prevProps.current[key] !== value\n ) {\n console.log(`${prefix} ${key} has changed`);\n }\n });\n\n prevProps.current = props;\n }, [props, prefix]);\n};\n\n",", ","ct-ed0b46","prefix","prevProps"," ","Detect Hook Deps Changes With UseWhatsChanged","\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged","root","typescript","pre","useEffect","useRef",";","const"," (","=\u003E"," {","(",");"," ","current","key",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:A,_path:B}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-1DsgTOuGa0":{_path:B,_dir:"react",_draft:t,_partial:t,_locale:"en",_empty:t,title:A,description:k,excerpt:{type:C,children:[{type:a,tag:l,props:{code:u,language:D},children:[{type:a,tag:E,props:{},children:[{type:a,tag:l,props:{__ignoreMap:k},children:[{type:c,value:u}]}]}]}]},body:{type:C,children:[{type:a,tag:l,props:{code:u,language:D},children:[{type:a,tag:E,props:{},children:[{type:a,tag:l,props:{__ignoreMap:k},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:"import"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" { "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" } "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"from"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"'react'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:m},children:[{type:c,value:"\u002F** Pass dictionary of `props` as argument and it will"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:m},children:[{type:c,value:" * tell you, which one changed after rerender."}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:m},children:[{type:c,value:" * Use `prefix` to distinguish props of different components."}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:m},children:[{type:c,value:" *\u002F"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:"export"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"useWhatsChanged"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:i},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:"ct-ab123e"},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:"ct-0a753e"},children:[{type:c,value:":"}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:"ct-b30c00"},children:[{type:c,value:"Record"}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"\u003C"}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:"string"}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:"unknown"}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"\u003E,"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"''"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:","}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:") "}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:"ct-0c4f6c"},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"(() "}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:i},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:w},children:[{type:c,value:"Object"}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:"ct-641741"},children:[{type:c,value:"entries"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"if"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"["}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"] "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"!=="}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"value"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" ) {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"console"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:o},children:[{type:c,value:"log"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"`${"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"} ${"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"} has changed`"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" });"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }, ["}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"]);"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"};"}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-641741{color:#D2A8FF}.ct-0c4f6c{color:#79C0FF}.ct-989f48{color:#79C0FF}.ct-b30c00{color:#FFA657}.ct-0a753e{color:#FF7B72}.ct-ab123e{color:#FFA657}.ct-d4c992{color:#C9D1D9}.ct-3b4b35{color:#D2A8FF}.ct-b5989a{color:#FF7B72}.ct-1e9884{color:#8B949E}.ct-851537{color:#A5D6FF}.ct-e40149{color:#C9D1D9}.ct-b1d28d{color:#C9D1D9}.ct-b27501{color:#FF7B72}.light .ct-b27501{color:#859900}.light .ct-b1d28d{color:#657B83}.light .ct-e40149{color:#268BD2}.light .ct-851537{color:#2AA198}.light .ct-1e9884{color:#93A1A1}.light .ct-b5989a{color:#073642}.light .ct-3b4b35{color:#268BD2}.light .ct-d4c992{color:#657B83}.light .ct-ab123e{color:#657B83}.light .ct-0a753e{color:#859900}.light .ct-b30c00{color:#268BD2}.light .ct-989f48{color:#859900}.light .ct-0c4f6c{color:#268BD2}.light .ct-641741{color:#268BD2}"}]}],toc:{title:k,searchDepth:R,depth:R,links:[]}},_type:"markdown",_id:"content:Frontend:React:Detect hook deps changes with useWhatsChanged.md",_source:"content",_file:"Frontend\u002FReact\u002FDetect hook deps changes with useWhatsChanged.md",_extension:"md"}},prerenderedAt:1711020861307}}("element","span","text","ct-b1d28d","line","ct-e40149"," ","ct-b27501","ct-d4c992","ct-851537","","code","ct-1e9884","ct-b5989a","ct-3b4b35","="," ","props",".",false,"import { useEffect, useRef } from 'react';\n\n\u002F** Pass dictionary of `props` as argument and it will\n * tell you, which one changed after rerender.\n * Use `prefix` to distinguish props of different components.\n *\u002F\nexport const useWhatsChanged = (\n props: Record\u003Cstring, unknown\u003E,\n prefix = '',\n) =\u003E {\n const prevProps = useRef(props);\n\n useEffect(() =\u003E {\n Object.entries(props).forEach(([key, value]) =\u003E {\n if (\n !Object.prototype.hasOwnProperty.call(prevProps.current, key) ||\n prevProps.current[key] !== value\n ) {\n console.log(`${prefix} ${key} has changed`);\n }\n });\n\n prevProps.current = props;\n }, [props, prefix]);\n};\n\n",", ","ct-989f48","prefix","prevProps"," ","Detect Hook Deps Changes With UseWhatsChanged","\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged","root","typescript","pre","useEffect","useRef",";","const"," (","=\u003E"," {","(",");"," ","current","key",2)) \ No newline at end of file diff --git a/docs/frontend/react/detect-hook-deps-changes-with-usewhatschanged/index.html b/docs/frontend/react/detect-hook-deps-changes-with-usewhatschanged/index.html index e71afd6..ddf730c 100644 --- a/docs/frontend/react/detect-hook-deps-changes-with-usewhatschanged/index.html +++ b/docs/frontend/react/detect-hook-deps-changes-with-usewhatschanged/index.html @@ -1,6 +1,6 @@ -Detect Hook Deps Changes With UseWhatsChanged • Obsidian Garden -

Detect Hook Deps Changes With UseWhatsChanged

import { useEffect, useRef } from 'react';/** Pass dictionary of `props` as argument and it will * tell you, which one changed after rerender. * Use `prefix` to distinguish props of different components. */export const useWhatsChanged = (  props: Record<string, unknown>,  prefix = '',) => {  const prevProps = useRef(props);  useEffect(() => {    Object.entries      if (                prevProps.current[key] !== value      ) {        console.log(`${prefix} ${key} has changed`);      }    });    prevProps.current = props;  }, [props, prefix]);};
btw, have a nice day
(2018 - 2024) muerwre
+

Detect Hook Deps Changes With UseWhatsChanged

import { useEffect, useRef } from 'react';/** Pass dictionary of `props` as argument and it will * tell you, which one changed after rerender. * Use `prefix` to distinguish props of different components. */export const useWhatsChanged = (  props: Record<string, unknown>,  prefix = '',) => {  const prevProps = useRef(props);  useEffect(() => {    Object.entries      if (                prevProps.current[key] !== value      ) {        console.log(`${prefix} ${key} has changed`);      }    });    prevProps.current = props;  }, [props, prefix]);};
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/frontend/vue/add-global-variable-to-window/_payload.js b/docs/frontend/vue/add-global-variable-to-window/_payload.js index a899d16..092b3c5 100644 --- a/docs/frontend/vue/add-global-variable-to-window/_payload.js +++ b/docs/frontend/vue/add-global-variable-to-window/_payload.js @@ -1 +1 @@ -export default {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-gf0FmfUQhH":null},prerenderedAt:1711020228209} \ No newline at end of file +export default {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-gf0FmfUQhH":null},prerenderedAt:1711020862863} \ No newline at end of file diff --git a/docs/frontend/vue/add-global-variable-to-window/index.html b/docs/frontend/vue/add-global-variable-to-window/index.html index 9143320..5f7a333 100644 --- a/docs/frontend/vue/add-global-variable-to-window/index.html +++ b/docs/frontend/vue/add-global-variable-to-window/index.html @@ -1,6 +1,6 @@ -Obsidian Garden - + \ No newline at end of file diff --git a/docs/frontend/vue/adding-global-properties-to-component/_payload.js b/docs/frontend/vue/adding-global-properties-to-component/_payload.js index 40f443e..f21c8ca 100644 --- a/docs/frontend/vue/adding-global-properties-to-component/_payload.js +++ b/docs/frontend/vue/adding-global-properties-to-component/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:q,_path:r},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-gHURXJrO3C":{_path:r,_dir:"vue",_draft:l,_partial:l,_locale:"en",_empty:l,title:q,description:"The topic's fully covered in the official documentation and in Add global variable to window.",excerpt:{type:s,children:[{type:a,tag:h,props:{},children:[{type:b,value:t},{type:a,tag:i,props:{href:u,rel:[v]},children:[{type:b,value:w}]},{type:b,value:x},{type:a,tag:i,props:{href:y},children:[{type:b,value:z}]},{type:b,value:A}]},{type:a,tag:h,props:{},children:[{type:b,value:B},{type:a,tag:j,props:{},children:[{type:b,value:C}]},{type:b,value:D},{type:a,tag:j,props:{},children:[{type:b,value:m}]},{type:b,value:E}]},{type:a,tag:k,props:{code:n,language:F},children:[{type:a,tag:G,props:{},children:[{type:a,tag:k,props:{__ignoreMap:o},children:[{type:b,value:n}]}]}]}]},body:{type:s,children:[{type:a,tag:h,props:{},children:[{type:b,value:t},{type:a,tag:i,props:{href:u,rel:[v]},children:[{type:b,value:w}]},{type:b,value:x},{type:a,tag:i,props:{href:y},children:[{type:b,value:z}]},{type:b,value:A}]},{type:a,tag:h,props:{},children:[{type:b,value:B},{type:a,tag:j,props:{},children:[{type:b,value:C}]},{type:b,value:D},{type:a,tag:j,props:{},children:[{type:b,value:m}]},{type:b,value:E}]},{type:a,tag:k,props:{code:n,language:F},children:[{type:a,tag:G,props:{},children:[{type:a,tag:k,props:{__ignoreMap:o},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:"ct-026e23"},children:[{type:b,value:"\u002F\u002F ~\u002Findex.d.ts or ~\u002Fcustom.d.ts"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:H},children:[{type:b,value:"import"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:"ct-7bada2"},children:[{type:b,value:"axios"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:H},children:[{type:b,value:"from"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:I},children:[{type:b,value:"'axios'"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:p},children:[{type:b,value:"declare"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:p},children:[{type:b,value:"module"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:I},children:[{type:b,value:"'vue'"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:J}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:p},children:[{type:b,value:"interface"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:"ct-772f4e"},children:[{type:b,value:"ComponentCustomProperties"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:J}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:"ct-b5f651"},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:K},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:" ("}]},{type:a,tag:c,props:{class:"ct-3f2b67"},children:[{type:b,value:"key"}]},{type:a,tag:c,props:{class:K},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:M},children:[{type:b,value:N}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:") "}]},{type:a,tag:c,props:{class:"ct-cd10b7"},children:[{type:b,value:"=\u003E"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:M},children:[{type:b,value:N}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" }"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"}"}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-cd10b7{color:#FF7B72}.ct-41a6a6{color:#79C0FF}.ct-3f2b67{color:#FFA657}.ct-4eb8ad{color:#FF7B72}.ct-b5f651{color:#D2A8FF}.ct-07f096{color:#C9D1D9}.ct-772f4e{color:#FFA657}.ct-1a2afa{color:#FF7B72}.ct-318f96{color:#A5D6FF}.ct-7bada2{color:#C9D1D9}.ct-720b32{color:#C9D1D9}.ct-3204ed{color:#FF7B72}.ct-026e23{color:#8B949E}.light .ct-026e23{color:#93A1A1}.light .ct-3204ed{color:#859900}.light .ct-720b32{color:#657B83}.light .ct-7bada2{color:#268BD2}.light .ct-318f96{color:#2AA198}.light .ct-1a2afa{color:#073642}.light .ct-772f4e{color:#268BD2}.light .ct-07f096{color:#657B83}.light .ct-b5f651{color:#268BD2}.light .ct-4eb8ad{color:#859900}.light .ct-3f2b67{color:#657B83}.light .ct-41a6a6{color:#859900}.light .ct-cd10b7{color:#073642}"}]}],toc:{title:o,searchDepth:O,depth:O,links:[]}},_type:"markdown",_id:"content:Frontend:Vue:Adding global properties to component.md",_source:"content",_file:"Frontend\u002FVue\u002FAdding global properties to component.md",_extension:"md"}},prerenderedAt:1711020227287}}("element","text","span","ct-720b32","line"," ","ct-07f096","p","a","code-inline","code",false,"$translate","\u002F\u002F ~\u002Findex.d.ts or ~\u002Fcustom.d.ts\n\nimport axios from 'axios'\n\ndeclare module 'vue' {\n interface ComponentCustomProperties {\n $http: typeof axios\n $translate: (key: string) =\u003E string\n }\n}\n","","ct-1a2afa","Adding Global Properties To Component","\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component","root","The topic's fully covered in the ","https:\u002F\u002Fvuejs.org\u002Fguide\u002Ftypescript\u002Foptions-api.html#augmenting-global-properties","nofollow","official documentation"," and in ","Add%20global%20variable%20to%20window","Add global variable to window",".","For example, you want to add global ","$http"," and "," services to all of project's components:","typescript","pre","ct-3204ed","ct-318f96"," {","ct-4eb8ad",":","ct-41a6a6","string",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:q,_path:r},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-gHURXJrO3C":{_path:r,_dir:"vue",_draft:l,_partial:l,_locale:"en",_empty:l,title:q,description:"The topic's fully covered in the official documentation and in Add global variable to window.",excerpt:{type:s,children:[{type:a,tag:h,props:{},children:[{type:b,value:t},{type:a,tag:i,props:{href:u,rel:[v]},children:[{type:b,value:w}]},{type:b,value:x},{type:a,tag:i,props:{href:y},children:[{type:b,value:z}]},{type:b,value:A}]},{type:a,tag:h,props:{},children:[{type:b,value:B},{type:a,tag:j,props:{},children:[{type:b,value:C}]},{type:b,value:D},{type:a,tag:j,props:{},children:[{type:b,value:m}]},{type:b,value:E}]},{type:a,tag:k,props:{code:n,language:F},children:[{type:a,tag:G,props:{},children:[{type:a,tag:k,props:{__ignoreMap:o},children:[{type:b,value:n}]}]}]}]},body:{type:s,children:[{type:a,tag:h,props:{},children:[{type:b,value:t},{type:a,tag:i,props:{href:u,rel:[v]},children:[{type:b,value:w}]},{type:b,value:x},{type:a,tag:i,props:{href:y},children:[{type:b,value:z}]},{type:b,value:A}]},{type:a,tag:h,props:{},children:[{type:b,value:B},{type:a,tag:j,props:{},children:[{type:b,value:C}]},{type:b,value:D},{type:a,tag:j,props:{},children:[{type:b,value:m}]},{type:b,value:E}]},{type:a,tag:k,props:{code:n,language:F},children:[{type:a,tag:G,props:{},children:[{type:a,tag:k,props:{__ignoreMap:o},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:"ct-b7b0cd"},children:[{type:b,value:"\u002F\u002F ~\u002Findex.d.ts or ~\u002Fcustom.d.ts"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:H},children:[{type:b,value:"import"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:"ct-f07ca9"},children:[{type:b,value:"axios"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:H},children:[{type:b,value:"from"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:I},children:[{type:b,value:"'axios'"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:p},children:[{type:b,value:"declare"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:p},children:[{type:b,value:"module"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:I},children:[{type:b,value:"'vue'"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:J}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:p},children:[{type:b,value:"interface"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:"ct-d5c625"},children:[{type:b,value:"ComponentCustomProperties"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:J}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:g},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:"ct-33e5c2"},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:K},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:" ("}]},{type:a,tag:c,props:{class:"ct-d8377e"},children:[{type:b,value:"key"}]},{type:a,tag:c,props:{class:K},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:M},children:[{type:b,value:N}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:") "}]},{type:a,tag:c,props:{class:"ct-f0c8cd"},children:[{type:b,value:"=\u003E"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:M},children:[{type:b,value:N}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" }"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"}"}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-f0c8cd{color:#FF7B72}.ct-d4f523{color:#79C0FF}.ct-d8377e{color:#FFA657}.ct-d5befa{color:#FF7B72}.ct-33e5c2{color:#D2A8FF}.ct-86544a{color:#C9D1D9}.ct-d5c625{color:#FFA657}.ct-537f3d{color:#FF7B72}.ct-61f814{color:#A5D6FF}.ct-f07ca9{color:#C9D1D9}.ct-a07843{color:#C9D1D9}.ct-e981e0{color:#FF7B72}.ct-b7b0cd{color:#8B949E}.light .ct-b7b0cd{color:#93A1A1}.light .ct-e981e0{color:#859900}.light .ct-a07843{color:#657B83}.light .ct-f07ca9{color:#268BD2}.light .ct-61f814{color:#2AA198}.light .ct-537f3d{color:#073642}.light .ct-d5c625{color:#268BD2}.light .ct-86544a{color:#657B83}.light .ct-33e5c2{color:#268BD2}.light .ct-d5befa{color:#859900}.light .ct-d8377e{color:#657B83}.light .ct-d4f523{color:#859900}.light .ct-f0c8cd{color:#073642}"}]}],toc:{title:o,searchDepth:O,depth:O,links:[]}},_type:"markdown",_id:"content:Frontend:Vue:Adding global properties to component.md",_source:"content",_file:"Frontend\u002FVue\u002FAdding global properties to component.md",_extension:"md"}},prerenderedAt:1711020861355}}("element","text","span","ct-a07843","line"," ","ct-86544a","p","a","code-inline","code",false,"$translate","\u002F\u002F ~\u002Findex.d.ts or ~\u002Fcustom.d.ts\n\nimport axios from 'axios'\n\ndeclare module 'vue' {\n interface ComponentCustomProperties {\n $http: typeof axios\n $translate: (key: string) =\u003E string\n }\n}\n","","ct-537f3d","Adding Global Properties To Component","\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component","root","The topic's fully covered in the ","https:\u002F\u002Fvuejs.org\u002Fguide\u002Ftypescript\u002Foptions-api.html#augmenting-global-properties","nofollow","official documentation"," and in ","Add%20global%20variable%20to%20window","Add global variable to window",".","For example, you want to add global ","$http"," and "," services to all of project's components:","typescript","pre","ct-e981e0","ct-61f814"," {","ct-d5befa",":","ct-d4f523","string",2)) \ No newline at end of file diff --git a/docs/frontend/vue/adding-global-properties-to-component/index.html b/docs/frontend/vue/adding-global-properties-to-component/index.html index 755c19f..9d8be8a 100644 --- a/docs/frontend/vue/adding-global-properties-to-component/index.html +++ b/docs/frontend/vue/adding-global-properties-to-component/index.html @@ -1,6 +1,6 @@ -Adding Global Properties To Component • Obsidian Garden -

Adding Global Properties To Component

The topic's fully covered in the official documentation and in Add global variable to window.

For example, you want to add global $http and $translate services to all of project's components:

// ~/index.d.ts or ~/custom.d.tsimport axios from 'axios'declare module 'vue' {  interface ComponentCustomProperties {      $translate: (key: string) => string  }}
btw, have a nice day
(2018 - 2024) muerwre
+

Adding Global Properties To Component

The topic's fully covered in the official documentation and in Add global variable to window.

For example, you want to add global $http and $translate services to all of project's components:

// ~/index.d.ts or ~/custom.d.tsimport axios from 'axios'declare module 'vue' {  interface ComponentCustomProperties {      $translate: (key: string) => string  }}
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/frontend/vue/make-nuxt-handle-obsidian-highlights/_payload.js b/docs/frontend/vue/make-nuxt-handle-obsidian-highlights/_payload.js index cfd664f..effd335 100644 --- a/docs/frontend/vue/make-nuxt-handle-obsidian-highlights/_payload.js +++ b/docs/frontend/vue/make-nuxt-handle-obsidian-highlights/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:u,_path:v}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-JZY9J7Y59r":{_path:v,_dir:"vue",_draft:m,_partial:m,_locale:"en",_empty:m,title:u,description:"By default Nuxt Content Plugin not handling \u003Cspan class=\"highlight\"\u003Ehighlight\u003C\u002Fspan\u003E links. To fix that we will create Nitro plugin:",excerpt:{type:w,children:[{type:a,tag:x,props:{},children:[{type:b,value:y},{type:a,tag:z,props:{href:A,rel:[B]},children:[{type:b,value:C}]},{type:b,value:D},{type:a,tag:k,props:{},children:[{type:b,value:E}]},{type:b,value:F},{type:a,tag:k,props:{},children:[{type:b,value:G}]},{type:b,value:H}]},{type:a,tag:l,props:{code:n,language:I},children:[{type:a,tag:J,props:{},children:[{type:a,tag:l,props:{__ignoreMap:o},children:[{type:b,value:n}]}]}]}]},body:{type:w,children:[{type:a,tag:x,props:{},children:[{type:b,value:y},{type:a,tag:z,props:{href:A,rel:[B]},children:[{type:b,value:C}]},{type:b,value:D},{type:a,tag:k,props:{},children:[{type:b,value:E}]},{type:b,value:F},{type:a,tag:k,props:{},children:[{type:b,value:G}]},{type:b,value:H}]},{type:a,tag:l,props:{code:n,language:I},children:[{type:a,tag:J,props:{},children:[{type:a,tag:l,props:{__ignoreMap:o},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:"ct-2ddfc7"},children:[{type:b,value:"\u002F\u002F ~\u002Fserver\u002Fplugins\u002Fhighlight.ts"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:K},children:[{type:b,value:"export"}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:i}]},{type:a,tag:c,props:{class:K},children:[{type:b,value:"default"}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:i}]},{type:a,tag:c,props:{class:"ct-de9555"},children:[{type:b,value:"defineNitroPlugin"}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"((nitroApp) "}]},{type:a,tag:c,props:{class:"ct-a255e4"},children:[{type:b,value:"=\u003E"}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:i}]},{type:a,tag:c,props:{class:p},children:[{type:b,value:"{"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"nitroApp"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"hooks"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:q},children:[{type:b,value:"hook"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:"\"content:file:beforeParse\""}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"if"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" ("}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"_id"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:q},children:[{type:b,value:"endsWith"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:"\".md\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:")) {"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"="}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:q},children:[{type:b,value:"replace"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:M}]},{type:a,tag:c,props:{class:N},children:[{type:b,value:"\u002F==("}]},{type:a,tag:c,props:{class:O},children:[{type:b,value:"["}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"^"}]},{type:a,tag:c,props:{class:O},children:[{type:b,value:"=]"}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"+"}]},{type:a,tag:c,props:{class:N},children:[{type:b,value:")==\u002F"}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"gs"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:","}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:M}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:"`\u003Cspan class=\"highlight\"\u003E$1\u003C\u002Fspan\u003E`"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" );"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" }"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" });"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:p},children:[{type:b,value:"}"}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:")"}]},{type:a,tag:c,props:{class:p},children:[{type:b,value:";"}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-0a6144{color:#79C0FF}.ct-6a4f28{color:#A5D6FF}.ct-0f787a{color:#FF7B72}.ct-382167{color:#A5D6FF}.ct-1a3ebb{color:#D2A8FF}.ct-86abab{color:#C9D1D9}.ct-7ad72d{color:#C9D1D9}.ct-4e7048{color:#C9D1D9}.ct-a255e4{color:#FF7B72}.ct-de9555{color:#D2A8FF}.ct-56b7c0{color:#FFA657}.ct-69d133{color:#FF7B72}.ct-2ddfc7{color:#8B949E}.light .ct-2ddfc7{color:#93A1A1}.light .ct-69d133{color:#859900}.light .ct-56b7c0{color:#657B83}.light .ct-de9555{color:#268BD2}.light .ct-a255e4{color:#073642}.light .ct-4e7048{color:#657B83}.light .ct-7ad72d{color:#657B83}.light .ct-86abab{color:#268BD2}.light .ct-1a3ebb{color:#268BD2}.light .ct-382167{color:#2AA198}.light .ct-0f787a{color:#859900}.light .ct-6a4f28{color:#D30102}.light .ct-0a6144{color:#CB4B16}"}]}],toc:{title:o,searchDepth:P,depth:P,links:[]}},_type:"markdown",_id:"content:Frontend:Vue:Make Nuxt handle Obsidian highlights.md",_source:"content",_file:"Frontend\u002FVue\u002FMake Nuxt handle Obsidian highlights.md",_extension:"md"}},prerenderedAt:1711020227304}}("element","text","span","ct-7ad72d","line","ct-86abab",".","ct-56b7c0"," ","ct-0f787a","code-inline","code",false,"\u002F\u002F ~\u002Fserver\u002Fplugins\u002Fhighlight.ts\nexport default defineNitroPlugin((nitroApp) =\u003E {\n nitroApp.hooks.hook(\"content:file:beforeParse\", (file) =\u003E {\n if (file._id.endsWith(\".md\")) {\n file.body = file.body.replace(\n \u002F==([^=]+)==\u002Fgs,\n `\u003Cspan class=\"highlight\"\u003E$1\u003C\u002Fspan\u003E`\n );\n }\n });\n});\n","","ct-4e7048","ct-1a3ebb","(","ct-382167","file","Make Nuxt Handle Obsidian Highlights","\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights","root","p","By default ","a","https:\u002F\u002Fcontent.nuxtjs.org","nofollow","Nuxt Content Plugin"," not handling ","\u003Cspan class=\"highlight\"\u003Ehighlight\u003C\u002Fspan\u003E"," links. To fix that we will create ","Nitro"," plugin:","typescript","pre","ct-69d133","body"," ","ct-6a4f28","ct-0a6144",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:u,_path:v}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-JZY9J7Y59r":{_path:v,_dir:"vue",_draft:m,_partial:m,_locale:"en",_empty:m,title:u,description:"By default Nuxt Content Plugin not handling \u003Cspan class=\"highlight\"\u003Ehighlight\u003C\u002Fspan\u003E links. To fix that we will create Nitro plugin:",excerpt:{type:w,children:[{type:a,tag:x,props:{},children:[{type:b,value:y},{type:a,tag:z,props:{href:A,rel:[B]},children:[{type:b,value:C}]},{type:b,value:D},{type:a,tag:k,props:{},children:[{type:b,value:E}]},{type:b,value:F},{type:a,tag:k,props:{},children:[{type:b,value:G}]},{type:b,value:H}]},{type:a,tag:l,props:{code:n,language:I},children:[{type:a,tag:J,props:{},children:[{type:a,tag:l,props:{__ignoreMap:o},children:[{type:b,value:n}]}]}]}]},body:{type:w,children:[{type:a,tag:x,props:{},children:[{type:b,value:y},{type:a,tag:z,props:{href:A,rel:[B]},children:[{type:b,value:C}]},{type:b,value:D},{type:a,tag:k,props:{},children:[{type:b,value:E}]},{type:b,value:F},{type:a,tag:k,props:{},children:[{type:b,value:G}]},{type:b,value:H}]},{type:a,tag:l,props:{code:n,language:I},children:[{type:a,tag:J,props:{},children:[{type:a,tag:l,props:{__ignoreMap:o},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:"ct-04ca08"},children:[{type:b,value:"\u002F\u002F ~\u002Fserver\u002Fplugins\u002Fhighlight.ts"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:K},children:[{type:b,value:"export"}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:i}]},{type:a,tag:c,props:{class:K},children:[{type:b,value:"default"}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:i}]},{type:a,tag:c,props:{class:"ct-3ce9f3"},children:[{type:b,value:"defineNitroPlugin"}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:"((nitroApp) "}]},{type:a,tag:c,props:{class:"ct-441e0e"},children:[{type:b,value:"=\u003E"}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:i}]},{type:a,tag:c,props:{class:p},children:[{type:b,value:"{"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"nitroApp"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"hooks"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:q},children:[{type:b,value:"hook"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:"\"content:file:beforeParse\""}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"if"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" ("}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"_id"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:q},children:[{type:b,value:"endsWith"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:"\".md\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:")) {"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"="}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:i}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:q},children:[{type:b,value:"replace"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:M}]},{type:a,tag:c,props:{class:N},children:[{type:b,value:"\u002F==("}]},{type:a,tag:c,props:{class:O},children:[{type:b,value:"["}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"^"}]},{type:a,tag:c,props:{class:O},children:[{type:b,value:"=]"}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"+"}]},{type:a,tag:c,props:{class:N},children:[{type:b,value:")==\u002F"}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"gs"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:","}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:M}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:"`\u003Cspan class=\"highlight\"\u003E$1\u003C\u002Fspan\u003E`"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" );"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" }"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" });"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:p},children:[{type:b,value:"}"}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:")"}]},{type:a,tag:c,props:{class:p},children:[{type:b,value:";"}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-58c87b{color:#79C0FF}.ct-6dc7d7{color:#A5D6FF}.ct-c10891{color:#FF7B72}.ct-206e54{color:#A5D6FF}.ct-2a60cf{color:#D2A8FF}.ct-0942f1{color:#C9D1D9}.ct-e30717{color:#C9D1D9}.ct-06a11a{color:#C9D1D9}.ct-441e0e{color:#FF7B72}.ct-3ce9f3{color:#D2A8FF}.ct-0a5bed{color:#FFA657}.ct-bbd172{color:#FF7B72}.ct-04ca08{color:#8B949E}.light .ct-04ca08{color:#93A1A1}.light .ct-bbd172{color:#859900}.light .ct-0a5bed{color:#657B83}.light .ct-3ce9f3{color:#268BD2}.light .ct-441e0e{color:#073642}.light .ct-06a11a{color:#657B83}.light .ct-e30717{color:#657B83}.light .ct-0942f1{color:#268BD2}.light .ct-2a60cf{color:#268BD2}.light .ct-206e54{color:#2AA198}.light .ct-c10891{color:#859900}.light .ct-6dc7d7{color:#D30102}.light .ct-58c87b{color:#CB4B16}"}]}],toc:{title:o,searchDepth:P,depth:P,links:[]}},_type:"markdown",_id:"content:Frontend:Vue:Make Nuxt handle Obsidian highlights.md",_source:"content",_file:"Frontend\u002FVue\u002FMake Nuxt handle Obsidian highlights.md",_extension:"md"}},prerenderedAt:1711020861390}}("element","text","span","ct-e30717","line","ct-0942f1",".","ct-0a5bed"," ","ct-c10891","code-inline","code",false,"\u002F\u002F ~\u002Fserver\u002Fplugins\u002Fhighlight.ts\nexport default defineNitroPlugin((nitroApp) =\u003E {\n nitroApp.hooks.hook(\"content:file:beforeParse\", (file) =\u003E {\n if (file._id.endsWith(\".md\")) {\n file.body = file.body.replace(\n \u002F==([^=]+)==\u002Fgs,\n `\u003Cspan class=\"highlight\"\u003E$1\u003C\u002Fspan\u003E`\n );\n }\n });\n});\n","","ct-06a11a","ct-2a60cf","(","ct-206e54","file","Make Nuxt Handle Obsidian Highlights","\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights","root","p","By default ","a","https:\u002F\u002Fcontent.nuxtjs.org","nofollow","Nuxt Content Plugin"," not handling ","\u003Cspan class=\"highlight\"\u003Ehighlight\u003C\u002Fspan\u003E"," links. To fix that we will create ","Nitro"," plugin:","typescript","pre","ct-bbd172","body"," ","ct-6dc7d7","ct-58c87b",2)) \ No newline at end of file diff --git a/docs/frontend/vue/make-nuxt-handle-obsidian-highlights/index.html b/docs/frontend/vue/make-nuxt-handle-obsidian-highlights/index.html index e0cb152..650ff62 100644 --- a/docs/frontend/vue/make-nuxt-handle-obsidian-highlights/index.html +++ b/docs/frontend/vue/make-nuxt-handle-obsidian-highlights/index.html @@ -1,6 +1,6 @@ -Make Nuxt Handle Obsidian Highlights • Obsidian Garden -

Make Nuxt Handle Obsidian Highlights

By default Nuxt Content Plugin not handling <span class="highlight">highlight</span> links. To fix that we will create Nitro plugin:

// ~/server/plugins/highlight.tsexport default defineNitroPlugin((nitroApp) => {  nitroApp.hooks.hook("content:file:beforeParse"    if (file._id.endsWith(".md")) {      file.body = file.body.replace(        /==([^=]+)==/gs,        `<span class="highlight">$1</span>`      );    }  });});
btw, have a nice day
(2018 - 2024) muerwre
+

Make Nuxt Handle Obsidian Highlights

By default Nuxt Content Plugin not handling <span class="highlight">highlight</span> links. To fix that we will create Nitro plugin:

// ~/server/plugins/highlight.tsexport default defineNitroPlugin((nitroApp) => {  nitroApp.hooks.hook("content:file:beforeParse"    if (file._id.endsWith(".md")) {      file.body = file.body.replace(        /==([^=]+)==/gs,        `<span class="highlight">$1</span>`      );    }  });});
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/frontend/webgl/basics-of-webgl-(drawing-a-cube)/_payload.js b/docs/frontend/webgl/basics-of-webgl-(drawing-a-cube)/_payload.js index 9be1800..7a97bca 100644 --- a/docs/frontend/webgl/basics-of-webgl-(drawing-a-cube)/_payload.js +++ b/docs/frontend/webgl/basics-of-webgl-(drawing-a-cube)/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC,aD,aE,aF,aG,aH,aI,aJ,aK,aL,aM,aN,aO,aP,aQ,aR,aS,aT,aU,aV,aW,aX,aY,aZ,a_,a$,ba,bb,bc,bd,be,bf,bg,bh,bi,bj,bk,bl,bm,bn,bo,bp,bq,br,bs,bt,bu,bv,bw,bx,by,bz,bA,bB,bC,bD,bE,bF,bG,bH,bI,bJ,bK,bL,bM,bN,bO,bP,bQ,bR,bS,bT,bU,bV,bW,bX,bY,bZ,b_,b$,ca,cb,cc,cd,ce,cf,cg,ch,ci,cj,ck,cl,cm,cn,co,cp,cq,cr,cs,ct,cu,cv,cw,cx,cy,cz,cA,cB,cC,cD,cE,cF,cG,cH,cI,cJ,cK,cL,cM,cN,cO){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:bs,_path:bt},{title:K,_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:F,_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-8rrGOHb5uL":{_path:bt,_dir:"webgl",_draft:aH,_partial:aH,_locale:"en",_empty:aH,title:bs,description:I,excerpt:{type:bu,children:[{type:a,tag:y,props:{id:aI},children:[{type:c,value:aJ}]},{type:a,tag:bv,props:{},children:[{type:a,tag:ai,props:{},children:[{type:a,tag:u,props:{href:aj,rel:[P]},children:[{type:c,value:aj}]}]},{type:a,tag:ai,props:{},children:[{type:c,value:bw},{type:a,tag:u,props:{href:bx,rel:[P]},children:[{type:c,value:by}]},{type:c,value:g},{type:a,tag:u,props:{href:bz,rel:[P]},children:[{type:c,value:bA}]},{type:c,value:g},{type:a,tag:u,props:{href:bB,rel:[P]},children:[{type:c,value:bC}]}]}]},{type:a,tag:y,props:{id:aK},children:[{type:c,value:aL}]},{type:a,tag:w,props:{},children:[{type:a,tag:D,props:{},children:[{type:c,value:ak}]},{type:c,value:bD},{type:a,tag:E,props:{},children:[{type:c,value:bE}]},{type:c,value:bF},{type:a,tag:D,props:{},children:[{type:c,value:al}]},{type:c,value:bG},{type:a,tag:D,props:{},children:[{type:c,value:T}]},{type:c,value:k}]},{type:a,tag:y,props:{id:aM},children:[{type:c,value:aN}]},{type:a,tag:w,props:{},children:[{type:c,value:bH}]},{type:a,tag:w,props:{},children:[{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]},{type:c,value:bI},{type:a,tag:D,props:{},children:[{type:c,value:bJ}]},{type:c,value:bK},{type:a,tag:D,props:{},children:[{type:c,value:T}]},{type:c,value:bL}]},{type:a,tag:w,props:{},children:[{type:a,tag:u,props:{href:Q},children:[{type:c,value:K}]},{type:c,value:bM}]},{type:a,tag:w,props:{},children:[{type:c,value:bN},{type:a,tag:E,props:{},children:[{type:c,value:am}]},{type:c,value:g},{type:a,tag:E,props:{},children:[{type:c,value:W}]},{type:c,value:X},{type:a,tag:E,props:{},children:[{type:c,value:bO}]},{type:c,value:bP},{type:a,tag:u,props:{href:Q},children:[{type:c,value:K}]},{type:c,value:bQ},{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]},{type:c,value:bR},{type:a,tag:E,props:{},children:[{type:c,value:W}]},{type:c,value:an}]},{type:a,tag:w,props:{},children:[{type:a,tag:bS,props:{alt:I,src:bT},children:[]}]},{type:a,tag:y,props:{id:aO},children:[{type:c,value:aP}]},{type:a,tag:w,props:{},children:[{type:c,value:bU},{type:a,tag:D,props:{},children:[{type:c,value:ak}]},{type:c,value:g},{type:a,tag:D,props:{},children:[{type:c,value:bV}]},{type:c,value:bW},{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]},{type:c,value:X},{type:a,tag:u,props:{href:Q},children:[{type:c,value:K}]},{type:c,value:k}]},{type:a,tag:y,props:{id:aQ},children:[{type:c,value:aR}]},{type:a,tag:w,props:{},children:[{type:c,value:bX},{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]},{type:c,value:bY},{type:a,tag:u,props:{href:Q},children:[{type:c,value:K}]},{type:c,value:bZ},{type:a,tag:E,props:{},children:[{type:c,value:am}]},{type:c,value:X},{type:a,tag:E,props:{},children:[{type:c,value:W}]},{type:c,value:an}]},{type:a,tag:w,props:{},children:[{type:c,value:b_},{type:a,tag:u,props:{href:b$,rel:[P]},children:[{type:c,value:ca}]},{type:c,value:cb},{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]},{type:c,value:k}]},{type:a,tag:y,props:{id:aS},children:[{type:c,value:aT}]},{type:a,tag:A,props:{code:aU,language:ao},children:[{type:a,tag:R,props:{},children:[{type:a,tag:A,props:{__ignoreMap:I},children:[{type:c,value:aU}]}]}]},{type:a,tag:y,props:{id:aV},children:[{type:c,value:aW}]},{type:a,tag:A,props:{code:aX,language:ao},children:[{type:a,tag:R,props:{},children:[{type:a,tag:A,props:{__ignoreMap:I},children:[{type:c,value:aX}]}]}]},{type:a,tag:y,props:{id:aY},children:[{type:c,value:aZ}]},{type:a,tag:w,props:{},children:[{type:c,value:ap},{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]}]},{type:a,tag:A,props:{code:a_,language:aq},children:[{type:a,tag:R,props:{},children:[{type:a,tag:A,props:{__ignoreMap:I},children:[{type:c,value:a_}]}]}]},{type:a,tag:y,props:{id:a$},children:[{type:c,value:ba}]},{type:a,tag:w,props:{},children:[{type:c,value:ap},{type:a,tag:u,props:{href:Q},children:[{type:c,value:K}]},{type:c,value:k}]},{type:a,tag:A,props:{code:bb,language:aq},children:[{type:a,tag:R,props:{},children:[{type:a,tag:A,props:{__ignoreMap:I},children:[{type:c,value:bb}]}]}]}]},body:{type:bu,children:[{type:a,tag:y,props:{id:aI},children:[{type:c,value:aJ}]},{type:a,tag:bv,props:{},children:[{type:a,tag:ai,props:{},children:[{type:a,tag:u,props:{href:aj,rel:[P]},children:[{type:c,value:aj}]}]},{type:a,tag:ai,props:{},children:[{type:c,value:bw},{type:a,tag:u,props:{href:bx,rel:[P]},children:[{type:c,value:by}]},{type:c,value:g},{type:a,tag:u,props:{href:bz,rel:[P]},children:[{type:c,value:bA}]},{type:c,value:g},{type:a,tag:u,props:{href:bB,rel:[P]},children:[{type:c,value:bC}]}]}]},{type:a,tag:y,props:{id:aK},children:[{type:c,value:aL}]},{type:a,tag:w,props:{},children:[{type:a,tag:D,props:{},children:[{type:c,value:ak}]},{type:c,value:bD},{type:a,tag:E,props:{},children:[{type:c,value:bE}]},{type:c,value:bF},{type:a,tag:D,props:{},children:[{type:c,value:al}]},{type:c,value:bG},{type:a,tag:D,props:{},children:[{type:c,value:T}]},{type:c,value:k}]},{type:a,tag:y,props:{id:aM},children:[{type:c,value:aN}]},{type:a,tag:w,props:{},children:[{type:c,value:bH}]},{type:a,tag:w,props:{},children:[{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]},{type:c,value:bI},{type:a,tag:D,props:{},children:[{type:c,value:bJ}]},{type:c,value:bK},{type:a,tag:D,props:{},children:[{type:c,value:T}]},{type:c,value:bL}]},{type:a,tag:w,props:{},children:[{type:a,tag:u,props:{href:Q},children:[{type:c,value:K}]},{type:c,value:bM}]},{type:a,tag:w,props:{},children:[{type:c,value:bN},{type:a,tag:E,props:{},children:[{type:c,value:am}]},{type:c,value:g},{type:a,tag:E,props:{},children:[{type:c,value:W}]},{type:c,value:X},{type:a,tag:E,props:{},children:[{type:c,value:bO}]},{type:c,value:bP},{type:a,tag:u,props:{href:Q},children:[{type:c,value:K}]},{type:c,value:bQ},{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]},{type:c,value:bR},{type:a,tag:E,props:{},children:[{type:c,value:W}]},{type:c,value:an}]},{type:a,tag:w,props:{},children:[{type:a,tag:bS,props:{alt:I,src:bT},children:[]}]},{type:a,tag:y,props:{id:aO},children:[{type:c,value:aP}]},{type:a,tag:w,props:{},children:[{type:c,value:bU},{type:a,tag:D,props:{},children:[{type:c,value:ak}]},{type:c,value:g},{type:a,tag:D,props:{},children:[{type:c,value:bV}]},{type:c,value:bW},{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]},{type:c,value:X},{type:a,tag:u,props:{href:Q},children:[{type:c,value:K}]},{type:c,value:k}]},{type:a,tag:y,props:{id:aQ},children:[{type:c,value:aR}]},{type:a,tag:w,props:{},children:[{type:c,value:bX},{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]},{type:c,value:bY},{type:a,tag:u,props:{href:Q},children:[{type:c,value:K}]},{type:c,value:bZ},{type:a,tag:E,props:{},children:[{type:c,value:am}]},{type:c,value:X},{type:a,tag:E,props:{},children:[{type:c,value:W}]},{type:c,value:an}]},{type:a,tag:w,props:{},children:[{type:c,value:b_},{type:a,tag:u,props:{href:b$,rel:[P]},children:[{type:c,value:ca}]},{type:c,value:cb},{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]},{type:c,value:k}]},{type:a,tag:y,props:{id:aS},children:[{type:c,value:aT}]},{type:a,tag:A,props:{code:aU,language:ao},children:[{type:a,tag:R,props:{},children:[{type:a,tag:A,props:{__ignoreMap:I},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F render-a-cube.ts"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:bc}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" { "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" } "}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:bd}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"\".\u002Fcreate-shader\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:bc}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:cc}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:bd}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"\".\u002Fvertex.glsl?raw\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:bc}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:cd}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:bd}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"\".\u002Ffragment.glsl?raw\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:ce}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"document"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"getElementyId"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"'view'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:cf}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ce}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"getRenderingContext"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"'webgl'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F should be put inside requestAnimationFrame"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:cg}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:cf}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:")(); "}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:v},children:[{type:c,value:"function"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cg}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:z},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:Y},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:Z},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:ch},children:[{type:c,value:ci}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:z},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:Y},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:Z},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:as},children:[{type:c,value:be}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:M}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:z},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:Y},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:Z},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:as},children:[{type:c,value:be}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:au}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F Initializing viewport"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cj}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:ck}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cl}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:cm}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"createProgram"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bf}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:av}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:au}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:ae},children:[{type:c,value:bg}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"\"Can't init programm\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ax}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F Setting up VERTEX and FRAGMENT shaders"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:cn}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:cc}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"VERTEX_SHADER"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:co}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:cn}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:cp}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:cd}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"FRAGMENT_SHADER"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:co}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:cp}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"linkProgram"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:av}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"getProgramParameter"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"LINK_STATUS"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:cq}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:ae},children:[{type:c,value:bg}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"\"Could not initialise shaders\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ax}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F Cube's vertices Array\u003C[x,y,z]\u003E, 8 items"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:al}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:cr}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F 0"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bh}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F 1"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bi}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F 2"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bh}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F 3"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bh}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F 4"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bi}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F 5"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:", "}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F 6"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bi}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F 7"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cs}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F indices, that form triangles, that form cube sides"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:cr}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F side 0 (first triangle)"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ay}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F side 0 (second triangle)"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F side 1 (first triangle)"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ay}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F side 1 (second triangle)"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F ..."}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ay}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cs}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F createe a vertex buffer and bind vertices to it"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:bj}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:ct}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bf}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bj}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cu}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:ae},children:[{type:c,value:"Float32Array"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:al}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aC}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:cv}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:bk},children:[{type:c,value:cw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F create a vertex buffer and bind indices to it"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:bl}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:ct}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bf}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bl}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cu}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:ae},children:[{type:c,value:"Uint16Array"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"),"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:cv}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bm}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:bk},children:[{type:c,value:cw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F initial drawing"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:ck}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:bn}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:bn}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:bn}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"enable"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"DEPTH_TEST"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cl}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:cm}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"|"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"DEPTH_BUFFER_BIT"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cj}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F bind squareVertexBuffer as vertex positions buffer"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bj}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F send every 3 bytes from squareVertexBuffer as {x,y,z} for each verticle"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"vertexAttribPointer"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cx}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:cy}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aC}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ay}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F 3 bytes-long"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"FLOAT"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:bk},children:[{type:c,value:"false"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F don't normalize (int to float)"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bm}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F send vertice buffer as `aVertexPosition` attribute inside vertex shader"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"enableVertexAttribArray"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cx}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:cy}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:")"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bm}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:cz}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:cz}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aF}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"0.01"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F that's the main rendering callback"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:cA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" () "}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:cB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:cC}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"useProgram"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:bo}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:bp}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"0.25"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F used for scaling inside Vertex Shader"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"\"slide\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aC}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bo}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F GL Screen is square, so we need to fix it's aspect ration"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"\"aspect\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aC}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bl}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cF}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"drawElements"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"TRIANGLES"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:T}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"UNSIGNED_SHORT"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cF}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u003E"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"||"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:au}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aF}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aF}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"+="}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aF}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cG}]}]}]}]}]},{type:a,tag:y,props:{id:aV},children:[{type:c,value:aW}]},{type:a,tag:A,props:{code:aX,language:ao},children:[{type:a,tag:R,props:{},children:[{type:a,tag:A,props:{__ignoreMap:I},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F create-shader.ts"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:"export"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:z},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:Y},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:Z},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:ch},children:[{type:c,value:ci}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:M}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:z},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:Y},children:[{type:c,value:cH}]},{type:a,tag:b,props:{class:Z},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:as},children:[{type:c,value:"string"}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:M}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:z},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:Y},children:[{type:c,value:cI}]},{type:a,tag:b,props:{class:Z},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:as},children:[{type:c,value:be}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:"ct-c24349"},children:[{type:c,value:"\u002F\u002F gl.VERTEX_SHADER or gl.FRAGMENT_SHADER"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:") "}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:cB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:cC}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:cI}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:av}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:au}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:ae},children:[{type:c,value:bg}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"`Can't init shader`"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ax}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"shaderSource"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:cH}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"compileShader"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:av}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"getShaderParameter"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"COMPILE_STATUS"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:cq}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:cJ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"getShaderInfoLog"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"`Could not compile WebGL program. "}]},{type:a,tag:b,props:{class:"ct-be2223"},children:[{type:c,value:"\\n\\n"}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"${"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:cJ}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"}`"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ax}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:cA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cG}]}]}]}]}]},{type:a,tag:y,props:{id:aY},children:[{type:c,value:aZ}]},{type:a,tag:w,props:{},children:[{type:c,value:ap},{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]}]},{type:a,tag:A,props:{code:a_,language:aq},children:[{type:a,tag:R,props:{},children:[{type:a,tag:A,props:{__ignoreMap:I},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F current vertice position {x,y,z,w}"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"attribute vec4 aVertexPosition;"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F final vertice position with all transformations applied,"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F that will be passed to Fragment Shader"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cK}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F Parameters passed from Javascript loop"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cL}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:bq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" slide;"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cL}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:bq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" aspect;"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:v},children:[{type:c,value:br}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cM}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"(){"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F float array of 4 elements, same as [slide,slide,slide,1]"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" vec4 scale"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:aG}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cN}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"(slide),"}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F float array of 4 elements, same as [aspect,1,1,1]"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" vec4 aspectRatioFix"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:aG}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"(aspect,"}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cN}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"));"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F vertice position, multiplied with matrices of scale and aspect ratio"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" gl_Position"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"aVertexPosition"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:bp}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bo}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:bp}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"aspectRatioFix,"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F vertice offset, that will be passed to fragment shader"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" v_positionWithOffset"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"gl_Position"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"+"}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:aG}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cO}]}]}]}]}]},{type:a,tag:y,props:{id:a$},children:[{type:c,value:ba}]},{type:a,tag:w,props:{},children:[{type:c,value:ap},{type:a,tag:u,props:{href:Q},children:[{type:c,value:K}]},{type:c,value:k}]},{type:a,tag:A,props:{code:bb,language:aq},children:[{type:a,tag:R,props:{},children:[{type:a,tag:A,props:{__ignoreMap:I},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"precision highp "}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:bq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F parameter from Vertex Shader"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cK}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:v},children:[{type:c,value:br}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cM}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:br}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"){"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F color, attached to current verticle {r,g,b,alpha}"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F same a["}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F v_positionWithOffset.x,"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F v_positionWithOffset.y, "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F v_positionWithOffset.z, "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F 1"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F ]"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" gl_FragColor"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:aG}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"v_positionWithOffset"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"xyz"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cO}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-be2223{color:#79C0FF}.ct-c24349{color:#8B949E}.ct-8827e1{color:#79C0FF}.ct-a0f123{color:#79C0FF}.ct-d569ab{color:#79C0FF}.ct-e0a644{color:#79C0FF}.ct-e6f7d7{color:#FFA657}.ct-55a926{color:#FF7B72}.ct-3178b0{color:#FFA657}.ct-56017d{color:#C9D1D9}.ct-6a5e5c{color:#D2A8FF}.ct-e050e1{color:#79C0FF}.ct-d20acd{color:#FF7B72}.ct-c8ad10{color:#A5D6FF}.ct-cc7b48{color:#C9D1D9}.ct-5f48b1{color:#C9D1D9}.ct-bc3ef1{color:#FF7B72}.ct-6f4d62{color:#8B949E}.light .ct-6f4d62{color:#93A1A1}.light .ct-bc3ef1{color:#859900}.light .ct-5f48b1{color:#657B83}.light .ct-cc7b48{color:#268BD2}.light .ct-c8ad10{color:#2AA198}.light .ct-d20acd{color:#073642}.light .ct-e050e1{color:#268BD2}.light .ct-6a5e5c{color:#268BD2}.light .ct-56017d{color:#657B83}.light .ct-3178b0{color:#657B83}.light .ct-55a926{color:#859900}.light .ct-e6f7d7{color:#268BD2}.light .ct-e0a644{color:#859900}.light .ct-d569ab{color:#D33682}.light .ct-a0f123{color:#859900}.light .ct-8827e1{color:#B58900}.light .ct-c24349{color:#93A1A1}.light .ct-be2223{color:#CB4B16}"}]}],toc:{title:I,searchDepth:O,depth:O,links:[{id:aI,depth:O,text:aJ},{id:aK,depth:O,text:aL},{id:aM,depth:O,text:aN},{id:aO,depth:O,text:aP},{id:aQ,depth:O,text:aR},{id:aS,depth:O,text:aT},{id:aV,depth:O,text:aW},{id:aY,depth:O,text:aZ},{id:a$,depth:O,text:ba}]}},_type:"markdown",_id:"content:Frontend:WebGL:Basics of WebGL (Drawing a Cube).md",_source:"content",_file:"Frontend\u002FWebGL\u002FBasics of WebGL (Drawing a Cube).md",_extension:"md"}},prerenderedAt:1711020227327}}("element","span","text","ct-5f48b1","line","ct-cc7b48",", "," ","ct-d569ab","ct-bc3ef1","."," ","gl","ct-6a5e5c","(","ct-6f4d62"," ","1","ct-e050e1",");","a","ct-d20acd","p","=","h2","ct-56017d","code","0","ct-c8ad10","strong","code-inline","Vertex Shaders","const","-","","Vertex%20Shaders","Fragment Shaders",";",",","prg",2,"nofollow","Fragment%20Shaders","pre"," ","indices"," (","shader","varyings"," and ","ct-3178b0","ct-55a926",":","bindBuffer"," ","createShader","if","new","ct-a0f123","2","7","6","li","https:\u002F\u002Fopen.gl\u002F","Vertices","vertices","uniforms",").","typescript","Read more at ","c","width","ct-e0a644","height",") {","!","throw"," }","3","4","5","ARRAY_BUFFER","), ","ELEMENT_ARRAY_BUFFER","i","speed","vec4",false,"helpful-documentation","Helpful documentation","vertices-and-indices","Vertices and Indices","shaders","Shaders","program","Program","applying-transformations","Applying transformations","source-code-with-explanations","Source code with explanations","\u002F\u002F render-a-cube.ts\nimport { createShader } from \".\u002Fcreate-shader\";\nimport vxShader from \".\u002Fvertex.glsl?raw\";\nimport fgShader from \".\u002Ffragment.glsl?raw\";\n\nconst canvas = document.getElementyId('view');\nconst ctx = canvas.getRenderingContext('webgl');\n\n\u002F\u002F should be put inside requestAnimationFrame\ndrawCube(ctx)(); \n\nfunction drawCube (\n gl: WebGL2RenderingContext, \n width: number,\n height: number\n) {\n \u002F\u002F Initializing viewport\n gl.viewport(0, 0, width, height);\n gl.clearColor(0, 0, 0, 0);\n gl.clear(gl.COLOR_BUFFER_BIT);\n\n const prg = gl.createProgram();\n if (!prg) {\n throw new Error(\"Can't init programm\");\n }\n\n \u002F\u002F Setting up VERTEX and FRAGMENT shaders\n const vx = createShader(gl, vxShader, gl.VERTEX_SHADER);\n gl.attachShader(prg, vx);\n const fx = createShader(gl, fgShader, gl.FRAGMENT_SHADER);\n gl.attachShader(prg, fx);\n gl.linkProgram(prg);\n if (!gl.getProgramParameter(prg, gl.LINK_STATUS)) {\n throw new Error(\"Could not initialise shaders\");\n }\n\n \u002F\u002F Cube's vertices Array\u003C[x,y,z]\u003E, 8 items\n const vertices = [\n -1, -1, -1, \u002F\u002F 0\n 1, -1, -1, \u002F\u002F 1\n 1, 1, -1, \u002F\u002F 2\n -1, 1, -1, \u002F\u002F 3\n -1, -1, 1, \u002F\u002F 4\n 1, -1, 1, \u002F\u002F 5\n 1, 1, 1, \u002F\u002F 6\n -1, 1, 1, \u002F\u002F 7\n ];\n\n \u002F\u002F indices, that form triangles, that form cube sides\n const indices = [\n 2, 1, 0, \u002F\u002F side 0 (first triangle)\n 0, 3, 2, \u002F\u002F side 0 (second triangle)\n 0, 4, 7, \u002F\u002F side 1 (first triangle)\n 7, 3, 0, \u002F\u002F side 1 (second triangle)\n 0, 1, 5, \u002F\u002F ...\n 5, 4, 0, \n 1, 2, 6, \n 6, 5, 1, \n 2, 3, 7, \n 7, 6, 2, \n 4, 5, 6, \n 6, 7, 4,\n ];\n\n \u002F\u002F createe a vertex buffer and bind vertices to it\n const squareVertexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);\n gl.bindBuffer(gl.ARRAY_BUFFER, null);\n\n \u002F\u002F create a vertex buffer and bind indices to it\n const squareIndexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, squareIndexBuffer);\n gl.bufferData(\n gl.ELEMENT_ARRAY_BUFFER,\n new Uint16Array(indices),\n gl.STATIC_DRAW\n );\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, null);\n\n \u002F\u002F initial drawing\n gl.clearColor(0.0, 0.0, 0.0, 0.0);\n gl.enable(gl.DEPTH_TEST);\n gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);\n gl.viewport(0, 0, width, height);\n\n \u002F\u002F bind squareVertexBuffer as vertex positions buffer\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n \n \u002F\u002F send every 3 bytes from squareVertexBuffer as {x,y,z} for each verticle\n gl.vertexAttribPointer(\n gl.getAttribLocation(prg, \"aVertexPosition\"), \n 3, \u002F\u002F 3 bytes-long\n gl.FLOAT,\n false, \u002F\u002F don't normalize (int to float)\n 0, \n 0\n );\n \u002F\u002F send vertice buffer as `aVertexPosition` attribute inside vertex shader\n gl.enableVertexAttribArray(\n gl.getAttribLocation(prg, \"aVertexPosition\")\n );\n\n let i = 0;\n let speed = 0.01;\n\n \u002F\u002F that's the main rendering callback\n return () =\u003E {\n gl.useProgram(prg);\n\n const scale = i * 0.25 + 0.25;\n\n \u002F\u002F used for scaling inside Vertex Shader\n gl.uniform1f(gl.getUniformLocation(prg, \"slide\"), scale);\n \u002F\u002F GL Screen is square, so we need to fix it's aspect ration\n gl.uniform1f(gl.getUniformLocation(prg, \"aspect\"), height \u002F width);\n\n gl.bindBuffer(\n gl.ELEMENT_ARRAY_BUFFER, \n squareIndexBuffer\n );\n \n gl.drawElements(\n gl.TRIANGLES, \n indices.length, \n gl.UNSIGNED_SHORT, \n 0,\n );\n\n if (i \u003E 1 || i \u003C 0) {\n speed = -speed;\n }\n\n i += speed;\n };\n};\n","shader-compiler","Shader compiler","\u002F\u002F create-shader.ts\nexport const createShader = (\n gl: WebGL2RenderingContext,\n sourceCode: string,\n type: number, \u002F\u002F gl.VERTEX_SHADER or gl.FRAGMENT_SHADER\n) =\u003E {\n const shader = gl.createShader(type);\n if (!shader) {\n throw new Error(`Can't init shader`);\n }\n\n gl.shaderSource(shader, sourceCode);\n gl.compileShader(shader);\n\n if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {\n const info = gl.getShaderInfoLog(shader);\n throw `Could not compile WebGL program. \\n\\n${info}`;\n }\n\n return shader;\n};\n","vertex-shader-example","Vertex Shader Example","\u002F\u002F current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n\u002F\u002F final vertice position with all transformations applied,\n\u002F\u002F that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n\u002F\u002F Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n \u002F\u002F float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n \u002F\u002F float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n \u002F\u002F vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n \u002F\u002F vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n","fragment-shader-example","Fragment Shader Example","precision highp float;\n\n\u002F\u002F parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n\nvoid main(void){\n \u002F\u002F color, attached to current verticle {r,g,b,alpha}\n \u002F\u002F same a[\n \u002F\u002F v_positionWithOffset.x,\n \u002F\u002F v_positionWithOffset.y, \n \u002F\u002F v_positionWithOffset.z, \n \u002F\u002F 1\n \u002F\u002F ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}\n","import","from","number","();","Error",", ",", ","squareVertexBuffer","ct-8827e1","squareIndexBuffer"," );","0.0","scale","*","float","void","Basics Of WebGL (Drawing A Cube)","\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)","root","ul","This youtube series: ","https:\u002F\u002Fwww.youtube.com\u002Fwatch?v=kB0ZVUrI4Aw","Basics","https:\u002F\u002Fwww.youtube.com\u002Fwatch?v=3yLL9ADo-ko","Making a cube, applying transformations","https:\u002F\u002Fwww.youtube.com\u002Fwatch?v=hpnd11doMgc&t=52s","Texturing"," are points with specific coordinates ","{x,y,z}"," in a 3D-space. We can build any figure by connecting "," in triangles with ","Shaders are functions, written in C, which describe how to draw and color polygons to Graphic Card."," describe ","vertice"," positions, so Graphic Card can position them by connecting with "," and project to 2D canvas."," describe the way polygons should be colored by assigning colors to Vertices or by applying textures to polygons.","Shaders can have parameters passed from Javascript code (","attributes","). "," can also access data from "," (that ones called ","img","https:\u002F\u002Fopen.gl\u002Fmedia\u002Fimg\u002Fc2_pipeline.png","Program, as far as I understand, is a scene, that's described with ","Indices",", specific ","The best way to change positions inside "," or color in "," is to pass parameters (also called ","Read about that at ","https:\u002F\u002Fopen.gl\u002Ftransformations","open.gl"," and at ","vxShader","fgShader","canvas","ctx","drawCube","ct-e6f7d7","WebGL2RenderingContext","viewport","clearColor","clear","COLOR_BUFFER_BIT","vx","attachShader","fx",")) {"," ["," ];","createBuffer","bufferData","STATIC_DRAW","null","getAttribLocation","\"aVertexPosition\"","let","return","=\u003E"," {","uniform1f","getUniformLocation"," );","};","sourceCode","type","info","varying vec4 v_positionWithOffset;","uniform ","main","vec3","}")) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC,aD,aE,aF,aG,aH,aI,aJ,aK,aL,aM,aN,aO,aP,aQ,aR,aS,aT,aU,aV,aW,aX,aY,aZ,a_,a$,ba,bb,bc,bd,be,bf,bg,bh,bi,bj,bk,bl,bm,bn,bo,bp,bq,br,bs,bt,bu,bv,bw,bx,by,bz,bA,bB,bC,bD,bE,bF,bG,bH,bI,bJ,bK,bL,bM,bN,bO,bP,bQ,bR,bS,bT,bU,bV,bW,bX,bY,bZ,b_,b$,ca,cb,cc,cd,ce,cf,cg,ch,ci,cj,ck,cl,cm,cn,co,cp,cq,cr,cs,ct,cu,cv,cw,cx,cy,cz,cA,cB,cC,cD,cE,cF,cG,cH,cI,cJ,cK,cL,cM,cN,cO){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:bs,_path:bt},{title:K,_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:F,_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-8rrGOHb5uL":{_path:bt,_dir:"webgl",_draft:aH,_partial:aH,_locale:"en",_empty:aH,title:bs,description:I,excerpt:{type:bu,children:[{type:a,tag:y,props:{id:aI},children:[{type:c,value:aJ}]},{type:a,tag:bv,props:{},children:[{type:a,tag:ai,props:{},children:[{type:a,tag:u,props:{href:aj,rel:[P]},children:[{type:c,value:aj}]}]},{type:a,tag:ai,props:{},children:[{type:c,value:bw},{type:a,tag:u,props:{href:bx,rel:[P]},children:[{type:c,value:by}]},{type:c,value:g},{type:a,tag:u,props:{href:bz,rel:[P]},children:[{type:c,value:bA}]},{type:c,value:g},{type:a,tag:u,props:{href:bB,rel:[P]},children:[{type:c,value:bC}]}]}]},{type:a,tag:y,props:{id:aK},children:[{type:c,value:aL}]},{type:a,tag:w,props:{},children:[{type:a,tag:D,props:{},children:[{type:c,value:ak}]},{type:c,value:bD},{type:a,tag:E,props:{},children:[{type:c,value:bE}]},{type:c,value:bF},{type:a,tag:D,props:{},children:[{type:c,value:al}]},{type:c,value:bG},{type:a,tag:D,props:{},children:[{type:c,value:T}]},{type:c,value:k}]},{type:a,tag:y,props:{id:aM},children:[{type:c,value:aN}]},{type:a,tag:w,props:{},children:[{type:c,value:bH}]},{type:a,tag:w,props:{},children:[{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]},{type:c,value:bI},{type:a,tag:D,props:{},children:[{type:c,value:bJ}]},{type:c,value:bK},{type:a,tag:D,props:{},children:[{type:c,value:T}]},{type:c,value:bL}]},{type:a,tag:w,props:{},children:[{type:a,tag:u,props:{href:Q},children:[{type:c,value:K}]},{type:c,value:bM}]},{type:a,tag:w,props:{},children:[{type:c,value:bN},{type:a,tag:E,props:{},children:[{type:c,value:am}]},{type:c,value:g},{type:a,tag:E,props:{},children:[{type:c,value:W}]},{type:c,value:X},{type:a,tag:E,props:{},children:[{type:c,value:bO}]},{type:c,value:bP},{type:a,tag:u,props:{href:Q},children:[{type:c,value:K}]},{type:c,value:bQ},{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]},{type:c,value:bR},{type:a,tag:E,props:{},children:[{type:c,value:W}]},{type:c,value:an}]},{type:a,tag:w,props:{},children:[{type:a,tag:bS,props:{alt:I,src:bT},children:[]}]},{type:a,tag:y,props:{id:aO},children:[{type:c,value:aP}]},{type:a,tag:w,props:{},children:[{type:c,value:bU},{type:a,tag:D,props:{},children:[{type:c,value:ak}]},{type:c,value:g},{type:a,tag:D,props:{},children:[{type:c,value:bV}]},{type:c,value:bW},{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]},{type:c,value:X},{type:a,tag:u,props:{href:Q},children:[{type:c,value:K}]},{type:c,value:k}]},{type:a,tag:y,props:{id:aQ},children:[{type:c,value:aR}]},{type:a,tag:w,props:{},children:[{type:c,value:bX},{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]},{type:c,value:bY},{type:a,tag:u,props:{href:Q},children:[{type:c,value:K}]},{type:c,value:bZ},{type:a,tag:E,props:{},children:[{type:c,value:am}]},{type:c,value:X},{type:a,tag:E,props:{},children:[{type:c,value:W}]},{type:c,value:an}]},{type:a,tag:w,props:{},children:[{type:c,value:b_},{type:a,tag:u,props:{href:b$,rel:[P]},children:[{type:c,value:ca}]},{type:c,value:cb},{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]},{type:c,value:k}]},{type:a,tag:y,props:{id:aS},children:[{type:c,value:aT}]},{type:a,tag:A,props:{code:aU,language:ao},children:[{type:a,tag:R,props:{},children:[{type:a,tag:A,props:{__ignoreMap:I},children:[{type:c,value:aU}]}]}]},{type:a,tag:y,props:{id:aV},children:[{type:c,value:aW}]},{type:a,tag:A,props:{code:aX,language:ao},children:[{type:a,tag:R,props:{},children:[{type:a,tag:A,props:{__ignoreMap:I},children:[{type:c,value:aX}]}]}]},{type:a,tag:y,props:{id:aY},children:[{type:c,value:aZ}]},{type:a,tag:w,props:{},children:[{type:c,value:ap},{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]}]},{type:a,tag:A,props:{code:a_,language:aq},children:[{type:a,tag:R,props:{},children:[{type:a,tag:A,props:{__ignoreMap:I},children:[{type:c,value:a_}]}]}]},{type:a,tag:y,props:{id:a$},children:[{type:c,value:ba}]},{type:a,tag:w,props:{},children:[{type:c,value:ap},{type:a,tag:u,props:{href:Q},children:[{type:c,value:K}]},{type:c,value:k}]},{type:a,tag:A,props:{code:bb,language:aq},children:[{type:a,tag:R,props:{},children:[{type:a,tag:A,props:{__ignoreMap:I},children:[{type:c,value:bb}]}]}]}]},body:{type:bu,children:[{type:a,tag:y,props:{id:aI},children:[{type:c,value:aJ}]},{type:a,tag:bv,props:{},children:[{type:a,tag:ai,props:{},children:[{type:a,tag:u,props:{href:aj,rel:[P]},children:[{type:c,value:aj}]}]},{type:a,tag:ai,props:{},children:[{type:c,value:bw},{type:a,tag:u,props:{href:bx,rel:[P]},children:[{type:c,value:by}]},{type:c,value:g},{type:a,tag:u,props:{href:bz,rel:[P]},children:[{type:c,value:bA}]},{type:c,value:g},{type:a,tag:u,props:{href:bB,rel:[P]},children:[{type:c,value:bC}]}]}]},{type:a,tag:y,props:{id:aK},children:[{type:c,value:aL}]},{type:a,tag:w,props:{},children:[{type:a,tag:D,props:{},children:[{type:c,value:ak}]},{type:c,value:bD},{type:a,tag:E,props:{},children:[{type:c,value:bE}]},{type:c,value:bF},{type:a,tag:D,props:{},children:[{type:c,value:al}]},{type:c,value:bG},{type:a,tag:D,props:{},children:[{type:c,value:T}]},{type:c,value:k}]},{type:a,tag:y,props:{id:aM},children:[{type:c,value:aN}]},{type:a,tag:w,props:{},children:[{type:c,value:bH}]},{type:a,tag:w,props:{},children:[{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]},{type:c,value:bI},{type:a,tag:D,props:{},children:[{type:c,value:bJ}]},{type:c,value:bK},{type:a,tag:D,props:{},children:[{type:c,value:T}]},{type:c,value:bL}]},{type:a,tag:w,props:{},children:[{type:a,tag:u,props:{href:Q},children:[{type:c,value:K}]},{type:c,value:bM}]},{type:a,tag:w,props:{},children:[{type:c,value:bN},{type:a,tag:E,props:{},children:[{type:c,value:am}]},{type:c,value:g},{type:a,tag:E,props:{},children:[{type:c,value:W}]},{type:c,value:X},{type:a,tag:E,props:{},children:[{type:c,value:bO}]},{type:c,value:bP},{type:a,tag:u,props:{href:Q},children:[{type:c,value:K}]},{type:c,value:bQ},{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]},{type:c,value:bR},{type:a,tag:E,props:{},children:[{type:c,value:W}]},{type:c,value:an}]},{type:a,tag:w,props:{},children:[{type:a,tag:bS,props:{alt:I,src:bT},children:[]}]},{type:a,tag:y,props:{id:aO},children:[{type:c,value:aP}]},{type:a,tag:w,props:{},children:[{type:c,value:bU},{type:a,tag:D,props:{},children:[{type:c,value:ak}]},{type:c,value:g},{type:a,tag:D,props:{},children:[{type:c,value:bV}]},{type:c,value:bW},{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]},{type:c,value:X},{type:a,tag:u,props:{href:Q},children:[{type:c,value:K}]},{type:c,value:k}]},{type:a,tag:y,props:{id:aQ},children:[{type:c,value:aR}]},{type:a,tag:w,props:{},children:[{type:c,value:bX},{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]},{type:c,value:bY},{type:a,tag:u,props:{href:Q},children:[{type:c,value:K}]},{type:c,value:bZ},{type:a,tag:E,props:{},children:[{type:c,value:am}]},{type:c,value:X},{type:a,tag:E,props:{},children:[{type:c,value:W}]},{type:c,value:an}]},{type:a,tag:w,props:{},children:[{type:c,value:b_},{type:a,tag:u,props:{href:b$,rel:[P]},children:[{type:c,value:ca}]},{type:c,value:cb},{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]},{type:c,value:k}]},{type:a,tag:y,props:{id:aS},children:[{type:c,value:aT}]},{type:a,tag:A,props:{code:aU,language:ao},children:[{type:a,tag:R,props:{},children:[{type:a,tag:A,props:{__ignoreMap:I},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F render-a-cube.ts"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:bc}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" { "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" } "}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:bd}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"\".\u002Fcreate-shader\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:bc}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:cc}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:bd}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"\".\u002Fvertex.glsl?raw\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:bc}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:cd}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:bd}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"\".\u002Ffragment.glsl?raw\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:ce}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"document"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"getElementyId"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"'view'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:cf}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ce}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"getRenderingContext"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"'webgl'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F should be put inside requestAnimationFrame"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:cg}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:cf}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:")(); "}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:v},children:[{type:c,value:"function"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cg}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:z},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:Y},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:Z},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:ch},children:[{type:c,value:ci}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:z},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:Y},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:Z},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:as},children:[{type:c,value:be}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:M}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:z},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:Y},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:Z},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:as},children:[{type:c,value:be}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:au}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F Initializing viewport"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cj}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:ck}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cl}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:cm}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"createProgram"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bf}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:av}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:au}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:ae},children:[{type:c,value:bg}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"\"Can't init programm\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ax}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F Setting up VERTEX and FRAGMENT shaders"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:cn}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:cc}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"VERTEX_SHADER"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:co}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:cn}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:cp}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:cd}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"FRAGMENT_SHADER"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:co}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:cp}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"linkProgram"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:av}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"getProgramParameter"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"LINK_STATUS"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:cq}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:ae},children:[{type:c,value:bg}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"\"Could not initialise shaders\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ax}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F Cube's vertices Array\u003C[x,y,z]\u003E, 8 items"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:al}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:cr}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F 0"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bh}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F 1"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bi}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F 2"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bh}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F 3"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bh}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F 4"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bi}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F 5"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:", "}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F 6"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bi}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F 7"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cs}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F indices, that form triangles, that form cube sides"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:cr}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F side 0 (first triangle)"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ay}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F side 0 (second triangle)"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F side 1 (first triangle)"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ay}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F side 1 (second triangle)"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F ..."}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ay}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ag}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cs}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F createe a vertex buffer and bind vertices to it"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:bj}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:ct}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bf}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bj}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cu}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:ae},children:[{type:c,value:"Float32Array"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:al}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aC}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:cv}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:bk},children:[{type:c,value:cw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F create a vertex buffer and bind indices to it"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:bl}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:ct}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bf}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bl}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cu}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:ae},children:[{type:c,value:"Uint16Array"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"),"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:cv}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bm}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:bk},children:[{type:c,value:cw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F initial drawing"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:ck}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:bn}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:bn}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:bn}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"enable"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"DEPTH_TEST"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cl}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:cm}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"|"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"DEPTH_BUFFER_BIT"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cj}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F bind squareVertexBuffer as vertex positions buffer"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bj}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F send every 3 bytes from squareVertexBuffer as {x,y,z} for each verticle"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"vertexAttribPointer"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cx}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:cy}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aC}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ay}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F 3 bytes-long"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"FLOAT"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:bk},children:[{type:c,value:"false"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F don't normalize (int to float)"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bm}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F send vertice buffer as `aVertexPosition` attribute inside vertex shader"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"enableVertexAttribArray"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cx}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:cy}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:")"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bm}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:cz}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:cz}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aF}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"0.01"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F that's the main rendering callback"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:cA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" () "}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:cB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:cC}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"useProgram"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:bo}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:bp}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"0.25"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F used for scaling inside Vertex Shader"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"\"slide\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aC}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bo}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F GL Screen is square, so we need to fix it's aspect ration"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"\"aspect\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aC}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:bl}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cF}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"drawElements"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"TRIANGLES"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:T}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"UNSIGNED_SHORT"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cF}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u003E"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"||"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:au}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aF}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aF}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"+="}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aF}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cG}]}]}]}]}]},{type:a,tag:y,props:{id:aV},children:[{type:c,value:aW}]},{type:a,tag:A,props:{code:aX,language:ao},children:[{type:a,tag:R,props:{},children:[{type:a,tag:A,props:{__ignoreMap:I},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F create-shader.ts"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:"export"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:z},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:Y},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:Z},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:ch},children:[{type:c,value:ci}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:M}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:z},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:Y},children:[{type:c,value:cH}]},{type:a,tag:b,props:{class:Z},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:as},children:[{type:c,value:"string"}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:M}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:z},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:Y},children:[{type:c,value:cI}]},{type:a,tag:b,props:{class:Z},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:as},children:[{type:c,value:be}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:"ct-93980e"},children:[{type:c,value:"\u002F\u002F gl.VERTEX_SHADER or gl.FRAGMENT_SHADER"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:") "}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:cB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:cC}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:ab}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:cI}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:av}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:au}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:ae},children:[{type:c,value:bg}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"`Can't init shader`"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ax}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"shaderSource"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:cH}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"compileShader"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:av}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"getShaderParameter"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"COMPILE_STATUS"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:cq}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:cJ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"getShaderInfoLog"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"`Could not compile WebGL program. "}]},{type:a,tag:b,props:{class:"ct-5dbe56"},children:[{type:c,value:"\\n\\n"}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"${"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:cJ}]},{type:a,tag:b,props:{class:C},children:[{type:c,value:"}`"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ax}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:cA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cG}]}]}]}]}]},{type:a,tag:y,props:{id:aY},children:[{type:c,value:aZ}]},{type:a,tag:w,props:{},children:[{type:c,value:ap},{type:a,tag:u,props:{href:J},children:[{type:c,value:F}]}]},{type:a,tag:A,props:{code:a_,language:aq},children:[{type:a,tag:R,props:{},children:[{type:a,tag:A,props:{__ignoreMap:I},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F current vertice position {x,y,z,w}"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"attribute vec4 aVertexPosition;"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F final vertice position with all transformations applied,"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F that will be passed to Fragment Shader"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cK}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F Parameters passed from Javascript loop"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cL}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:bq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" slide;"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cL}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:bq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" aspect;"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:v},children:[{type:c,value:br}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cM}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"(){"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F float array of 4 elements, same as [slide,slide,slide,1]"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" vec4 scale"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:aG}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cN}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"(slide),"}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F float array of 4 elements, same as [aspect,1,1,1]"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" vec4 aspectRatioFix"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:aG}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"(aspect,"}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cN}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"));"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F vertice position, multiplied with matrices of scale and aspect ratio"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" gl_Position"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"aVertexPosition"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:bp}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bo}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:bp}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"aspectRatioFix,"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F vertice offset, that will be passed to fragment shader"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" v_positionWithOffset"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"gl_Position"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"+"}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:aG}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cO}]}]}]}]}]},{type:a,tag:y,props:{id:a$},children:[{type:c,value:ba}]},{type:a,tag:w,props:{},children:[{type:c,value:ap},{type:a,tag:u,props:{href:Q},children:[{type:c,value:K}]},{type:c,value:k}]},{type:a,tag:A,props:{code:bb,language:aq},children:[{type:a,tag:R,props:{},children:[{type:a,tag:A,props:{__ignoreMap:I},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"precision highp "}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:bq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F parameter from Vertex Shader"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cK}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:v},children:[{type:c,value:br}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:cM}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:br}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"){"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F color, attached to current verticle {r,g,b,alpha}"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F same a["}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F v_positionWithOffset.x,"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F v_positionWithOffset.y, "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F v_positionWithOffset.z, "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F 1"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F ]"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" gl_FragColor"}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:aG}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"v_positionWithOffset"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"xyz"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:r}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:cO}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-5dbe56{color:#79C0FF}.ct-93980e{color:#8B949E}.ct-f236f7{color:#79C0FF}.ct-7f060f{color:#79C0FF}.ct-3f41dc{color:#79C0FF}.ct-d183b6{color:#79C0FF}.ct-a32dc8{color:#FFA657}.ct-8977a7{color:#FF7B72}.ct-7cd29f{color:#FFA657}.ct-7f4c7e{color:#C9D1D9}.ct-a1f1df{color:#D2A8FF}.ct-c51f3e{color:#79C0FF}.ct-ef809f{color:#FF7B72}.ct-534aac{color:#A5D6FF}.ct-535538{color:#C9D1D9}.ct-60d196{color:#C9D1D9}.ct-64cc74{color:#FF7B72}.ct-27c1e8{color:#8B949E}.light .ct-27c1e8{color:#93A1A1}.light .ct-64cc74{color:#859900}.light .ct-60d196{color:#657B83}.light .ct-535538{color:#268BD2}.light .ct-534aac{color:#2AA198}.light .ct-ef809f{color:#073642}.light .ct-c51f3e{color:#268BD2}.light .ct-a1f1df{color:#268BD2}.light .ct-7f4c7e{color:#657B83}.light .ct-7cd29f{color:#657B83}.light .ct-8977a7{color:#859900}.light .ct-a32dc8{color:#268BD2}.light .ct-d183b6{color:#859900}.light .ct-3f41dc{color:#D33682}.light .ct-7f060f{color:#859900}.light .ct-f236f7{color:#B58900}.light .ct-93980e{color:#93A1A1}.light .ct-5dbe56{color:#CB4B16}"}]}],toc:{title:I,searchDepth:O,depth:O,links:[{id:aI,depth:O,text:aJ},{id:aK,depth:O,text:aL},{id:aM,depth:O,text:aN},{id:aO,depth:O,text:aP},{id:aQ,depth:O,text:aR},{id:aS,depth:O,text:aT},{id:aV,depth:O,text:aW},{id:aY,depth:O,text:aZ},{id:a$,depth:O,text:ba}]}},_type:"markdown",_id:"content:Frontend:WebGL:Basics of WebGL (Drawing a Cube).md",_source:"content",_file:"Frontend\u002FWebGL\u002FBasics of WebGL (Drawing a Cube).md",_extension:"md"}},prerenderedAt:1711020861440}}("element","span","text","ct-60d196","line","ct-535538",", "," ","ct-3f41dc","ct-64cc74","."," ","gl","ct-a1f1df","(","ct-27c1e8"," ","1","ct-c51f3e",");","a","ct-ef809f","p","=","h2","ct-7f4c7e","code","0","ct-534aac","strong","code-inline","Vertex Shaders","const","-","","Vertex%20Shaders","Fragment Shaders",";",",","prg",2,"nofollow","Fragment%20Shaders","pre"," ","indices"," (","shader","varyings"," and ","ct-7cd29f","ct-8977a7",":","bindBuffer"," ","createShader","if","new","ct-7f060f","2","7","6","li","https:\u002F\u002Fopen.gl\u002F","Vertices","vertices","uniforms",").","typescript","Read more at ","c","width","ct-d183b6","height",") {","!","throw"," }","3","4","5","ARRAY_BUFFER","), ","ELEMENT_ARRAY_BUFFER","i","speed","vec4",false,"helpful-documentation","Helpful documentation","vertices-and-indices","Vertices and Indices","shaders","Shaders","program","Program","applying-transformations","Applying transformations","source-code-with-explanations","Source code with explanations","\u002F\u002F render-a-cube.ts\nimport { createShader } from \".\u002Fcreate-shader\";\nimport vxShader from \".\u002Fvertex.glsl?raw\";\nimport fgShader from \".\u002Ffragment.glsl?raw\";\n\nconst canvas = document.getElementyId('view');\nconst ctx = canvas.getRenderingContext('webgl');\n\n\u002F\u002F should be put inside requestAnimationFrame\ndrawCube(ctx)(); \n\nfunction drawCube (\n gl: WebGL2RenderingContext, \n width: number,\n height: number\n) {\n \u002F\u002F Initializing viewport\n gl.viewport(0, 0, width, height);\n gl.clearColor(0, 0, 0, 0);\n gl.clear(gl.COLOR_BUFFER_BIT);\n\n const prg = gl.createProgram();\n if (!prg) {\n throw new Error(\"Can't init programm\");\n }\n\n \u002F\u002F Setting up VERTEX and FRAGMENT shaders\n const vx = createShader(gl, vxShader, gl.VERTEX_SHADER);\n gl.attachShader(prg, vx);\n const fx = createShader(gl, fgShader, gl.FRAGMENT_SHADER);\n gl.attachShader(prg, fx);\n gl.linkProgram(prg);\n if (!gl.getProgramParameter(prg, gl.LINK_STATUS)) {\n throw new Error(\"Could not initialise shaders\");\n }\n\n \u002F\u002F Cube's vertices Array\u003C[x,y,z]\u003E, 8 items\n const vertices = [\n -1, -1, -1, \u002F\u002F 0\n 1, -1, -1, \u002F\u002F 1\n 1, 1, -1, \u002F\u002F 2\n -1, 1, -1, \u002F\u002F 3\n -1, -1, 1, \u002F\u002F 4\n 1, -1, 1, \u002F\u002F 5\n 1, 1, 1, \u002F\u002F 6\n -1, 1, 1, \u002F\u002F 7\n ];\n\n \u002F\u002F indices, that form triangles, that form cube sides\n const indices = [\n 2, 1, 0, \u002F\u002F side 0 (first triangle)\n 0, 3, 2, \u002F\u002F side 0 (second triangle)\n 0, 4, 7, \u002F\u002F side 1 (first triangle)\n 7, 3, 0, \u002F\u002F side 1 (second triangle)\n 0, 1, 5, \u002F\u002F ...\n 5, 4, 0, \n 1, 2, 6, \n 6, 5, 1, \n 2, 3, 7, \n 7, 6, 2, \n 4, 5, 6, \n 6, 7, 4,\n ];\n\n \u002F\u002F createe a vertex buffer and bind vertices to it\n const squareVertexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);\n gl.bindBuffer(gl.ARRAY_BUFFER, null);\n\n \u002F\u002F create a vertex buffer and bind indices to it\n const squareIndexBuffer = gl.createBuffer();\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, squareIndexBuffer);\n gl.bufferData(\n gl.ELEMENT_ARRAY_BUFFER,\n new Uint16Array(indices),\n gl.STATIC_DRAW\n );\n gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, null);\n\n \u002F\u002F initial drawing\n gl.clearColor(0.0, 0.0, 0.0, 0.0);\n gl.enable(gl.DEPTH_TEST);\n gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);\n gl.viewport(0, 0, width, height);\n\n \u002F\u002F bind squareVertexBuffer as vertex positions buffer\n gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);\n \n \u002F\u002F send every 3 bytes from squareVertexBuffer as {x,y,z} for each verticle\n gl.vertexAttribPointer(\n gl.getAttribLocation(prg, \"aVertexPosition\"), \n 3, \u002F\u002F 3 bytes-long\n gl.FLOAT,\n false, \u002F\u002F don't normalize (int to float)\n 0, \n 0\n );\n \u002F\u002F send vertice buffer as `aVertexPosition` attribute inside vertex shader\n gl.enableVertexAttribArray(\n gl.getAttribLocation(prg, \"aVertexPosition\")\n );\n\n let i = 0;\n let speed = 0.01;\n\n \u002F\u002F that's the main rendering callback\n return () =\u003E {\n gl.useProgram(prg);\n\n const scale = i * 0.25 + 0.25;\n\n \u002F\u002F used for scaling inside Vertex Shader\n gl.uniform1f(gl.getUniformLocation(prg, \"slide\"), scale);\n \u002F\u002F GL Screen is square, so we need to fix it's aspect ration\n gl.uniform1f(gl.getUniformLocation(prg, \"aspect\"), height \u002F width);\n\n gl.bindBuffer(\n gl.ELEMENT_ARRAY_BUFFER, \n squareIndexBuffer\n );\n \n gl.drawElements(\n gl.TRIANGLES, \n indices.length, \n gl.UNSIGNED_SHORT, \n 0,\n );\n\n if (i \u003E 1 || i \u003C 0) {\n speed = -speed;\n }\n\n i += speed;\n };\n};\n","shader-compiler","Shader compiler","\u002F\u002F create-shader.ts\nexport const createShader = (\n gl: WebGL2RenderingContext,\n sourceCode: string,\n type: number, \u002F\u002F gl.VERTEX_SHADER or gl.FRAGMENT_SHADER\n) =\u003E {\n const shader = gl.createShader(type);\n if (!shader) {\n throw new Error(`Can't init shader`);\n }\n\n gl.shaderSource(shader, sourceCode);\n gl.compileShader(shader);\n\n if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {\n const info = gl.getShaderInfoLog(shader);\n throw `Could not compile WebGL program. \\n\\n${info}`;\n }\n\n return shader;\n};\n","vertex-shader-example","Vertex Shader Example","\u002F\u002F current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n\u002F\u002F final vertice position with all transformations applied,\n\u002F\u002F that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n\u002F\u002F Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n \u002F\u002F float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n \u002F\u002F float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n \u002F\u002F vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n \u002F\u002F vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n","fragment-shader-example","Fragment Shader Example","precision highp float;\n\n\u002F\u002F parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n\nvoid main(void){\n \u002F\u002F color, attached to current verticle {r,g,b,alpha}\n \u002F\u002F same a[\n \u002F\u002F v_positionWithOffset.x,\n \u002F\u002F v_positionWithOffset.y, \n \u002F\u002F v_positionWithOffset.z, \n \u002F\u002F 1\n \u002F\u002F ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}\n","import","from","number","();","Error",", ",", ","squareVertexBuffer","ct-f236f7","squareIndexBuffer"," );","0.0","scale","*","float","void","Basics Of WebGL (Drawing A Cube)","\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)","root","ul","This youtube series: ","https:\u002F\u002Fwww.youtube.com\u002Fwatch?v=kB0ZVUrI4Aw","Basics","https:\u002F\u002Fwww.youtube.com\u002Fwatch?v=3yLL9ADo-ko","Making a cube, applying transformations","https:\u002F\u002Fwww.youtube.com\u002Fwatch?v=hpnd11doMgc&t=52s","Texturing"," are points with specific coordinates ","{x,y,z}"," in a 3D-space. We can build any figure by connecting "," in triangles with ","Shaders are functions, written in C, which describe how to draw and color polygons to Graphic Card."," describe ","vertice"," positions, so Graphic Card can position them by connecting with "," and project to 2D canvas."," describe the way polygons should be colored by assigning colors to Vertices or by applying textures to polygons.","Shaders can have parameters passed from Javascript code (","attributes","). "," can also access data from "," (that ones called ","img","https:\u002F\u002Fopen.gl\u002Fmedia\u002Fimg\u002Fc2_pipeline.png","Program, as far as I understand, is a scene, that's described with ","Indices",", specific ","The best way to change positions inside "," or color in "," is to pass parameters (also called ","Read about that at ","https:\u002F\u002Fopen.gl\u002Ftransformations","open.gl"," and at ","vxShader","fgShader","canvas","ctx","drawCube","ct-a32dc8","WebGL2RenderingContext","viewport","clearColor","clear","COLOR_BUFFER_BIT","vx","attachShader","fx",")) {"," ["," ];","createBuffer","bufferData","STATIC_DRAW","null","getAttribLocation","\"aVertexPosition\"","let","return","=\u003E"," {","uniform1f","getUniformLocation"," );","};","sourceCode","type","info","varying vec4 v_positionWithOffset;","uniform ","main","vec3","}")) \ No newline at end of file diff --git a/docs/frontend/webgl/basics-of-webgl-(drawing-a-cube)/index.html b/docs/frontend/webgl/basics-of-webgl-(drawing-a-cube)/index.html index 25dc03a..b070fff 100644 --- a/docs/frontend/webgl/basics-of-webgl-(drawing-a-cube)/index.html +++ b/docs/frontend/webgl/basics-of-webgl-(drawing-a-cube)/index.html @@ -1,6 +1,6 @@ -Basics Of WebGL (Drawing A Cube) • Obsidian Garden -

Basics Of WebGL (Drawing A Cube)

Helpful documentation

Vertices and Indices

Vertices are points with specific coordinates {x,y,z} in a 3D-space. We can build any figure by connecting vertices in triangles with indices.

Shaders

Shaders are functions, written in C, which describe how to draw and color polygons to Graphic Card.

Vertex Shaders describe vertice positions, so Graphic Card can position them by connecting with indices and project to 2D canvas.

Fragment Shaders describe the way polygons should be colored by assigning colors to Vertices or by applying textures to polygons.

Shaders can have parameters passed from Javascript code (uniforms, varyings and attributes). Fragment Shaders can also access data from Vertex Shaders (that ones called varyings).

Program

Program, as far as I understand, is a scene, that's described with Vertices, Indices, specific Vertex Shaders and Fragment Shaders.

Applying transformations

The best way to change positions inside Vertex Shaders or color in Fragment Shaders is to pass parameters (also called uniforms and varyings).

Read about that at open.gl and at Vertex Shaders.

Source code with explanations

// render-a-cube.tsimport { createShader } from "./create-shader";import vxShader from "./vertex.glsl?raw";import fgShader from "./fragment.glsl?raw";const canvas = document.getElementyId('view');const ctx = canvas.getRenderingContext('webgl');// should be put inside requestAnimationFramedrawCube(ctx)(); function drawCube (  gl: WebGL2RenderingContext,   width: number,  height: number) {  // Initializing viewport  gl.viewport(0, width, height);  gl.clearColor(0, 0, 0);  gl.clear(gl.COLOR_BUFFER_BIT);  const prg = gl.createProgram();  if (!prg) {    throw new Error("Can't init programm");  }  // Setting up VERTEX and FRAGMENT shaders  const vx = createShader(gl, vxShader, gl.VERTEX_SHADER);  gl.attachShader(prg, vx);  const fx = createShader(gl, fgShader, gl.FRAGMENT_SHADER);  gl.attachShader(prg, fx);  gl.linkProgram(prg);  if (!gl.getProgramParameter(prg, gl.LINK_STATUS)) {    throw new Error("Could not initialise shaders");  }  // Cube's vertices Array<[x,y,z]>, 8 items  const vertices = [    -1, -1, -1, // 0    1, -1, -1,  // 1    1, 1, -1,   // 2    -1, 1, -1,  // 3    -1, -1, 1,  // 4    1, -1, 1,   // 5    1, 1, 1,    // 6    -1, 1, 1,   // 7  ];  // indices, that form triangles, that form cube sides  const indices = [    2, 1, 0, // side 0 (first triangle)    0, 3, 2, // side 0 (second triangle)    0, 4, 7, // side 1 (first triangle)    7, 3, 0, // side 1 (second triangle)    0, 1, 5, // ...    5, 4, 0,     1, 2, 6,     6, 5, 1,     2, 3, 7,     7, 6, 2,     4, 5, 6,     6, 7, 4,  ];  // createe a vertex buffer and bind vertices to it  const squareVertexBuffer = gl.createBuffer();  gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);  gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);  gl.bindBuffer(gl.ARRAY_BUFFER, null);  // create a vertex buffer and bind indices to it  const squareIndexBuffer = gl.createBuffer();  gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, squareIndexBuffer);  gl.bufferData(    gl.ELEMENT_ARRAY_BUFFER,    new Uint16Array(indices),    gl.STATIC_DRAW  );  gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, null);  // initial drawing  gl.clearColor(0.0, 0.0, 0.0);  gl.enable(gl.DEPTH_TEST);  gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);  gl.viewport(0, width, height);  // bind squareVertexBuffer as vertex positions buffer  gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);    // send every 3 bytes from squareVertexBuffer as {x,y,z} for each verticle  gl.vertexAttribPointer(      gl.getAttribLocation(prg, "aVertexPosition"),       3, // 3 bytes-long      gl.FLOAT,      false, // don't normalize (int to float)      0,       0  );  // send vertice buffer as `aVertexPosition` attribute inside vertex shader  gl.enableVertexAttribArray(      gl.getAttribLocation(prg, "aVertexPosition")  );  let i = 0;  let speed = 0.01;  // that's the main rendering callback  return () => {    gl.useProgram(prg);    const scale = i *  0.25;    // used for scaling inside Vertex Shader    gl.uniform1f(gl.getUniformLocation(prg, "slide"), scale);    // GL Screen is square, so we need to fix it's aspect ration    gl.uniform1f(gl.getUniformLocation(prg, "aspect"), height / width);    gl.bindBuffer(        gl.ELEMENT_ARRAY_BUFFER,         squareIndexBuffer    );        gl.drawElements(        gl.TRIANGLES,         indices        gl.UNSIGNED_SHORT,         0,    );    if (i > || 0) {      speed = -speed;    }    i += speed;  };};

Shader compiler

// create-shader.tsexport const createShader = (  gl: WebGL2RenderingContext,  sourceCode: string,  type: number, // gl.VERTEX_SHADER or gl.FRAGMENT_SHADER) => {  const shader = gl.createShader(type);  if (!shader) {    throw new Error(`Can't init shader`);  }  gl.shaderSource(shader, sourceCode);  gl.compileShader(shader);  if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {    const info = gl.getShaderInfoLog(shader);    throw `Could not compile WebGL program. \n\n${info}`;  }  return shader;};

Vertex Shader Example

Read more at Vertex Shaders

// current vertice position {x,y,z,w}attribute vec4 aVertexPosition;// final vertice position with all transformations applied,// that will be passed to Fragment Shadervarying vec4 v_positionWithOffset;// Parameters passed from Javascript loopuniform float slide;uniform float aspect;void main(){  // float array of 4 elements, same as [slide,slide,slide,1]  vec4 scale=vec4(vec3(slide),1);  // float array of 4 elements, same as [aspect,1,1,1]  vec4 aspectRatioFix=vec4(aspect,vec3(1));  // vertice position, multiplied with matrices of scale and aspect ratio  gl_Position=aVertexPosition*scale*aspectRatioFix,  // vertice offset, that will be passed to fragment shader  v_positionWithOffset=gl_Position+vec4(1,1,1,1);}

Fragment Shader Example

Read more at Fragment Shaders.

precision highp float;// parameter from Vertex Shadervarying vec4 v_positionWithOffset;void main(void){  // color, attached to current verticle {r,g,b,alpha}  // same a[  //   v_positionWithOffset.x,  //   v_positionWithOffset.y,   //   v_positionWithOffset.z,   //   1  //  ]  gl_FragColor=vec4(v_positionWithOffset.xyz,1);}
btw, have a nice day
(2018 - 2024) muerwre
+

Basics Of WebGL (Drawing A Cube)

Helpful documentation

Vertices and Indices

Vertices are points with specific coordinates {x,y,z} in a 3D-space. We can build any figure by connecting vertices in triangles with indices.

Shaders

Shaders are functions, written in C, which describe how to draw and color polygons to Graphic Card.

Vertex Shaders describe vertice positions, so Graphic Card can position them by connecting with indices and project to 2D canvas.

Fragment Shaders describe the way polygons should be colored by assigning colors to Vertices or by applying textures to polygons.

Shaders can have parameters passed from Javascript code (uniforms, varyings and attributes). Fragment Shaders can also access data from Vertex Shaders (that ones called varyings).

Program

Program, as far as I understand, is a scene, that's described with Vertices, Indices, specific Vertex Shaders and Fragment Shaders.

Applying transformations

The best way to change positions inside Vertex Shaders or color in Fragment Shaders is to pass parameters (also called uniforms and varyings).

Read about that at open.gl and at Vertex Shaders.

Source code with explanations

// render-a-cube.tsimport { createShader } from "./create-shader";import vxShader from "./vertex.glsl?raw";import fgShader from "./fragment.glsl?raw";const canvas = document.getElementyId('view');const ctx = canvas.getRenderingContext('webgl');// should be put inside requestAnimationFramedrawCube(ctx)(); function drawCube (  gl: WebGL2RenderingContext,   width: number,  height: number) {  // Initializing viewport  gl.viewport(0, width, height);  gl.clearColor(0, 0, 0);  gl.clear(gl.COLOR_BUFFER_BIT);  const prg = gl.createProgram();  if (!prg) {    throw new Error("Can't init programm");  }  // Setting up VERTEX and FRAGMENT shaders  const vx = createShader(gl, vxShader, gl.VERTEX_SHADER);  gl.attachShader(prg, vx);  const fx = createShader(gl, fgShader, gl.FRAGMENT_SHADER);  gl.attachShader(prg, fx);  gl.linkProgram(prg);  if (!gl.getProgramParameter(prg, gl.LINK_STATUS)) {    throw new Error("Could not initialise shaders");  }  // Cube's vertices Array<[x,y,z]>, 8 items  const vertices = [    -1, -1, -1, // 0    1, -1, -1,  // 1    1, 1, -1,   // 2    -1, 1, -1,  // 3    -1, -1, 1,  // 4    1, -1, 1,   // 5    1, 1, 1,    // 6    -1, 1, 1,   // 7  ];  // indices, that form triangles, that form cube sides  const indices = [    2, 1, 0, // side 0 (first triangle)    0, 3, 2, // side 0 (second triangle)    0, 4, 7, // side 1 (first triangle)    7, 3, 0, // side 1 (second triangle)    0, 1, 5, // ...    5, 4, 0,     1, 2, 6,     6, 5, 1,     2, 3, 7,     7, 6, 2,     4, 5, 6,     6, 7, 4,  ];  // createe a vertex buffer and bind vertices to it  const squareVertexBuffer = gl.createBuffer();  gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);  gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);  gl.bindBuffer(gl.ARRAY_BUFFER, null);  // create a vertex buffer and bind indices to it  const squareIndexBuffer = gl.createBuffer();  gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, squareIndexBuffer);  gl.bufferData(    gl.ELEMENT_ARRAY_BUFFER,    new Uint16Array(indices),    gl.STATIC_DRAW  );  gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, null);  // initial drawing  gl.clearColor(0.0, 0.0, 0.0);  gl.enable(gl.DEPTH_TEST);  gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);  gl.viewport(0, width, height);  // bind squareVertexBuffer as vertex positions buffer  gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexBuffer);    // send every 3 bytes from squareVertexBuffer as {x,y,z} for each verticle  gl.vertexAttribPointer(      gl.getAttribLocation(prg, "aVertexPosition"),       3, // 3 bytes-long      gl.FLOAT,      false, // don't normalize (int to float)      0,       0  );  // send vertice buffer as `aVertexPosition` attribute inside vertex shader  gl.enableVertexAttribArray(      gl.getAttribLocation(prg, "aVertexPosition")  );  let i = 0;  let speed = 0.01;  // that's the main rendering callback  return () => {    gl.useProgram(prg);    const scale = i *  0.25;    // used for scaling inside Vertex Shader    gl.uniform1f(gl.getUniformLocation(prg, "slide"), scale);    // GL Screen is square, so we need to fix it's aspect ration    gl.uniform1f(gl.getUniformLocation(prg, "aspect"), height / width);    gl.bindBuffer(        gl.ELEMENT_ARRAY_BUFFER,         squareIndexBuffer    );        gl.drawElements(        gl.TRIANGLES,         indices        gl.UNSIGNED_SHORT,         0,    );    if (i > || 0) {      speed = -speed;    }    i += speed;  };};

Shader compiler

// create-shader.tsexport const createShader = (  gl: WebGL2RenderingContext,  sourceCode: string,  type: number, // gl.VERTEX_SHADER or gl.FRAGMENT_SHADER) => {  const shader = gl.createShader(type);  if (!shader) {    throw new Error(`Can't init shader`);  }  gl.shaderSource(shader, sourceCode);  gl.compileShader(shader);  if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {    const info = gl.getShaderInfoLog(shader);    throw `Could not compile WebGL program. \n\n${info}`;  }  return shader;};

Vertex Shader Example

Read more at Vertex Shaders

// current vertice position {x,y,z,w}attribute vec4 aVertexPosition;// final vertice position with all transformations applied,// that will be passed to Fragment Shadervarying vec4 v_positionWithOffset;// Parameters passed from Javascript loopuniform float slide;uniform float aspect;void main(){  // float array of 4 elements, same as [slide,slide,slide,1]  vec4 scale=vec4(vec3(slide),1);  // float array of 4 elements, same as [aspect,1,1,1]  vec4 aspectRatioFix=vec4(aspect,vec3(1));  // vertice position, multiplied with matrices of scale and aspect ratio  gl_Position=aVertexPosition*scale*aspectRatioFix,  // vertice offset, that will be passed to fragment shader  v_positionWithOffset=gl_Position+vec4(1,1,1,1);}

Fragment Shader Example

Read more at Fragment Shaders.

precision highp float;// parameter from Vertex Shadervarying vec4 v_positionWithOffset;void main(void){  // color, attached to current verticle {r,g,b,alpha}  // same a[  //   v_positionWithOffset.x,  //   v_positionWithOffset.y,   //   v_positionWithOffset.z,   //   1  //  ]  gl_FragColor=vec4(v_positionWithOffset.xyz,1);}
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/frontend/webgl/fragment-shaders/_payload.js b/docs/frontend/webgl/fragment-shaders/_payload.js index 332019b..55fcdf5 100644 --- a/docs/frontend/webgl/fragment-shaders/_payload.js +++ b/docs/frontend/webgl/fragment-shaders/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:u,_path:v},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:l,_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-qKKsIqiioV":{_path:v,_dir:"webgl",_draft:m,_partial:m,_locale:"en",_empty:m,title:u,description:"Fragment shaders describe how polygons are painted (or textured). Read Basics of WebGL (Drawing a Cube) first.",excerpt:{type:w,children:[{type:a,tag:i,props:{},children:[{type:b,value:x},{type:a,tag:c,props:{className:[y]},children:[{type:b,value:z}]},{type:b,value:A},{type:a,tag:j,props:{href:B},children:[{type:b,value:C}]},{type:b,value:D}]},{type:a,tag:E,props:{id:n},children:[{type:b,value:o}]},{type:a,tag:i,props:{},children:[{type:b,value:F},{type:a,tag:j,props:{href:G},children:[{type:b,value:l}]},{type:b,value:p}]},{type:a,tag:k,props:{code:q,language:H},children:[{type:a,tag:I,props:{},children:[{type:a,tag:k,props:{__ignoreMap:r},children:[{type:b,value:q}]}]}]}]},body:{type:w,children:[{type:a,tag:i,props:{},children:[{type:b,value:x},{type:a,tag:c,props:{className:[y]},children:[{type:b,value:z}]},{type:b,value:A},{type:a,tag:j,props:{href:B},children:[{type:b,value:C}]},{type:b,value:D}]},{type:a,tag:E,props:{id:n},children:[{type:b,value:o}]},{type:a,tag:i,props:{},children:[{type:b,value:F},{type:a,tag:j,props:{href:G},children:[{type:b,value:l}]},{type:b,value:p}]},{type:a,tag:k,props:{code:q,language:H},children:[{type:a,tag:I,props:{},children:[{type:a,tag:k,props:{__ignoreMap:r},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"precision highp "}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:";"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"\u002F\u002F parameter from Vertex Shader"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"varying vec4 v_positionWithOffset;"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"\u002F\u002F parameters passed from Javascript loop"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:J}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" slide;"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:J}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" aspect;"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:h},children:[{type:b,value:K}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:L},children:[{type:b,value:"main"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:M}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:K}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"){"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"\u002F\u002F color, attached to current verticle {r,g,b,alpha}"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"\u002F\u002F same a["}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"\u002F\u002F v_positionWithOffset.x,"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"\u002F\u002F v_positionWithOffset.y, "}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"\u002F\u002F v_positionWithOffset.z, "}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"\u002F\u002F 1"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"\u002F\u002F ]"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" gl_FragColor"}]},{type:a,tag:c,props:{class:"ct-f82235"},children:[{type:b,value:"="}]},{type:a,tag:c,props:{class:L},children:[{type:b,value:"vec4"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:M}]},{type:a,tag:c,props:{class:N},children:[{type:b,value:"v_positionWithOffset"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:N},children:[{type:b,value:"xyz"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:","}]},{type:a,tag:c,props:{class:"ct-c7e855"},children:[{type:b,value:"1"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:");"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"}```"}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-c7e855{color:#79C0FF}.ct-ec0d41{color:#C9D1D9}.ct-f82235{color:#FF7B72}.ct-bd94b5{color:#D2A8FF}.ct-83a565{color:#8B949E}.ct-87906d{color:#FF7B72}.ct-c796a9{color:#C9D1D9}.light .ct-c796a9{color:#657B83}.light .ct-87906d{color:#073642}.light .ct-83a565{color:#93A1A1}.light .ct-bd94b5{color:#268BD2}.light .ct-f82235{color:#859900}.light .ct-ec0d41{color:#268BD2}.light .ct-c7e855{color:#D33682}"}]}],toc:{title:r,searchDepth:t,depth:t,links:[{id:n,depth:t,text:o}]}},_type:"markdown",_id:"content:Frontend:WebGL:Fragment Shaders.md",_source:"content",_file:"Frontend\u002FWebGL\u002FFragment Shaders.md",_extension:"md"}},prerenderedAt:1711020227462}}("element","text","span","ct-c796a9","line","ct-83a565"," ","ct-87906d","p","a","code","Vertex Shaders",false,"sample-fragment-vertex","Sample fragment vertex",".","precision highp float;\n\n\u002F\u002F parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n\u002F\u002F parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(void){\n \u002F\u002F color, attached to current verticle {r,g,b,alpha}\n \u002F\u002F same a[\n \u002F\u002F v_positionWithOffset.x,\n \u002F\u002F v_positionWithOffset.y, \n \u002F\u002F v_positionWithOffset.z, \n \u002F\u002F 1\n \u002F\u002F ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}```\n","","float",2,"Fragment Shaders","\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders","root","Fragment shaders describe ","highlight","how polygons are painted"," (or textured). Read ","Basics%20of%20WebGL%20(Drawing%20a%20Cube)","Basics of WebGL (Drawing a Cube)"," first.","h2","Parameters could be passed here as written at ","Vertex%20Shaders","c","pre","uniform ","void","ct-bd94b5","(","ct-ec0d41")) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:u,_path:v},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:l,_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-qKKsIqiioV":{_path:v,_dir:"webgl",_draft:m,_partial:m,_locale:"en",_empty:m,title:u,description:"Fragment shaders describe how polygons are painted (or textured). Read Basics of WebGL (Drawing a Cube) first.",excerpt:{type:w,children:[{type:a,tag:i,props:{},children:[{type:b,value:x},{type:a,tag:c,props:{className:[y]},children:[{type:b,value:z}]},{type:b,value:A},{type:a,tag:j,props:{href:B},children:[{type:b,value:C}]},{type:b,value:D}]},{type:a,tag:E,props:{id:n},children:[{type:b,value:o}]},{type:a,tag:i,props:{},children:[{type:b,value:F},{type:a,tag:j,props:{href:G},children:[{type:b,value:l}]},{type:b,value:p}]},{type:a,tag:k,props:{code:q,language:H},children:[{type:a,tag:I,props:{},children:[{type:a,tag:k,props:{__ignoreMap:r},children:[{type:b,value:q}]}]}]}]},body:{type:w,children:[{type:a,tag:i,props:{},children:[{type:b,value:x},{type:a,tag:c,props:{className:[y]},children:[{type:b,value:z}]},{type:b,value:A},{type:a,tag:j,props:{href:B},children:[{type:b,value:C}]},{type:b,value:D}]},{type:a,tag:E,props:{id:n},children:[{type:b,value:o}]},{type:a,tag:i,props:{},children:[{type:b,value:F},{type:a,tag:j,props:{href:G},children:[{type:b,value:l}]},{type:b,value:p}]},{type:a,tag:k,props:{code:q,language:H},children:[{type:a,tag:I,props:{},children:[{type:a,tag:k,props:{__ignoreMap:r},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"precision highp "}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:";"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"\u002F\u002F parameter from Vertex Shader"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"varying vec4 v_positionWithOffset;"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"\u002F\u002F parameters passed from Javascript loop"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:J}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" slide;"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:J}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:s}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" aspect;"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:h},children:[{type:b,value:K}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:L},children:[{type:b,value:"main"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:M}]},{type:a,tag:c,props:{class:h},children:[{type:b,value:K}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"){"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"\u002F\u002F color, attached to current verticle {r,g,b,alpha}"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"\u002F\u002F same a["}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"\u002F\u002F v_positionWithOffset.x,"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"\u002F\u002F v_positionWithOffset.y, "}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"\u002F\u002F v_positionWithOffset.z, "}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"\u002F\u002F 1"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:g}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"\u002F\u002F ]"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" gl_FragColor"}]},{type:a,tag:c,props:{class:"ct-28a4d8"},children:[{type:b,value:"="}]},{type:a,tag:c,props:{class:L},children:[{type:b,value:"vec4"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:M}]},{type:a,tag:c,props:{class:N},children:[{type:b,value:"v_positionWithOffset"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:N},children:[{type:b,value:"xyz"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:","}]},{type:a,tag:c,props:{class:"ct-6bb943"},children:[{type:b,value:"1"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:");"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"}```"}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-6bb943{color:#79C0FF}.ct-b5ac9c{color:#C9D1D9}.ct-28a4d8{color:#FF7B72}.ct-84f100{color:#D2A8FF}.ct-f234e2{color:#8B949E}.ct-18640f{color:#FF7B72}.ct-af55ca{color:#C9D1D9}.light .ct-af55ca{color:#657B83}.light .ct-18640f{color:#073642}.light .ct-f234e2{color:#93A1A1}.light .ct-84f100{color:#268BD2}.light .ct-28a4d8{color:#859900}.light .ct-b5ac9c{color:#268BD2}.light .ct-6bb943{color:#D33682}"}]}],toc:{title:r,searchDepth:t,depth:t,links:[{id:n,depth:t,text:o}]}},_type:"markdown",_id:"content:Frontend:WebGL:Fragment Shaders.md",_source:"content",_file:"Frontend\u002FWebGL\u002FFragment Shaders.md",_extension:"md"}},prerenderedAt:1711020861628}}("element","text","span","ct-af55ca","line","ct-f234e2"," ","ct-18640f","p","a","code","Vertex Shaders",false,"sample-fragment-vertex","Sample fragment vertex",".","precision highp float;\n\n\u002F\u002F parameter from Vertex Shader\nvarying vec4 v_positionWithOffset;\n\u002F\u002F parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(void){\n \u002F\u002F color, attached to current verticle {r,g,b,alpha}\n \u002F\u002F same a[\n \u002F\u002F v_positionWithOffset.x,\n \u002F\u002F v_positionWithOffset.y, \n \u002F\u002F v_positionWithOffset.z, \n \u002F\u002F 1\n \u002F\u002F ]\n gl_FragColor=vec4(v_positionWithOffset.xyz,1);\n}```\n","","float",2,"Fragment Shaders","\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders","root","Fragment shaders describe ","highlight","how polygons are painted"," (or textured). Read ","Basics%20of%20WebGL%20(Drawing%20a%20Cube)","Basics of WebGL (Drawing a Cube)"," first.","h2","Parameters could be passed here as written at ","Vertex%20Shaders","c","pre","uniform ","void","ct-84f100","(","ct-b5ac9c")) \ No newline at end of file diff --git a/docs/frontend/webgl/fragment-shaders/index.html b/docs/frontend/webgl/fragment-shaders/index.html index a3ae63c..7038b11 100644 --- a/docs/frontend/webgl/fragment-shaders/index.html +++ b/docs/frontend/webgl/fragment-shaders/index.html @@ -1,6 +1,6 @@ -Fragment Shaders • Obsidian Garden -

Fragment Shaders

Fragment shaders describe how polygons are painted (or textured). Read Basics of WebGL (Drawing a Cube) first.

Sample fragment vertex

Parameters could be passed here as written at Vertex Shaders.

precision highp float;// parameter from Vertex Shadervarying vec4 v_positionWithOffset;// parameters passed from Javascript loopuniform float slide;uniform float aspect;void main(void){  // color, attached to current verticle {r,g,b,alpha}  // same a[  //   v_positionWithOffset.x,  //   v_positionWithOffset.y,   //   v_positionWithOffset.z,   //   1  //  ]  gl_FragColor=vec4(v_positionWithOffset.xyz,1);}```
btw, have a nice day
(2018 - 2024) muerwre
+

Fragment Shaders

Fragment shaders describe how polygons are painted (or textured). Read Basics of WebGL (Drawing a Cube) first.

Sample fragment vertex

Parameters could be passed here as written at Vertex Shaders.

precision highp float;// parameter from Vertex Shadervarying vec4 v_positionWithOffset;// parameters passed from Javascript loopuniform float slide;uniform float aspect;void main(void){  // color, attached to current verticle {r,g,b,alpha}  // same a[  //   v_positionWithOffset.x,  //   v_positionWithOffset.y,   //   v_positionWithOffset.z,   //   1  //  ]  gl_FragColor=vec4(v_positionWithOffset.xyz,1);}```
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/frontend/webgl/rendering-without-blocking-in-a-worker/_payload.js b/docs/frontend/webgl/rendering-without-blocking-in-a-worker/_payload.js index c523928..c34fbb5 100644 --- a/docs/frontend/webgl/rendering-without-blocking-in-a-worker/_payload.js +++ b/docs/frontend/webgl/rendering-without-blocking-in-a-worker/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC,aD,aE,aF,aG,aH,aI,aJ,aK){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:$,_path:aa},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-jfOHJYayRG":{_path:aa,_dir:"webgl",_draft:Q,_partial:Q,_locale:"en",_empty:Q,title:$,description:"Rendering items on #canvas in main loop might cause interface freezes, preventing render process from executing properly by flooding execution stack with operations.",excerpt:{type:ab,children:[{type:a,tag:m,props:{},children:[{type:c,value:ac},{type:a,tag:b,props:{className:[B]},children:[{type:c,value:ad}]},{type:c,value:ae}]},{type:a,tag:m,props:{},children:[{type:c,value:af}]},{type:a,tag:m,props:{},children:[{type:c,value:ag},{type:a,tag:C,props:{href:ah,rel:[D]},children:[{type:c,value:ai}]},{type:c,value:aj},{type:a,tag:b,props:{className:[B]},children:[{type:c,value:ak}]},{type:c,value:al},{type:a,tag:C,props:{href:am,rel:[D]},children:[{type:c,value:E}]},{type:c,value:an}]},{type:a,tag:m,props:{},children:[{type:c,value:ao}]},{type:a,tag:r,props:{code:R,language:F},children:[{type:a,tag:G,props:{},children:[{type:a,tag:r,props:{__ignoreMap:z},children:[{type:c,value:R}]}]}]},{type:a,tag:m,props:{},children:[{type:c,value:ap}]},{type:a,tag:r,props:{code:S,language:F},children:[{type:a,tag:G,props:{},children:[{type:a,tag:r,props:{__ignoreMap:z},children:[{type:c,value:S}]}]}]}]},body:{type:ab,children:[{type:a,tag:m,props:{},children:[{type:c,value:ac},{type:a,tag:b,props:{className:[B]},children:[{type:c,value:ad}]},{type:c,value:ae}]},{type:a,tag:m,props:{},children:[{type:c,value:af}]},{type:a,tag:m,props:{},children:[{type:c,value:ag},{type:a,tag:C,props:{href:ah,rel:[D]},children:[{type:c,value:ai}]},{type:c,value:aj},{type:a,tag:b,props:{className:[B]},children:[{type:c,value:ak}]},{type:c,value:al},{type:a,tag:C,props:{href:am,rel:[D]},children:[{type:c,value:E}]},{type:c,value:an}]},{type:a,tag:m,props:{},children:[{type:c,value:ao}]},{type:a,tag:r,props:{code:R,language:F},children:[{type:a,tag:G,props:{},children:[{type:a,tag:r,props:{__ignoreMap:z},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:"\u002F\u002F main.ts"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"Worker"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"'.\u002Frender-worker.ts'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"document"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"getElementById"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"'view'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:"\u002F\u002F attaching event listener to worker"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:":"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:U},children:[{type:c,value:"MessageEvent"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:") "}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:V}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"?."}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:W}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:Y},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:au}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:av}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"event"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"as"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:U},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:M},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:M},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"}"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:"\u002F\u002F sending canvas contents to worker"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"renderInCanvas"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:V}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ax}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:W}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"return"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ay}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ax}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aA}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aB}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"] })"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aE}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aF}]}]}]}]}]},{type:a,tag:m,props:{},children:[{type:c,value:ap}]},{type:a,tag:r,props:{code:S,language:F},children:[{type:a,tag:G,props:{},children:[{type:a,tag:r,props:{__ignoreMap:z},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:"\u002F\u002F render-worker.ts"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:aG},children:[{type:c,value:"export"}]},{type:a,tag:b,props:{class:_},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:aG},children:[{type:c,value:"default"}]},{type:a,tag:b,props:{class:_},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:"ct-e101b9"},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:_},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:"ct-85ce46"},children:[{type:c,value:"{"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aH}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"message"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ay}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"instanceof"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:U},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:")) {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:Y},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"'Received unknown data'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:")"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"\u002F\u002F OffscreenCanvas can be set up inside workers"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"OffscreenCanvas"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aI}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aJ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:W}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:Y},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:au}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:av}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:M},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:M},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"\u002F\u002F That will block execution inside worker for "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"\u002F\u002F a couple of seconds"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"doHardRenderingStuffHere"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aI}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aJ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"\u002F\u002F Sending resulting image back to main thread"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aA}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:V}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aH}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"] });"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aE}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aF}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-85ce46{color:#C9D1D9}.ct-e101b9{color:#FF7B72}.ct-6575e1{color:#FFA657}.ct-0fdabc{color:#FF7B72}.ct-84e290{color:#79C0FF}.ct-a7082a{color:#79C0FF}.ct-05acc1{color:#FFA657}.ct-d814b1{color:#C9D1D9}.ct-2def8a{color:#A5D6FF}.ct-2edd34{color:#D2A8FF}.ct-06d0ef{color:#FF7B72}.ct-250ed0{color:#79C0FF}.ct-a2c7c0{color:#C9D1D9}.ct-b56802{color:#FF7B72}.ct-79498e{color:#8B949E}.light .ct-79498e{color:#93A1A1}.light .ct-b56802{color:#073642}.light .ct-a2c7c0{color:#657B83}.light .ct-250ed0{color:#268BD2}.light .ct-06d0ef{color:#859900}.light .ct-2edd34{color:#268BD2}.light .ct-2def8a{color:#2AA198}.light .ct-d814b1{color:#268BD2}.light .ct-05acc1{color:#268BD2}.light .ct-a7082a{color:#859900}.light .ct-84e290{color:#D33682}.light .ct-0fdabc{color:#859900}.light .ct-6575e1{color:#657B83}.light .ct-e101b9{color:#073642}.light .ct-85ce46{color:#657B83}"}]}],toc:{title:z,searchDepth:aK,depth:aK,links:[]}},_type:"markdown",_id:"content:Frontend:WebGL:Rendering without blocking in a Worker.md",_source:"content",_file:"Frontend\u002FWebGL\u002FRendering without blocking in a Worker.md",_extension:"md"}},prerenderedAt:1711020227482}}("element","span","text","ct-a2c7c0","line"," ","ct-d814b1","ct-06d0ef"," ","ct-2edd34","(",".","p","ct-b56802",");","=","data","code","ct-79498e","const","ct-2def8a","canvas","ctx",", ","ct-250ed0","","new","highlight","a","nofollow","ImageBitmap","typescript","pre","=\u003E","if"," (","!"," }","ct-84e290","0"," ","image",false,"\u002F\u002F main.ts\nconst instance = new Worker('.\u002Frender-worker.ts');\nconst canvas = document.getElementById('view');\n\n\u002F\u002F attaching event listener to worker\ninstance.onmessage = (event: MessageEvent) =\u003E {\n const ctx = canvas?.getContext(\"2d\");\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n \n ctx.drawImage(event.data as ImageBitmap, 0, 0);\n}\n\n\u002F\u002F sending canvas contents to worker\nconst renderInCanvas = () =\u003E {\n if (!canvas.current) {\n return;\n }\n \n createImageBitmap(canvas.current).then(image =\u003E {\n instance.postMessage(image, { transfer: [image] })\n });\n};\n","\u002F\u002F render-worker.ts\nexport default () =\u003E {\n self.onmessage = (message: MessageEvent) =\u003E {\n const data = message.data;\n\n if (!(data instanceof ImageBitmap)) {\n throw new Error('Received unknown data')\n }\n\n \u002F\u002F OffscreenCanvas can be set up inside workers\n const canvas = new OffscreenCanvas(data.width, data.height);\n const ctx = canvas.getContext(\"2d\");\n\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n\n ctx.drawImage(data, 0, 0);\n\n \u002F\u002F That will block execution inside worker for \n \u002F\u002F a couple of seconds\n doHardRenderingStuffHere(ctx, data.width, data.height);\n\n \u002F\u002F Sending resulting image back to main thread\n createImageBitmap(canvas).then((image) =\u003E {\n self.postMessage(image, { transfer: [image] });\n });\n };\n};\n","instance","ct-05acc1"," {",") {","throw","ct-a7082a","Error","ct-6575e1","Rendering Without Blocking In A Worker","\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker","root","Rendering items on #canvas in main loop ","might cause interface freezes",", preventing render process from executing properly by flooding execution stack with operations.","To handle it properly, we can start separate #worker thread, that will handle rendering in its own event loop, so that won't affect the source tab's event loop.","Workers can have access to ","https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FGlossary\u002FTransferable_objects","Transferrable Objects"," from main thread by receiving memory address. ","That's a lot faster than cloning",". In this case ","https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FImageBitmap"," is transferrable.","Code for the main thread component:","Worker code:","onmessage","getContext","\"2d\""," ","`Can't get 2D context`","drawImage"," () ","current",";","createImageBitmap",").","then","postMessage",", { transfer: ["," });","};","ct-0fdabc","self","width","height",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC,aD,aE,aF,aG,aH,aI,aJ,aK){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:$,_path:aa},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-jfOHJYayRG":{_path:aa,_dir:"webgl",_draft:Q,_partial:Q,_locale:"en",_empty:Q,title:$,description:"Rendering items on #canvas in main loop might cause interface freezes, preventing render process from executing properly by flooding execution stack with operations.",excerpt:{type:ab,children:[{type:a,tag:m,props:{},children:[{type:c,value:ac},{type:a,tag:b,props:{className:[B]},children:[{type:c,value:ad}]},{type:c,value:ae}]},{type:a,tag:m,props:{},children:[{type:c,value:af}]},{type:a,tag:m,props:{},children:[{type:c,value:ag},{type:a,tag:C,props:{href:ah,rel:[D]},children:[{type:c,value:ai}]},{type:c,value:aj},{type:a,tag:b,props:{className:[B]},children:[{type:c,value:ak}]},{type:c,value:al},{type:a,tag:C,props:{href:am,rel:[D]},children:[{type:c,value:E}]},{type:c,value:an}]},{type:a,tag:m,props:{},children:[{type:c,value:ao}]},{type:a,tag:r,props:{code:R,language:F},children:[{type:a,tag:G,props:{},children:[{type:a,tag:r,props:{__ignoreMap:z},children:[{type:c,value:R}]}]}]},{type:a,tag:m,props:{},children:[{type:c,value:ap}]},{type:a,tag:r,props:{code:S,language:F},children:[{type:a,tag:G,props:{},children:[{type:a,tag:r,props:{__ignoreMap:z},children:[{type:c,value:S}]}]}]}]},body:{type:ab,children:[{type:a,tag:m,props:{},children:[{type:c,value:ac},{type:a,tag:b,props:{className:[B]},children:[{type:c,value:ad}]},{type:c,value:ae}]},{type:a,tag:m,props:{},children:[{type:c,value:af}]},{type:a,tag:m,props:{},children:[{type:c,value:ag},{type:a,tag:C,props:{href:ah,rel:[D]},children:[{type:c,value:ai}]},{type:c,value:aj},{type:a,tag:b,props:{className:[B]},children:[{type:c,value:ak}]},{type:c,value:al},{type:a,tag:C,props:{href:am,rel:[D]},children:[{type:c,value:E}]},{type:c,value:an}]},{type:a,tag:m,props:{},children:[{type:c,value:ao}]},{type:a,tag:r,props:{code:R,language:F},children:[{type:a,tag:G,props:{},children:[{type:a,tag:r,props:{__ignoreMap:z},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:"\u002F\u002F main.ts"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"Worker"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"'.\u002Frender-worker.ts'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"document"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"getElementById"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"'view'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:"\u002F\u002F attaching event listener to worker"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:":"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:U},children:[{type:c,value:"MessageEvent"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:") "}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:V}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"?."}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:W}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:Y},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:au}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:av}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"event"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"as"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:U},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:M},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:M},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"}"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:"\u002F\u002F sending canvas contents to worker"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:n},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"renderInCanvas"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:V}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ax}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:W}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"return"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ay}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ax}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aA}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aB}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"] })"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aE}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aF}]}]}]}]}]},{type:a,tag:m,props:{},children:[{type:c,value:ap}]},{type:a,tag:r,props:{code:S,language:F},children:[{type:a,tag:G,props:{},children:[{type:a,tag:r,props:{__ignoreMap:z},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:"\u002F\u002F render-worker.ts"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:aG},children:[{type:c,value:"export"}]},{type:a,tag:b,props:{class:_},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:aG},children:[{type:c,value:"default"}]},{type:a,tag:b,props:{class:_},children:[{type:c,value:aw}]},{type:a,tag:b,props:{class:"ct-03e437"},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:_},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:"ct-9f497f"},children:[{type:c,value:"{"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aH}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"message"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ay}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"instanceof"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:U},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:")) {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:Y},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:"'Received unknown data'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:")"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"\u002F\u002F OffscreenCanvas can be set up inside workers"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"OffscreenCanvas"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aI}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aJ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:W}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:Y},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:u},children:[{type:c,value:au}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:av}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:M},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:M},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"\u002F\u002F That will block execution inside worker for "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"\u002F\u002F a couple of seconds"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"doHardRenderingStuffHere"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aI}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aJ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:"\u002F\u002F Sending resulting image back to main thread"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aA}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:V}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aH}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aC}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aD}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"] });"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aE}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aF}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-9f497f{color:#C9D1D9}.ct-03e437{color:#FF7B72}.ct-3adc7c{color:#FFA657}.ct-f45deb{color:#FF7B72}.ct-f93fe2{color:#79C0FF}.ct-b42040{color:#79C0FF}.ct-268080{color:#FFA657}.ct-ef783b{color:#C9D1D9}.ct-b7c5f5{color:#A5D6FF}.ct-8d9856{color:#D2A8FF}.ct-86786b{color:#FF7B72}.ct-1afa53{color:#79C0FF}.ct-5b7b20{color:#C9D1D9}.ct-a073d0{color:#FF7B72}.ct-8f9030{color:#8B949E}.light .ct-8f9030{color:#93A1A1}.light .ct-a073d0{color:#073642}.light .ct-5b7b20{color:#657B83}.light .ct-1afa53{color:#268BD2}.light .ct-86786b{color:#859900}.light .ct-8d9856{color:#268BD2}.light .ct-b7c5f5{color:#2AA198}.light .ct-ef783b{color:#268BD2}.light .ct-268080{color:#268BD2}.light .ct-b42040{color:#859900}.light .ct-f93fe2{color:#D33682}.light .ct-f45deb{color:#859900}.light .ct-3adc7c{color:#657B83}.light .ct-03e437{color:#073642}.light .ct-9f497f{color:#657B83}"}]}],toc:{title:z,searchDepth:aK,depth:aK,links:[]}},_type:"markdown",_id:"content:Frontend:WebGL:Rendering without blocking in a Worker.md",_source:"content",_file:"Frontend\u002FWebGL\u002FRendering without blocking in a Worker.md",_extension:"md"}},prerenderedAt:1711020861657}}("element","span","text","ct-5b7b20","line"," ","ct-ef783b","ct-86786b"," ","ct-8d9856","(",".","p","ct-a073d0",");","=","data","code","ct-8f9030","const","ct-b7c5f5","canvas","ctx",", ","ct-1afa53","","new","highlight","a","nofollow","ImageBitmap","typescript","pre","=\u003E","if"," (","!"," }","ct-f93fe2","0"," ","image",false,"\u002F\u002F main.ts\nconst instance = new Worker('.\u002Frender-worker.ts');\nconst canvas = document.getElementById('view');\n\n\u002F\u002F attaching event listener to worker\ninstance.onmessage = (event: MessageEvent) =\u003E {\n const ctx = canvas?.getContext(\"2d\");\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n \n ctx.drawImage(event.data as ImageBitmap, 0, 0);\n}\n\n\u002F\u002F sending canvas contents to worker\nconst renderInCanvas = () =\u003E {\n if (!canvas.current) {\n return;\n }\n \n createImageBitmap(canvas.current).then(image =\u003E {\n instance.postMessage(image, { transfer: [image] })\n });\n};\n","\u002F\u002F render-worker.ts\nexport default () =\u003E {\n self.onmessage = (message: MessageEvent) =\u003E {\n const data = message.data;\n\n if (!(data instanceof ImageBitmap)) {\n throw new Error('Received unknown data')\n }\n\n \u002F\u002F OffscreenCanvas can be set up inside workers\n const canvas = new OffscreenCanvas(data.width, data.height);\n const ctx = canvas.getContext(\"2d\");\n\n if (!ctx) {\n throw new Error(`Can't get 2D context`);\n }\n\n ctx.drawImage(data, 0, 0);\n\n \u002F\u002F That will block execution inside worker for \n \u002F\u002F a couple of seconds\n doHardRenderingStuffHere(ctx, data.width, data.height);\n\n \u002F\u002F Sending resulting image back to main thread\n createImageBitmap(canvas).then((image) =\u003E {\n self.postMessage(image, { transfer: [image] });\n });\n };\n};\n","instance","ct-268080"," {",") {","throw","ct-b42040","Error","ct-3adc7c","Rendering Without Blocking In A Worker","\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker","root","Rendering items on #canvas in main loop ","might cause interface freezes",", preventing render process from executing properly by flooding execution stack with operations.","To handle it properly, we can start separate #worker thread, that will handle rendering in its own event loop, so that won't affect the source tab's event loop.","Workers can have access to ","https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FGlossary\u002FTransferable_objects","Transferrable Objects"," from main thread by receiving memory address. ","That's a lot faster than cloning",". In this case ","https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FImageBitmap"," is transferrable.","Code for the main thread component:","Worker code:","onmessage","getContext","\"2d\""," ","`Can't get 2D context`","drawImage"," () ","current",";","createImageBitmap",").","then","postMessage",", { transfer: ["," });","};","ct-f45deb","self","width","height",2)) \ No newline at end of file diff --git a/docs/frontend/webgl/rendering-without-blocking-in-a-worker/index.html b/docs/frontend/webgl/rendering-without-blocking-in-a-worker/index.html index cd34351..dc4b055 100644 --- a/docs/frontend/webgl/rendering-without-blocking-in-a-worker/index.html +++ b/docs/frontend/webgl/rendering-without-blocking-in-a-worker/index.html @@ -1,6 +1,6 @@ -Rendering Without Blocking In A Worker • Obsidian Garden -

Rendering Without Blocking In A Worker

Rendering items on #canvas in main loop might cause interface freezes, preventing render process from executing properly by flooding execution stack with operations.

To handle it properly, we can start separate #worker thread, that will handle rendering in its own event loop, so that won't affect the source tab's event loop.

Workers can have access to Transferrable Objects from main thread by receiving memory address. That's a lot faster than cloning. In this case ImageBitmap is transferrable.

Code for the main thread component:

// main.tsconst instance = new Worker('./render-worker.ts');const canvas = document.getElementById('view');// attaching event listener to workerinstance.onmessage =: MessageEvent) => {    const ctx = canvas?.getContext("2d");    if (!ctx) {        throw new Error(`Can't get 2D context`);    }        ctx.drawImage(event.data as ImageBitmap, 0, 0);}// sending canvas contents to workerconst renderInCanvas = () => {    if (!canvas.current) {      return;    }        createImageBitmap(canvas.current).then        instance.postMessage(image, { transfer: [image] })    });};

Worker code:

// render-worker.tsexport default () => {  self.onmessage =     const data = message.data;    if (!(data instanceof ImageBitmap)) {      throw new Error('Received unknown data')    }    // OffscreenCanvas can be set up inside workers    const canvas = new OffscreenCanvas(data.width, data.height);    const ctx = canvas.getContext("2d");    if (!ctx) {      throw new Error(`Can't get 2D context`);    }    ctx.drawImage(data, 0, 0);    // That will block execution inside worker for     // a couple of seconds    doHardRenderingStuffHere(ctx, data.width, data.height);    // Sending resulting image back to main thread    createImageBitmap(canvas).then=> {      self.postMessage(image, { transfer: [image] });    });  };};
btw, have a nice day
(2018 - 2024) muerwre
+

Rendering Without Blocking In A Worker

Rendering items on #canvas in main loop might cause interface freezes, preventing render process from executing properly by flooding execution stack with operations.

To handle it properly, we can start separate #worker thread, that will handle rendering in its own event loop, so that won't affect the source tab's event loop.

Workers can have access to Transferrable Objects from main thread by receiving memory address. That's a lot faster than cloning. In this case ImageBitmap is transferrable.

Code for the main thread component:

// main.tsconst instance = new Worker('./render-worker.ts');const canvas = document.getElementById('view');// attaching event listener to workerinstance.onmessage =: MessageEvent) => {    const ctx = canvas?.getContext("2d");    if (!ctx) {        throw new Error(`Can't get 2D context`);    }        ctx.drawImage(event.data as ImageBitmap, 0, 0);}// sending canvas contents to workerconst renderInCanvas = () => {    if (!canvas.current) {      return;    }        createImageBitmap(canvas.current).then        instance.postMessage(image, { transfer: [image] })    });};

Worker code:

// render-worker.tsexport default () => {  self.onmessage =     const data = message.data;    if (!(data instanceof ImageBitmap)) {      throw new Error('Received unknown data')    }    // OffscreenCanvas can be set up inside workers    const canvas = new OffscreenCanvas(data.width, data.height);    const ctx = canvas.getContext("2d");    if (!ctx) {      throw new Error(`Can't get 2D context`);    }    ctx.drawImage(data, 0, 0);    // That will block execution inside worker for     // a couple of seconds    doHardRenderingStuffHere(ctx, data.width, data.height);    // Sending resulting image back to main thread    createImageBitmap(canvas).then=> {      self.postMessage(image, { transfer: [image] });    });  };};
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/frontend/webgl/vertex-shaders/_payload.js b/docs/frontend/webgl/vertex-shaders/_payload.js index 0b5ea90..c0c8cd0 100644 --- a/docs/frontend/webgl/vertex-shaders/_payload.js +++ b/docs/frontend/webgl/vertex-shaders/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:x,_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:r,_path:N}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-AJXcBpscEK":{_path:N,_dir:"webgl",_draft:y,_partial:y,_locale:"en",_empty:y,title:r,description:"Read Basics of WebGL (Drawing a Cube) first.",excerpt:{type:O,children:[{type:a,tag:f,props:{},children:[{type:b,value:P},{type:a,tag:h,props:{href:Q},children:[{type:b,value:R}]},{type:b,value:S}]},{type:a,tag:f,props:{},children:[{type:a,tag:T,props:{},children:[{type:b,value:r}]},{type:b,value:U},{type:a,tag:g,props:{},children:[{type:b,value:z}]},{type:b,value:V}]},{type:a,tag:k,props:{id:A},children:[{type:b,value:B}]},{type:a,tag:s,props:{code:C,language:W},children:[{type:a,tag:X,props:{},children:[{type:a,tag:s,props:{__ignoreMap:D},children:[{type:b,value:C}]}]}]},{type:a,tag:k,props:{id:E},children:[{type:b,value:F}]},{type:a,tag:f,props:{},children:[{type:b,value:Y},{type:a,tag:g,props:{},children:[{type:b,value:Z}]},{type:b,value:G},{type:a,tag:h,props:{href:_,rel:[t]},children:[{type:b,value:$}]},{type:b,value:aa}]},{type:a,tag:f,props:{},children:[{type:b,value:ab}]},{type:a,tag:ac,props:{},children:[{type:a,tag:l,props:{},children:[{type:a,tag:g,props:{},children:[{type:b,value:ad}]},{type:b,value:ae}]},{type:a,tag:l,props:{},children:[{type:a,tag:g,props:{},children:[{type:b,value:af}]},{type:b,value:ag}]},{type:a,tag:l,props:{},children:[{type:a,tag:g,props:{},children:[{type:b,value:ah}]},{type:b,value:ai},{type:a,tag:h,props:{href:aj},children:[{type:b,value:x}]},{type:b,value:u}]}]},{type:a,tag:k,props:{id:H},children:[{type:b,value:I}]},{type:a,tag:f,props:{},children:[{type:b,value:ak},{type:a,tag:g,props:{},children:[{type:b,value:al}]},{type:b,value:am},{type:a,tag:g,props:{},children:[{type:b,value:an}]},{type:b,value:ao}]},{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{className:[m]},children:[{type:b,value:ap}]},{type:b,value:aq},{type:a,tag:c,props:{className:[m]},children:[{type:b,value:ar}]},{type:b,value:as},{type:a,tag:c,props:{className:[m]},children:[{type:b,value:at}]},{type:b,value:au}]},{type:a,tag:f,props:{},children:[{type:b,value:av},{type:a,tag:h,props:{href:aw,rel:[t]},children:[{type:b,value:ax}]},{type:b,value:u}]}]},body:{type:O,children:[{type:a,tag:f,props:{},children:[{type:b,value:P},{type:a,tag:h,props:{href:Q},children:[{type:b,value:R}]},{type:b,value:S}]},{type:a,tag:f,props:{},children:[{type:a,tag:T,props:{},children:[{type:b,value:r}]},{type:b,value:U},{type:a,tag:g,props:{},children:[{type:b,value:z}]},{type:b,value:V}]},{type:a,tag:k,props:{id:A},children:[{type:b,value:B}]},{type:a,tag:s,props:{code:C,language:W},children:[{type:a,tag:X,props:{},children:[{type:a,tag:s,props:{__ignoreMap:D},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:i},children:[{type:b,value:"\u002F\u002F current vertice position {x,y,z,w}"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"attribute vec4 aVertexPosition;"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:i},children:[{type:b,value:"\u002F\u002F final vertice position with all transformations applied,"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:i},children:[{type:b,value:"\u002F\u002F that will be passed to Fragment Shader"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"varying vec4 v_positionWithOffset;"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:i},children:[{type:b,value:"\u002F\u002F Parameters passed from Javascript loop"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ay}]},{type:a,tag:c,props:{class:J},children:[{type:b,value:az}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" slide;"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ay}]},{type:a,tag:c,props:{class:J},children:[{type:b,value:az}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" aspect;"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:J},children:[{type:b,value:"void"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:G}]},{type:a,tag:c,props:{class:n},children:[{type:b,value:"main"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"(){"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:"\u002F\u002F float array of 4 elements, same as [slide,slide,slide,1]"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" vec4 scale"}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:n},children:[{type:b,value:K}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:n},children:[{type:b,value:aA}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"(slide),"}]},{type:a,tag:c,props:{class:o},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:aB}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:"\u002F\u002F float array of 4 elements, same as [aspect,1,1,1]"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" vec4 aspectRatioFix"}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:n},children:[{type:b,value:K}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"(aspect,"}]},{type:a,tag:c,props:{class:n},children:[{type:b,value:aA}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:o},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"));"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:"\u002F\u002F vertice position, multiplied with matrices of scale and aspect ratio"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" gl_Position"}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"aVertexPosition"}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:aC}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"scale"}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:aC}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"aspectRatioFix,"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:"\u002F\u002F vertice offset, that will be passed to fragment shader"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" v_positionWithOffset"}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:z}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"+"}]},{type:a,tag:c,props:{class:n},children:[{type:b,value:K}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:o},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:M}]},{type:a,tag:c,props:{class:o},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:M}]},{type:a,tag:c,props:{class:o},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:M}]},{type:a,tag:c,props:{class:o},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:aB}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"}"}]}]}]}]}]},{type:a,tag:k,props:{id:E},children:[{type:b,value:F}]},{type:a,tag:f,props:{},children:[{type:b,value:Y},{type:a,tag:g,props:{},children:[{type:b,value:Z}]},{type:b,value:G},{type:a,tag:h,props:{href:_,rel:[t]},children:[{type:b,value:$}]},{type:b,value:aa}]},{type:a,tag:f,props:{},children:[{type:b,value:ab}]},{type:a,tag:ac,props:{},children:[{type:a,tag:l,props:{},children:[{type:a,tag:g,props:{},children:[{type:b,value:ad}]},{type:b,value:ae}]},{type:a,tag:l,props:{},children:[{type:a,tag:g,props:{},children:[{type:b,value:af}]},{type:b,value:ag}]},{type:a,tag:l,props:{},children:[{type:a,tag:g,props:{},children:[{type:b,value:ah}]},{type:b,value:ai},{type:a,tag:h,props:{href:aj},children:[{type:b,value:x}]},{type:b,value:u}]}]},{type:a,tag:k,props:{id:H},children:[{type:b,value:I}]},{type:a,tag:f,props:{},children:[{type:b,value:ak},{type:a,tag:g,props:{},children:[{type:b,value:al}]},{type:b,value:am},{type:a,tag:g,props:{},children:[{type:b,value:an}]},{type:b,value:ao}]},{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{className:[m]},children:[{type:b,value:ap}]},{type:b,value:aq},{type:a,tag:c,props:{className:[m]},children:[{type:b,value:ar}]},{type:b,value:as},{type:a,tag:c,props:{className:[m]},children:[{type:b,value:at}]},{type:b,value:au}]},{type:a,tag:f,props:{},children:[{type:b,value:av},{type:a,tag:h,props:{href:aw,rel:[t]},children:[{type:b,value:ax}]},{type:b,value:u}]},{type:a,tag:"style",children:[{type:b,value:".ct-7127b1{color:#79C0FF}.ct-f84901{color:#FF7B72}.ct-70d7f8{color:#D2A8FF}.ct-54d8a4{color:#FF7B72}.ct-1e0bf5{color:#C9D1D9}.ct-71fa9c{color:#8B949E}.light .ct-71fa9c{color:#93A1A1}.light .ct-1e0bf5{color:#657B83}.light .ct-54d8a4{color:#073642}.light .ct-70d7f8{color:#268BD2}.light .ct-f84901{color:#859900}.light .ct-7127b1{color:#D33682}"}]}],toc:{title:D,searchDepth:q,depth:q,links:[{id:A,depth:q,text:B},{id:E,depth:q,text:F},{id:H,depth:q,text:I}]}},_type:"markdown",_id:"content:Frontend:WebGL:Vertex Shaders.md",_source:"content",_file:"Frontend\u002FWebGL\u002FVertex Shaders.md",_extension:"md"}},prerenderedAt:1711020227517}}("element","text","span","ct-1e0bf5","line","p","code-inline","a","ct-71fa9c","ct-f84901","h2","li","highlight","ct-70d7f8","ct-7127b1","1",2,"Vertex Shaders","code","nofollow","."," ","=","Fragment Shaders",false,"gl_Position","sample-code","Sample code","\u002F\u002F current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n\u002F\u002F final vertice position with all transformations applied,\n\u002F\u002F that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n\u002F\u002F Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n \u002F\u002F float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n \u002F\u002F float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n \u002F\u002F vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n \u002F\u002F vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n","","passing-parameters-to-vertexshader","Passing parameters to VertexShader"," ","applying-transformations","Applying transformations","ct-54d8a4","vec4","(",",","\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders","root","Read ","Basics%20of%20WebGL%20(Drawing%20a%20Cube)","Basics of WebGL (Drawing a Cube)"," first.","strong"," define vertice positions in 3D-space. That's just a function, that defines "," value by applying different transformations to it.","c","pre","Search for ","Uniforms","https:\u002F\u002Fopen.gl\u002Fdrawing","at open.gl"," for further reading.","There're 3 ways to pass parameters.","ul","attribute"," are parameters, that won't change. Good for vertex buffers.","uniform"," are meant to change over the time. Good for passing transformations.","varying"," are parameters, that's shared between Vertex and ","Fragment%20Shaders","Every vertice position is defined as ","{x,y,z,w}",", where ","w"," is a common denominator, that's used to achieve fast coord transformations by multiplying number of square matrices with original vertice coordinates.","We don't change vertice position buffer",", because it's slow when being run inside Javascript loop, we ","pass transformation matrices"," instead and ","multiply vertice positions with transformation matrices"," inside a Graphic Card's GPU, because that's what GPU made for.","Good explanation can be found here: ","https:\u002F\u002Fopen.gl\u002Ftransformations","open.gl","uniform ","float","vec3",");","*")) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:x,_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:r,_path:N}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-AJXcBpscEK":{_path:N,_dir:"webgl",_draft:y,_partial:y,_locale:"en",_empty:y,title:r,description:"Read Basics of WebGL (Drawing a Cube) first.",excerpt:{type:O,children:[{type:a,tag:f,props:{},children:[{type:b,value:P},{type:a,tag:h,props:{href:Q},children:[{type:b,value:R}]},{type:b,value:S}]},{type:a,tag:f,props:{},children:[{type:a,tag:T,props:{},children:[{type:b,value:r}]},{type:b,value:U},{type:a,tag:g,props:{},children:[{type:b,value:z}]},{type:b,value:V}]},{type:a,tag:k,props:{id:A},children:[{type:b,value:B}]},{type:a,tag:s,props:{code:C,language:W},children:[{type:a,tag:X,props:{},children:[{type:a,tag:s,props:{__ignoreMap:D},children:[{type:b,value:C}]}]}]},{type:a,tag:k,props:{id:E},children:[{type:b,value:F}]},{type:a,tag:f,props:{},children:[{type:b,value:Y},{type:a,tag:g,props:{},children:[{type:b,value:Z}]},{type:b,value:G},{type:a,tag:h,props:{href:_,rel:[t]},children:[{type:b,value:$}]},{type:b,value:aa}]},{type:a,tag:f,props:{},children:[{type:b,value:ab}]},{type:a,tag:ac,props:{},children:[{type:a,tag:l,props:{},children:[{type:a,tag:g,props:{},children:[{type:b,value:ad}]},{type:b,value:ae}]},{type:a,tag:l,props:{},children:[{type:a,tag:g,props:{},children:[{type:b,value:af}]},{type:b,value:ag}]},{type:a,tag:l,props:{},children:[{type:a,tag:g,props:{},children:[{type:b,value:ah}]},{type:b,value:ai},{type:a,tag:h,props:{href:aj},children:[{type:b,value:x}]},{type:b,value:u}]}]},{type:a,tag:k,props:{id:H},children:[{type:b,value:I}]},{type:a,tag:f,props:{},children:[{type:b,value:ak},{type:a,tag:g,props:{},children:[{type:b,value:al}]},{type:b,value:am},{type:a,tag:g,props:{},children:[{type:b,value:an}]},{type:b,value:ao}]},{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{className:[m]},children:[{type:b,value:ap}]},{type:b,value:aq},{type:a,tag:c,props:{className:[m]},children:[{type:b,value:ar}]},{type:b,value:as},{type:a,tag:c,props:{className:[m]},children:[{type:b,value:at}]},{type:b,value:au}]},{type:a,tag:f,props:{},children:[{type:b,value:av},{type:a,tag:h,props:{href:aw,rel:[t]},children:[{type:b,value:ax}]},{type:b,value:u}]}]},body:{type:O,children:[{type:a,tag:f,props:{},children:[{type:b,value:P},{type:a,tag:h,props:{href:Q},children:[{type:b,value:R}]},{type:b,value:S}]},{type:a,tag:f,props:{},children:[{type:a,tag:T,props:{},children:[{type:b,value:r}]},{type:b,value:U},{type:a,tag:g,props:{},children:[{type:b,value:z}]},{type:b,value:V}]},{type:a,tag:k,props:{id:A},children:[{type:b,value:B}]},{type:a,tag:s,props:{code:C,language:W},children:[{type:a,tag:X,props:{},children:[{type:a,tag:s,props:{__ignoreMap:D},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:i},children:[{type:b,value:"\u002F\u002F current vertice position {x,y,z,w}"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"attribute vec4 aVertexPosition;"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:i},children:[{type:b,value:"\u002F\u002F final vertice position with all transformations applied,"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:i},children:[{type:b,value:"\u002F\u002F that will be passed to Fragment Shader"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"varying vec4 v_positionWithOffset;"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:i},children:[{type:b,value:"\u002F\u002F Parameters passed from Javascript loop"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ay}]},{type:a,tag:c,props:{class:J},children:[{type:b,value:az}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" slide;"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:ay}]},{type:a,tag:c,props:{class:J},children:[{type:b,value:az}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" aspect;"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:J},children:[{type:b,value:"void"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:G}]},{type:a,tag:c,props:{class:n},children:[{type:b,value:"main"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"(){"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:"\u002F\u002F float array of 4 elements, same as [slide,slide,slide,1]"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" vec4 scale"}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:n},children:[{type:b,value:K}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:n},children:[{type:b,value:aA}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"(slide),"}]},{type:a,tag:c,props:{class:o},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:aB}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:"\u002F\u002F float array of 4 elements, same as [aspect,1,1,1]"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" vec4 aspectRatioFix"}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:n},children:[{type:b,value:K}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"(aspect,"}]},{type:a,tag:c,props:{class:n},children:[{type:b,value:aA}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:o},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"));"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:"\u002F\u002F vertice position, multiplied with matrices of scale and aspect ratio"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" gl_Position"}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"aVertexPosition"}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:aC}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"scale"}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:aC}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"aspectRatioFix,"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:"\u002F\u002F vertice offset, that will be passed to fragment shader"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" v_positionWithOffset"}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:w}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:z}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"+"}]},{type:a,tag:c,props:{class:n},children:[{type:b,value:K}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:o},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:M}]},{type:a,tag:c,props:{class:o},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:M}]},{type:a,tag:c,props:{class:o},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:M}]},{type:a,tag:c,props:{class:o},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:aB}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"}"}]}]}]}]}]},{type:a,tag:k,props:{id:E},children:[{type:b,value:F}]},{type:a,tag:f,props:{},children:[{type:b,value:Y},{type:a,tag:g,props:{},children:[{type:b,value:Z}]},{type:b,value:G},{type:a,tag:h,props:{href:_,rel:[t]},children:[{type:b,value:$}]},{type:b,value:aa}]},{type:a,tag:f,props:{},children:[{type:b,value:ab}]},{type:a,tag:ac,props:{},children:[{type:a,tag:l,props:{},children:[{type:a,tag:g,props:{},children:[{type:b,value:ad}]},{type:b,value:ae}]},{type:a,tag:l,props:{},children:[{type:a,tag:g,props:{},children:[{type:b,value:af}]},{type:b,value:ag}]},{type:a,tag:l,props:{},children:[{type:a,tag:g,props:{},children:[{type:b,value:ah}]},{type:b,value:ai},{type:a,tag:h,props:{href:aj},children:[{type:b,value:x}]},{type:b,value:u}]}]},{type:a,tag:k,props:{id:H},children:[{type:b,value:I}]},{type:a,tag:f,props:{},children:[{type:b,value:ak},{type:a,tag:g,props:{},children:[{type:b,value:al}]},{type:b,value:am},{type:a,tag:g,props:{},children:[{type:b,value:an}]},{type:b,value:ao}]},{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{className:[m]},children:[{type:b,value:ap}]},{type:b,value:aq},{type:a,tag:c,props:{className:[m]},children:[{type:b,value:ar}]},{type:b,value:as},{type:a,tag:c,props:{className:[m]},children:[{type:b,value:at}]},{type:b,value:au}]},{type:a,tag:f,props:{},children:[{type:b,value:av},{type:a,tag:h,props:{href:aw,rel:[t]},children:[{type:b,value:ax}]},{type:b,value:u}]},{type:a,tag:"style",children:[{type:b,value:".ct-f1b75a{color:#79C0FF}.ct-c6b3e4{color:#FF7B72}.ct-43f728{color:#D2A8FF}.ct-b79326{color:#FF7B72}.ct-c1002a{color:#C9D1D9}.ct-22b8af{color:#8B949E}.light .ct-22b8af{color:#93A1A1}.light .ct-c1002a{color:#657B83}.light .ct-b79326{color:#073642}.light .ct-43f728{color:#268BD2}.light .ct-c6b3e4{color:#859900}.light .ct-f1b75a{color:#D33682}"}]}],toc:{title:D,searchDepth:q,depth:q,links:[{id:A,depth:q,text:B},{id:E,depth:q,text:F},{id:H,depth:q,text:I}]}},_type:"markdown",_id:"content:Frontend:WebGL:Vertex Shaders.md",_source:"content",_file:"Frontend\u002FWebGL\u002FVertex Shaders.md",_extension:"md"}},prerenderedAt:1711020861711}}("element","text","span","ct-c1002a","line","p","code-inline","a","ct-22b8af","ct-c6b3e4","h2","li","highlight","ct-43f728","ct-f1b75a","1",2,"Vertex Shaders","code","nofollow","."," ","=","Fragment Shaders",false,"gl_Position","sample-code","Sample code","\u002F\u002F current vertice position {x,y,z,w}\nattribute vec4 aVertexPosition;\n\u002F\u002F final vertice position with all transformations applied,\n\u002F\u002F that will be passed to Fragment Shader\nvarying vec4 v_positionWithOffset;\n\u002F\u002F Parameters passed from Javascript loop\nuniform float slide;\nuniform float aspect;\n\nvoid main(){\n \u002F\u002F float array of 4 elements, same as [slide,slide,slide,1]\n vec4 scale=vec4(vec3(slide),1);\n \u002F\u002F float array of 4 elements, same as [aspect,1,1,1]\n vec4 aspectRatioFix=vec4(aspect,vec3(1));\n \u002F\u002F vertice position, multiplied with matrices of scale and aspect ratio\n gl_Position=aVertexPosition*scale*aspectRatioFix,\n \u002F\u002F vertice offset, that will be passed to fragment shader\n v_positionWithOffset=gl_Position+vec4(1,1,1,1);\n}\n","","passing-parameters-to-vertexshader","Passing parameters to VertexShader"," ","applying-transformations","Applying transformations","ct-b79326","vec4","(",",","\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders","root","Read ","Basics%20of%20WebGL%20(Drawing%20a%20Cube)","Basics of WebGL (Drawing a Cube)"," first.","strong"," define vertice positions in 3D-space. That's just a function, that defines "," value by applying different transformations to it.","c","pre","Search for ","Uniforms","https:\u002F\u002Fopen.gl\u002Fdrawing","at open.gl"," for further reading.","There're 3 ways to pass parameters.","ul","attribute"," are parameters, that won't change. Good for vertex buffers.","uniform"," are meant to change over the time. Good for passing transformations.","varying"," are parameters, that's shared between Vertex and ","Fragment%20Shaders","Every vertice position is defined as ","{x,y,z,w}",", where ","w"," is a common denominator, that's used to achieve fast coord transformations by multiplying number of square matrices with original vertice coordinates.","We don't change vertice position buffer",", because it's slow when being run inside Javascript loop, we ","pass transformation matrices"," instead and ","multiply vertice positions with transformation matrices"," inside a Graphic Card's GPU, because that's what GPU made for.","Good explanation can be found here: ","https:\u002F\u002Fopen.gl\u002Ftransformations","open.gl","uniform ","float","vec3",");","*")) \ No newline at end of file diff --git a/docs/frontend/webgl/vertex-shaders/index.html b/docs/frontend/webgl/vertex-shaders/index.html index f35a637..a9fd13d 100644 --- a/docs/frontend/webgl/vertex-shaders/index.html +++ b/docs/frontend/webgl/vertex-shaders/index.html @@ -1,6 +1,6 @@ -Vertex Shaders • Obsidian Garden -

Vertex Shaders

Read Basics of WebGL (Drawing a Cube) first.

Vertex Shaders define vertice positions in 3D-space. That's just a function, that defines gl_Position value by applying different transformations to it.

Sample code

// current vertice position {x,y,z,w}attribute vec4 aVertexPosition;// final vertice position with all transformations applied,// that will be passed to Fragment Shadervarying vec4 v_positionWithOffset;// Parameters passed from Javascript loopuniform float slide;uniform float aspect;void main(){  // float array of 4 elements, same as [slide,slide,slide,1]  vec4 scale=vec4(vec3(slide),1);  // float array of 4 elements, same as [aspect,1,1,1]  vec4 aspectRatioFix=vec4(aspect,vec3(1));  // vertice position, multiplied with matrices of scale and aspect ratio  gl_Position=aVertexPosition*scale*aspectRatioFix,  // vertice offset, that will be passed to fragment shader  v_positionWithOffset=gl_Position+vec4(1,1,1,1);}

Passing parameters to VertexShader

Search for Uniforms at open.gl for further reading.

There're 3 ways to pass parameters.

  • attribute are parameters, that won't change. Good for vertex buffers.
  • uniform are meant to change over the time. Good for passing transformations.
  • varying are parameters, that's shared between Vertex and Fragment Shaders.

Applying transformations

Every vertice position is defined as {x,y,z,w}, where w is a common denominator, that's used to achieve fast coord transformations by multiplying number of square matrices with original vertice coordinates.

We don't change vertice position buffer, because it's slow when being run inside Javascript loop, we pass transformation matrices instead and multiply vertice positions with transformation matrices inside a Graphic Card's GPU, because that's what GPU made for.

Good explanation can be found here: open.gl.

btw, have a nice day
(2018 - 2024) muerwre
+

Vertex Shaders

Read Basics of WebGL (Drawing a Cube) first.

Vertex Shaders define vertice positions in 3D-space. That's just a function, that defines gl_Position value by applying different transformations to it.

Sample code

// current vertice position {x,y,z,w}attribute vec4 aVertexPosition;// final vertice position with all transformations applied,// that will be passed to Fragment Shadervarying vec4 v_positionWithOffset;// Parameters passed from Javascript loopuniform float slide;uniform float aspect;void main(){  // float array of 4 elements, same as [slide,slide,slide,1]  vec4 scale=vec4(vec3(slide),1);  // float array of 4 elements, same as [aspect,1,1,1]  vec4 aspectRatioFix=vec4(aspect,vec3(1));  // vertice position, multiplied with matrices of scale and aspect ratio  gl_Position=aVertexPosition*scale*aspectRatioFix,  // vertice offset, that will be passed to fragment shader  v_positionWithOffset=gl_Position+vec4(1,1,1,1);}

Passing parameters to VertexShader

Search for Uniforms at open.gl for further reading.

There're 3 ways to pass parameters.

  • attribute are parameters, that won't change. Good for vertex buffers.
  • uniform are meant to change over the time. Good for passing transformations.
  • varying are parameters, that's shared between Vertex and Fragment Shaders.

Applying transformations

Every vertice position is defined as {x,y,z,w}, where w is a common denominator, that's used to achieve fast coord transformations by multiplying number of square matrices with original vertice coordinates.

We don't change vertice position buffer, because it's slow when being run inside Javascript loop, we pass transformation matrices instead and multiply vertice positions with transformation matrices inside a Graphic Card's GPU, because that's what GPU made for.

Good explanation can be found here: open.gl.

btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/git/force-git-to-use-https/_payload.js b/docs/git/force-git-to-use-https/_payload.js index 58001df..5ea992f 100644 --- a/docs/git/force-git-to-use-https/_payload.js +++ b/docs/git/force-git-to-use-https/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:k,_path:l},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-atqGqeweL2":{_path:l,_dir:"git",_draft:g,_partial:g,_locale:"en",_empty:g,title:k,description:h,excerpt:{type:m,children:[{type:a,tag:d,props:{},children:[{type:b,value:h}]},{type:a,tag:d,props:{},children:[{type:b,value:n},{type:a,tag:o,props:{},children:[{type:b,value:p}]},{type:b,value:q}]},{type:a,tag:e,props:{code:i,language:r},children:[{type:a,tag:s,props:{},children:[{type:a,tag:e,props:{__ignoreMap:j},children:[{type:b,value:i}]}]}]}]},body:{type:m,children:[{type:a,tag:d,props:{},children:[{type:b,value:h}]},{type:a,tag:d,props:{},children:[{type:b,value:n},{type:a,tag:o,props:{},children:[{type:b,value:p}]},{type:b,value:q}]},{type:a,tag:e,props:{code:i,language:r},children:[{type:a,tag:s,props:{},children:[{type:a,tag:e,props:{__ignoreMap:j},children:[{type:a,tag:c,props:{class:t},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"[url "}]},{type:a,tag:c,props:{class:"ct-67f284"},children:[{type:b,value:"\"https:\u002F\u002Fgithub.com\""}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"]"}]}]},{type:a,tag:c,props:{class:t},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:" insteadOf "}]},{type:a,tag:c,props:{class:"ct-75a348"},children:[{type:b,value:"="}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:" git:"}]},{type:a,tag:c,props:{class:"ct-17e9d4"},children:[{type:b,value:"\u002F\u002Fgithub.com"}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-17e9d4{color:#8B949E}.ct-75a348{color:#FF7B72}.ct-67f284{color:#A5D6FF}.ct-2aa28a{color:#C9D1D9}.light .ct-2aa28a{color:#657B83}.light .ct-67f284{color:#2AA198}.light .ct-75a348{color:#859900}.light .ct-17e9d4{color:#93A1A1}"}]}],toc:{title:j,searchDepth:u,depth:u,links:[]}},_type:"markdown",_id:"content:Git:Force git to use HTTPS.md",_source:"content",_file:"Git\u002FForce git to use HTTPS.md",_extension:"md"}},prerenderedAt:1711020227538}}("element","text","span","p","code","ct-2aa28a",false,"Forces #git to use https even if remote url is #SSH. Useful for the networks with blocked #ssh protocol.","[url \"https:\u002F\u002Fgithub.com\"]\n insteadOf = git:\u002F\u002Fgithub.com\n","","Force Git To Use HTTPS","\u002Fgit\u002Fforce-git-to-use-https","root","Put this inside your ","code-inline","~\u002F.gitconfig",":","c","pre","line",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:k,_path:l},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-atqGqeweL2":{_path:l,_dir:"git",_draft:g,_partial:g,_locale:"en",_empty:g,title:k,description:h,excerpt:{type:m,children:[{type:a,tag:d,props:{},children:[{type:b,value:h}]},{type:a,tag:d,props:{},children:[{type:b,value:n},{type:a,tag:o,props:{},children:[{type:b,value:p}]},{type:b,value:q}]},{type:a,tag:e,props:{code:i,language:r},children:[{type:a,tag:s,props:{},children:[{type:a,tag:e,props:{__ignoreMap:j},children:[{type:b,value:i}]}]}]}]},body:{type:m,children:[{type:a,tag:d,props:{},children:[{type:b,value:h}]},{type:a,tag:d,props:{},children:[{type:b,value:n},{type:a,tag:o,props:{},children:[{type:b,value:p}]},{type:b,value:q}]},{type:a,tag:e,props:{code:i,language:r},children:[{type:a,tag:s,props:{},children:[{type:a,tag:e,props:{__ignoreMap:j},children:[{type:a,tag:c,props:{class:t},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"[url "}]},{type:a,tag:c,props:{class:"ct-22e710"},children:[{type:b,value:"\"https:\u002F\u002Fgithub.com\""}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"]"}]}]},{type:a,tag:c,props:{class:t},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:" insteadOf "}]},{type:a,tag:c,props:{class:"ct-ea4b0a"},children:[{type:b,value:"="}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:" git:"}]},{type:a,tag:c,props:{class:"ct-a22a26"},children:[{type:b,value:"\u002F\u002Fgithub.com"}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-a22a26{color:#8B949E}.ct-ea4b0a{color:#FF7B72}.ct-22e710{color:#A5D6FF}.ct-fbd0e3{color:#C9D1D9}.light .ct-fbd0e3{color:#657B83}.light .ct-22e710{color:#2AA198}.light .ct-ea4b0a{color:#859900}.light .ct-a22a26{color:#93A1A1}"}]}],toc:{title:j,searchDepth:u,depth:u,links:[]}},_type:"markdown",_id:"content:Git:Force git to use HTTPS.md",_source:"content",_file:"Git\u002FForce git to use HTTPS.md",_extension:"md"}},prerenderedAt:1711020861756}}("element","text","span","p","code","ct-fbd0e3",false,"Forces #git to use https even if remote url is #SSH. Useful for the networks with blocked #ssh protocol.","[url \"https:\u002F\u002Fgithub.com\"]\n insteadOf = git:\u002F\u002Fgithub.com\n","","Force Git To Use HTTPS","\u002Fgit\u002Fforce-git-to-use-https","root","Put this inside your ","code-inline","~\u002F.gitconfig",":","c","pre","line",2)) \ No newline at end of file diff --git a/docs/git/force-git-to-use-https/index.html b/docs/git/force-git-to-use-https/index.html index bbcb79b..9b1dce8 100644 --- a/docs/git/force-git-to-use-https/index.html +++ b/docs/git/force-git-to-use-https/index.html @@ -1,6 +1,6 @@ -Force Git To Use HTTPS • Obsidian Garden -

Force Git To Use HTTPS

Forces #git to use https even if remote url is #SSH. Useful for the networks with blocked #ssh protocol.

Put this inside your ~/.gitconfig:

[url "https://github.com"]    insteadOf = git://github.com
btw, have a nice day
(2018 - 2024) muerwre
+

Force Git To Use HTTPS

Forces #git to use https even if remote url is #SSH. Useful for the networks with blocked #ssh protocol.

Put this inside your ~/.gitconfig:

[url "https://github.com"]    insteadOf = git://github.com
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/git/git-aliases-and-useful-commands/_payload.js b/docs/git/git-aliases-and-useful-commands/_payload.js index aa6e964..f3773f9 100644 --- a/docs/git/git-aliases-and-useful-commands/_payload.js +++ b/docs/git/git-aliases-and-useful-commands/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:t,_path:u}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-VrJO0uSyzq":{_path:u,_dir:"git",_draft:q,_partial:q,_locale:"en",_empty:q,title:t,description:"Shorthands for #git commands can be specified. Should be placed at ~\u002F.gitconfig.",excerpt:{type:v,children:[{type:a,tag:w,props:{},children:[{type:b,value:x},{type:a,tag:h,props:{},children:[{type:b,value:y}]},{type:b,value:z}]},{type:a,tag:n,props:{code:r,language:A},children:[{type:a,tag:B,props:{},children:[{type:a,tag:n,props:{__ignoreMap:s},children:[{type:b,value:r}]}]}]},{type:a,tag:C,props:{},children:[{type:a,tag:D,props:{},children:[{type:a,tag:i,props:{},children:[{type:a,tag:o,props:{align:e},children:[{type:a,tag:p,props:{},children:[{type:b,value:E}]}]},{type:a,tag:o,props:{align:e},children:[{type:a,tag:p,props:{},children:[{type:b,value:F}]}]}]}]},{type:a,tag:G,props:{},children:[{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:H}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:I}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:J}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:K}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:L}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:M}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:N}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:O}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:P}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:Q}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:R}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:S}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:T}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:U}]}]}]}]}]},body:{type:v,children:[{type:a,tag:w,props:{},children:[{type:b,value:x},{type:a,tag:h,props:{},children:[{type:b,value:y}]},{type:b,value:z}]},{type:a,tag:n,props:{code:r,language:A},children:[{type:a,tag:B,props:{},children:[{type:a,tag:n,props:{__ignoreMap:s},children:[{type:a,tag:c,props:{class:k},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"[alias]"}]}]},{type:a,tag:c,props:{class:k},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" flush "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" git clean"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"branches branch "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:V}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" grep "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"v master "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:V}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" xargs git branch "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"D"}]}]},{type:a,tag:c,props:{class:k},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" lol "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" log "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"oneline "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"graph"}]}]},{type:a,tag:c,props:{class:k},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" l "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" lol"}]}]},{type:a,tag:c,props:{class:k},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" c "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:W}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:X}]}]},{type:a,tag:c,props:{class:k},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" cv "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:W}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"no"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"verify "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:X}]}]},{type:a,tag:c,props:{class:k},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" p "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" push"}]}]},{type:a,tag:c,props:{class:k},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" pf "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" p "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"force"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"with"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"lease"}]}]},{type:a,tag:c,props:{class:k},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" ignore"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"now "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" update"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"index "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"skip"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"worktree"}]}]}]}]}]},{type:a,tag:C,props:{},children:[{type:a,tag:D,props:{},children:[{type:a,tag:i,props:{},children:[{type:a,tag:o,props:{align:e},children:[{type:a,tag:p,props:{},children:[{type:b,value:E}]}]},{type:a,tag:o,props:{align:e},children:[{type:a,tag:p,props:{},children:[{type:b,value:F}]}]}]}]},{type:a,tag:G,props:{},children:[{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:H}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:I}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:J}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:K}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:L}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:M}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:N}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:O}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:P}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:Q}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:R}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:S}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:T}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:U}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-b24a9d{color:#FF7B72}.ct-29e270{color:#C9D1D9}.light .ct-29e270{color:#657B83}.light .ct-b24a9d{color:#859900}"}]}],toc:{title:s,searchDepth:Y,depth:Y,links:[]}},_type:"markdown",_id:"content:Git:Git aliases and useful commands.md",_source:"content",_file:"Git\u002FGit aliases and useful commands.md",_extension:"md"}},prerenderedAt:1711020227557}}("element","text","span","ct-29e270",null,"td","ct-b24a9d","code-inline","tr","-","line","=","--","code","th","strong",false,"[alias]\n flush = git clean-branches branch | grep -v master | xargs git branch -D\n lol = log --oneline --graph\n l = lol\n c = commit -am\n cv = commit --no-verify -am\n p = push\n pf = p --force-with-lease\n ignore-now = update-index --skip-worktree\n","","Git Aliases And Useful Commands","\u002Fgit\u002Fgit-aliases-and-useful-commands","root","p","Shorthands for #git commands can be specified. Should be placed at ","~\u002F.gitconfig",".","c","pre","table","thead","command","description","tbody","git flush","drops all branches, except master","git lol","shows log","git c","commits with message","git cv","commits without hooks","git p","pushes","git pf","push with --force and additional check","git ignore-now","starts ignoring file from now on","|"," commit ","am",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:t,_path:u}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-VrJO0uSyzq":{_path:u,_dir:"git",_draft:q,_partial:q,_locale:"en",_empty:q,title:t,description:"Shorthands for #git commands can be specified. Should be placed at ~\u002F.gitconfig.",excerpt:{type:v,children:[{type:a,tag:w,props:{},children:[{type:b,value:x},{type:a,tag:h,props:{},children:[{type:b,value:y}]},{type:b,value:z}]},{type:a,tag:n,props:{code:r,language:A},children:[{type:a,tag:B,props:{},children:[{type:a,tag:n,props:{__ignoreMap:s},children:[{type:b,value:r}]}]}]},{type:a,tag:C,props:{},children:[{type:a,tag:D,props:{},children:[{type:a,tag:i,props:{},children:[{type:a,tag:o,props:{align:e},children:[{type:a,tag:p,props:{},children:[{type:b,value:E}]}]},{type:a,tag:o,props:{align:e},children:[{type:a,tag:p,props:{},children:[{type:b,value:F}]}]}]}]},{type:a,tag:G,props:{},children:[{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:H}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:I}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:J}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:K}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:L}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:M}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:N}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:O}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:P}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:Q}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:R}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:S}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:T}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:U}]}]}]}]}]},body:{type:v,children:[{type:a,tag:w,props:{},children:[{type:b,value:x},{type:a,tag:h,props:{},children:[{type:b,value:y}]},{type:b,value:z}]},{type:a,tag:n,props:{code:r,language:A},children:[{type:a,tag:B,props:{},children:[{type:a,tag:n,props:{__ignoreMap:s},children:[{type:a,tag:c,props:{class:k},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"[alias]"}]}]},{type:a,tag:c,props:{class:k},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" flush "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" git clean"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"branches branch "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:V}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" grep "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"v master "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:V}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" xargs git branch "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"D"}]}]},{type:a,tag:c,props:{class:k},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" lol "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" log "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"oneline "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"graph"}]}]},{type:a,tag:c,props:{class:k},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" l "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" lol"}]}]},{type:a,tag:c,props:{class:k},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" c "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:W}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:X}]}]},{type:a,tag:c,props:{class:k},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" cv "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:W}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"no"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"verify "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:X}]}]},{type:a,tag:c,props:{class:k},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" p "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" push"}]}]},{type:a,tag:c,props:{class:k},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" pf "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" p "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"force"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"with"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"lease"}]}]},{type:a,tag:c,props:{class:k},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" ignore"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"now "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:l}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" update"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"index "}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:m}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"skip"}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:j}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"worktree"}]}]}]}]}]},{type:a,tag:C,props:{},children:[{type:a,tag:D,props:{},children:[{type:a,tag:i,props:{},children:[{type:a,tag:o,props:{align:e},children:[{type:a,tag:p,props:{},children:[{type:b,value:E}]}]},{type:a,tag:o,props:{align:e},children:[{type:a,tag:p,props:{},children:[{type:b,value:F}]}]}]}]},{type:a,tag:G,props:{},children:[{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:H}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:I}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:J}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:K}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:L}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:M}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:N}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:O}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:P}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:Q}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:R}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:S}]}]},{type:a,tag:i,props:{},children:[{type:a,tag:f,props:{align:e},children:[{type:a,tag:h,props:{},children:[{type:b,value:T}]}]},{type:a,tag:f,props:{align:e},children:[{type:b,value:U}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-da3bc5{color:#FF7B72}.ct-9b16eb{color:#C9D1D9}.light .ct-9b16eb{color:#657B83}.light .ct-da3bc5{color:#859900}"}]}],toc:{title:s,searchDepth:Y,depth:Y,links:[]}},_type:"markdown",_id:"content:Git:Git aliases and useful commands.md",_source:"content",_file:"Git\u002FGit aliases and useful commands.md",_extension:"md"}},prerenderedAt:1711020861783}}("element","text","span","ct-9b16eb",null,"td","ct-da3bc5","code-inline","tr","-","line","=","--","code","th","strong",false,"[alias]\n flush = git clean-branches branch | grep -v master | xargs git branch -D\n lol = log --oneline --graph\n l = lol\n c = commit -am\n cv = commit --no-verify -am\n p = push\n pf = p --force-with-lease\n ignore-now = update-index --skip-worktree\n","","Git Aliases And Useful Commands","\u002Fgit\u002Fgit-aliases-and-useful-commands","root","p","Shorthands for #git commands can be specified. Should be placed at ","~\u002F.gitconfig",".","c","pre","table","thead","command","description","tbody","git flush","drops all branches, except master","git lol","shows log","git c","commits with message","git cv","commits without hooks","git p","pushes","git pf","push with --force and additional check","git ignore-now","starts ignoring file from now on","|"," commit ","am",2)) \ No newline at end of file diff --git a/docs/git/git-aliases-and-useful-commands/index.html b/docs/git/git-aliases-and-useful-commands/index.html index 83b5746..56877e5 100644 --- a/docs/git/git-aliases-and-useful-commands/index.html +++ b/docs/git/git-aliases-and-useful-commands/index.html @@ -1,6 +1,6 @@ -Git Aliases And Useful Commands • Obsidian Garden -

Git Aliases And Useful Commands

Shorthands for #git commands can be specified. Should be placed at ~/.gitconfig.

[alias]    flush = git clean-branches branch | grep -v master | xargs git branch -D    lol = log --oneline --graph    l = lol    c = commit -am    cv = commit --no-verify -am    p = push    pf = p --force-with-lease    ignore-now = update-index --skip-worktree
commanddescription
git flushdrops all branches, except master
git lolshows log
git ccommits with message
git cvcommits without hooks
git ppushes
git pfpush with --force and additional check
git ignore-nowstarts ignoring file from now on
btw, have a nice day
(2018 - 2024) muerwre
+

Git Aliases And Useful Commands

Shorthands for #git commands can be specified. Should be placed at ~/.gitconfig.

[alias]    flush = git clean-branches branch | grep -v master | xargs git branch -D    lol = log --oneline --graph    l = lol    c = commit -am    cv = commit --no-verify -am    p = push    pf = p --force-with-lease    ignore-now = update-index --skip-worktree
commanddescription
git flushdrops all branches, except master
git lolshows log
git ccommits with message
git cvcommits without hooks
git ppushes
git pfpush with --force and additional check
git ignore-nowstarts ignoring file from now on
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/golang/i18n-in-golang/_payload.js b/docs/golang/i18n-in-golang/_payload.js index 5e5dfe2..70e5c87 100644 --- a/docs/golang/i18n-in-golang/_payload.js +++ b/docs/golang/i18n-in-golang/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC,aD,aE,aF,aG,aH,aI,aJ,aK,aL,aM,aN,aO,aP,aQ,aR,aS,aT,aU,aV,aW,aX,aY,aZ,a_,a$,ba,bb,bc,bd,be,bf,bg,bh,bi,bj,bk,bl,bm,bn,bo,bp,bq){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:V,_path:W}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-jPHqVKRuVS":{_path:W,_dir:"golang",_draft:I,_partial:I,_locale:"en",_empty:I,title:V,description:"There are no good examples of golang.org\u002Fx\u002Ftext uses and description of how pluralization made. So, this is it.",excerpt:{type:X,children:[{type:a,tag:i,props:{},children:[{type:b,value:Y},{type:a,tag:m,props:{href:Z,rel:[n]},children:[{type:b,value:_}]},{type:b,value:$}]},{type:a,tag:s,props:{id:aa},children:[{type:b,value:ab}]},{type:a,tag:ac,props:{},children:[{type:a,tag:i,props:{},children:[{type:b,value:ad},{type:a,tag:m,props:{href:ae,rel:[n]},children:[{type:b,value:af}]},{type:b,value:ag}]}]},{type:a,tag:i,props:{},children:[{type:b,value:ah}]},{type:a,tag:h,props:{code:J,language:w},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:b,value:J}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:ai},{type:a,tag:f,props:{},children:[{type:b,value:K}]},{type:b,value:aj}]},{type:a,tag:h,props:{code:L,language:x},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:b,value:L}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:ak},{type:a,tag:f,props:{},children:[{type:b,value:al}]},{type:b,value:am},{type:a,tag:f,props:{},children:[{type:b,value:an}]},{type:b,value:ao},{type:a,tag:f,props:{},children:[{type:b,value:ap}]},{type:b,value:y}]},{type:a,tag:s,props:{id:aq},children:[{type:b,value:ar}]},{type:a,tag:i,props:{},children:[{type:b,value:as},{type:a,tag:f,props:{},children:[{type:b,value:M}]},{type:b,value:at},{type:a,tag:f,props:{},children:[{type:b,value:au}]},{type:b,value:av},{type:a,tag:f,props:{},children:[{type:b,value:aw}]},{type:b,value:ax},{type:a,tag:f,props:{},children:[{type:b,value:ay}]},{type:b,value:az},{type:a,tag:c,props:{className:[aA]},children:[{type:b,value:aB}]},{type:b,value:aC},{type:a,tag:f,props:{},children:[{type:b,value:aD}]},{type:b,value:y}]},{type:a,tag:i,props:{},children:[{type:b,value:aE},{type:a,tag:m,props:{href:z,rel:[n]},children:[{type:b,value:aF}]},{type:b,value:aG}]},{type:a,tag:A,props:{},children:[{type:a,tag:t,props:{},children:[{type:a,tag:f,props:{},children:[{type:b,value:aH}]},{type:b,value:aI},{type:a,tag:f,props:{},children:[{type:b,value:aJ}]},{type:b,value:aK},{type:a,tag:f,props:{},children:[{type:b,value:aL}]},{type:b,value:aM}]},{type:a,tag:t,props:{},children:[{type:a,tag:f,props:{},children:[{type:b,value:aN}]},{type:b,value:p},{type:a,tag:f,props:{},children:[{type:b,value:aO}]},{type:b,value:p},{type:a,tag:f,props:{},children:[{type:b,value:aP}]},{type:b,value:p},{type:a,tag:f,props:{},children:[{type:b,value:aQ}]},{type:b,value:p},{type:a,tag:f,props:{},children:[{type:b,value:aR}]},{type:b,value:p},{type:a,tag:f,props:{},children:[{type:b,value:aS}]},{type:b,value:aT}]}]},{type:a,tag:h,props:{code:N,language:aU},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:b,value:N}]}]}]},{type:a,tag:s,props:{id:aV},children:[{type:b,value:aW}]},{type:a,tag:i,props:{},children:[{type:b,value:aX},{type:a,tag:f,props:{},children:[{type:b,value:aY}]},{type:b,value:aZ}]},{type:a,tag:h,props:{code:O,language:w},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:b,value:O}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:a_}]},{type:a,tag:h,props:{code:P,language:x},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:b,value:P}]}]}]},{type:a,tag:s,props:{id:a$},children:[{type:b,value:ba}]},{type:a,tag:A,props:{},children:[{type:a,tag:t,props:{},children:[{type:a,tag:m,props:{href:z,rel:[n]},children:[{type:b,value:bb}]}]},{type:a,tag:t,props:{},children:[{type:a,tag:m,props:{href:bc,rel:[n]},children:[{type:b,value:bd}]}]}]}]},body:{type:X,children:[{type:a,tag:i,props:{},children:[{type:b,value:Y},{type:a,tag:m,props:{href:Z,rel:[n]},children:[{type:b,value:_}]},{type:b,value:$}]},{type:a,tag:s,props:{id:aa},children:[{type:b,value:ab}]},{type:a,tag:ac,props:{},children:[{type:a,tag:i,props:{},children:[{type:b,value:ad},{type:a,tag:m,props:{href:ae,rel:[n]},children:[{type:b,value:af}]},{type:b,value:ag}]}]},{type:a,tag:i,props:{},children:[{type:b,value:ah}]},{type:a,tag:h,props:{code:J,language:w},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:B},children:[{type:b,value:"import"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" ("}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:be},children:[{type:b,value:Q}]},{type:a,tag:c,props:{class:C},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:bf},children:[{type:b,value:"golang.org\u002Fx\u002Ftext\u002Flanguage"}]},{type:a,tag:c,props:{class:C},children:[{type:b,value:v}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:be},children:[{type:b,value:Q}]},{type:a,tag:c,props:{class:C},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:bf},children:[{type:b,value:"golang.org\u002Fx\u002Ftext\u002Fmessage"}]},{type:a,tag:c,props:{class:C},children:[{type:b,value:v}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:bg}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:R},children:[{type:b,value:"lang"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:D}]},{type:a,tag:c,props:{class:B},children:[{type:b,value:S}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" language."}]},{type:a,tag:c,props:{class:T},children:[{type:b,value:"MustParse"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:bh}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:bi}]},{type:a,tag:c,props:{class:"ct-9e0b55"},children:[{type:b,value:K}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:bi}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:bg}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:R},children:[{type:b,value:"printer"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:D}]},{type:a,tag:c,props:{class:B},children:[{type:b,value:S}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" message."}]},{type:a,tag:c,props:{class:T},children:[{type:b,value:"NewPrinter"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"(lang)"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:R},children:[{type:b,value:"count"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:D}]},{type:a,tag:c,props:{class:B},children:[{type:b,value:S}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:D}]},{type:a,tag:c,props:{class:bj},children:[{type:b,value:bk}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"printer."}]},{type:a,tag:c,props:{class:T},children:[{type:b,value:"Sprintf"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:bh}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:"ct-f0c8ef"},children:[{type:b,value:"%d"}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:" butterflies\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:", count)"}]}]}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:ai},{type:a,tag:f,props:{},children:[{type:b,value:K}]},{type:b,value:aj}]},{type:a,tag:h,props:{code:L,language:x},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"gotext -srclang=en-GB update -lang=ru-RU \\"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" -out=translations.go github.com\u002Fpath\u002Fto-output-folder"}]}]}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:ak},{type:a,tag:f,props:{},children:[{type:b,value:al}]},{type:b,value:am},{type:a,tag:f,props:{},children:[{type:b,value:an}]},{type:b,value:ao},{type:a,tag:f,props:{},children:[{type:b,value:ap}]},{type:b,value:y}]},{type:a,tag:s,props:{id:aq},children:[{type:b,value:ar}]},{type:a,tag:i,props:{},children:[{type:b,value:as},{type:a,tag:f,props:{},children:[{type:b,value:M}]},{type:b,value:at},{type:a,tag:f,props:{},children:[{type:b,value:au}]},{type:b,value:av},{type:a,tag:f,props:{},children:[{type:b,value:aw}]},{type:b,value:ax},{type:a,tag:f,props:{},children:[{type:b,value:ay}]},{type:b,value:az},{type:a,tag:c,props:{className:[aA]},children:[{type:b,value:aB}]},{type:b,value:aC},{type:a,tag:f,props:{},children:[{type:b,value:aD}]},{type:b,value:y}]},{type:a,tag:i,props:{},children:[{type:b,value:aE},{type:a,tag:m,props:{href:z,rel:[n]},children:[{type:b,value:aF}]},{type:b,value:aG}]},{type:a,tag:A,props:{},children:[{type:a,tag:t,props:{},children:[{type:a,tag:f,props:{},children:[{type:b,value:aH}]},{type:b,value:aI},{type:a,tag:f,props:{},children:[{type:b,value:aJ}]},{type:b,value:aK},{type:a,tag:f,props:{},children:[{type:b,value:aL}]},{type:b,value:aM}]},{type:a,tag:t,props:{},children:[{type:a,tag:f,props:{},children:[{type:b,value:aN}]},{type:b,value:p},{type:a,tag:f,props:{},children:[{type:b,value:aO}]},{type:b,value:p},{type:a,tag:f,props:{},children:[{type:b,value:aP}]},{type:b,value:p},{type:a,tag:f,props:{},children:[{type:b,value:aQ}]},{type:b,value:p},{type:a,tag:f,props:{},children:[{type:b,value:aR}]},{type:b,value:p},{type:a,tag:f,props:{},children:[{type:b,value:aS}]},{type:b,value:aT}]}]},{type:a,tag:h,props:{code:N,language:aU},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"{"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:bl}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:bm}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"message\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:bm}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:M}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:u}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:Q}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"select\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:u}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"feature\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"\"plural\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"arg\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:bn}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"cases\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:u}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:F}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"one\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:u}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:G}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:H}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"\"{Count} бабочка\""}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:U}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:F}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"few\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:u}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:G}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:H}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"\"{Count} бабочки\""}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:U}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:F}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"many\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:u}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:G}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:H}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"\"{Count} бабочек\""}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:U}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:F}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"other\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:u}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:G}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:H}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"\"{Count} бабочуль\""}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" }"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" }"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:bo}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" },"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"placeholders\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:": ["}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" {"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:bl}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:bn}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"string\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"\"%[1]d\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"type\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:bp}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"underlyingType\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:bp}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"argNum\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:bj},children:[{type:b,value:bk}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"expr\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"\"count\""}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:bo}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" ]"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"},"}]}]}]}]}]},{type:a,tag:s,props:{id:aV},children:[{type:b,value:aW}]},{type:a,tag:i,props:{},children:[{type:b,value:aX},{type:a,tag:f,props:{},children:[{type:b,value:aY}]},{type:b,value:aZ}]},{type:a,tag:h,props:{code:O,language:w},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:"ct-7f7448"},children:[{type:b,value:"\u002F\u002Fgo:generate gotext -srclang=en-GB update -out=translations.go -lang=ru-RU github.com\u002Fmuerwre\u002Fvault-golang\u002Finternal\u002Fapi"}]}]}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:a_}]},{type:a,tag:h,props:{code:P,language:x},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"go generate .\u002F..."}]}]}]}]}]},{type:a,tag:s,props:{id:a$},children:[{type:b,value:ba}]},{type:a,tag:A,props:{},children:[{type:a,tag:t,props:{},children:[{type:a,tag:m,props:{href:z,rel:[n]},children:[{type:b,value:bb}]}]},{type:a,tag:t,props:{},children:[{type:a,tag:m,props:{href:bc,rel:[n]},children:[{type:b,value:bd}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-7f7448{color:#8B949E}.ct-ba7775{color:#79C0FF}.ct-f0c8ef{color:#79C0FF}.ct-edb491{color:#79C0FF}.ct-9e0b55{color:#FFA198}.ct-c4c559{color:#A5D6FF}.ct-843391{color:#79C0FF}.ct-f1cd32{color:#C9D1D9}.ct-ba0dbd{color:#FFA657}.ct-1fc9ae{color:#A5D6FF}.ct-7c633d{color:#C9D1D9}.ct-4e9498{color:#C9D1D9}.ct-806f41{color:#FF7B72}.light .ct-806f41{color:#859900}.light .ct-4e9498{color:#657B83}.light .ct-7c633d{color:#657B83}.light .ct-1fc9ae{color:#2AA198}.light .ct-ba0dbd{color:#2AA198}.light .ct-f1cd32{color:#268BD2}.light .ct-843391{color:#268BD2}.light .ct-c4c559{color:#2AA198}.light .ct-9e0b55{color:#CD3131}.light .ct-edb491{color:#D33682}.light .ct-f0c8ef{color:#CB4B16}.light .ct-ba7775{color:#859900}.light .ct-7f7448{color:#93A1A1}"}]}],toc:{title:l,searchDepth:bq,depth:bq,links:[]}},_type:"markdown",_id:"content:Golang:i18n in golang.md",_source:"content",_file:"Golang\u002Fi18n in golang.md",_extension:"md"}},prerenderedAt:1711020227618}}("element","text","span","ct-4e9498","line","code-inline","ct-ba7775","code","p","ct-c4c559",": ","","a","nofollow","pre"," | ",","," ","h4","li",": {","\"","go","shell",".","https:\u002F\u002Fgithub.com\u002Fgolang\u002Ftext\u002Fblob\u002Fmaster\u002Ffeature\u002Fplural\u002Fgen_common.go#L19","ul","ct-806f41","ct-1fc9ae"," "," "," "," ","\"msg\"",false,"import (\n \"golang.org\u002Fx\u002Ftext\u002Flanguage\"\n \"golang.org\u002Fx\u002Ftext\u002Fmessage\"\n)\n\nlang := language.MustParse('ru-RU')\nprinter := message.NewPrinter(lang)\n\ncount := 1\nprinter.Sprintf(\"%d butterflies\", count)\n","ru-RU","gotext -srclang=en-GB update -lang=ru-RU \\\n -out=translations.go github.com\u002Fpath\u002Fto-output-folder\n","\"translation\"","{\n \"id\": \"{Count} butterflies\",\n \"message\": \"{Count} butterflies\",\n \"translation\": {\n \"select\": {\n \"feature\": \"plural\",\n \"arg\": \"Count\",\n \"cases\": {\n \"one\": {\n \"msg\": \"{Count} бабочка\"\n },\n \"few\": {\n \"msg\": \"{Count} бабочки\"\n },\n \"many\": {\n \"msg\": \"{Count} бабочек\"\n },\n \"other\": {\n \"msg\": \"{Count} бабочуль\"\n }\n }\n }\n },\n \"placeholders\": [\n {\n \"id\": \"Count\",\n \"string\": \"%[1]d\",\n \"type\": \"int\",\n \"underlyingType\": \"int\",\n \"argNum\": 1,\n \"expr\": \"count\"\n }\n ]\n},\n","\u002F\u002Fgo:generate gotext -srclang=en-GB update -out=translations.go -lang=ru-RU github.com\u002Fmuerwre\u002Fvault-golang\u002Finternal\u002Fapi\n","go generate .\u002F...\n"," ","ct-f1cd32",":=","ct-843391"," },","I18n In Golang","\u002Fgolang\u002Fi18n-in-golang","root","There are no good examples of ","https:\u002F\u002Fgolang.org\u002Fx\u002Ftext","golang.org\u002Fx\u002Ftext"," uses and description of how pluralization made. So, this is it.","generating-translations","Generating translations","blockquote","You should specify valid ","https:\u002F\u002Fwww.iso.org\u002Fobp\u002Fui\u002F#iso:code:3166","ISO-3166 locale code"," to get plurals working!","Write your code:","Then run generator for your locale (mine is ","):","This will generate ","out.gotext.json"," in ","\u002Fpath\u002Fto-output-folder\u002Fru-RU"," of your project. Copy it to ","messages.out.json","translating-and-adding-plural-forms","Translating and adding plural forms","Change "," value in generated ","messages.gotext.json"," to ","string"," or ","object"," of the form shown below if you want pluralize strings, ","highlight","then run gotext command again",", it will generate ",".go files with translations","According to ","source files of gen_common",", there's a couple of forms:","=N",", ","!=N",", ","%N"," for exact matches","zero","one","two","few","many","other"," - they're different for each language, so,","json","using-go-generate","Using go-generate","Write this at some ",".go"," file:","Then run go generation:","useful-links","Useful links","All available forms in this .go file","https:\u002F\u002Fcommunity.crowdin.com\u002Ft\u002Fplurals-in-gotext-json-files\u002F600","Answer, that solved it for me","ct-7c633d","ct-ba0dbd",")","(","'","ct-edb491","1","\"id\"","\"{Count} butterflies\"","\"Count\""," }","\"int\"",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC,aD,aE,aF,aG,aH,aI,aJ,aK,aL,aM,aN,aO,aP,aQ,aR,aS,aT,aU,aV,aW,aX,aY,aZ,a_,a$,ba,bb,bc,bd,be,bf,bg,bh,bi,bj,bk,bl,bm,bn,bo,bp,bq){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:V,_path:W}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-jPHqVKRuVS":{_path:W,_dir:"golang",_draft:I,_partial:I,_locale:"en",_empty:I,title:V,description:"There are no good examples of golang.org\u002Fx\u002Ftext uses and description of how pluralization made. So, this is it.",excerpt:{type:X,children:[{type:a,tag:i,props:{},children:[{type:b,value:Y},{type:a,tag:m,props:{href:Z,rel:[n]},children:[{type:b,value:_}]},{type:b,value:$}]},{type:a,tag:s,props:{id:aa},children:[{type:b,value:ab}]},{type:a,tag:ac,props:{},children:[{type:a,tag:i,props:{},children:[{type:b,value:ad},{type:a,tag:m,props:{href:ae,rel:[n]},children:[{type:b,value:af}]},{type:b,value:ag}]}]},{type:a,tag:i,props:{},children:[{type:b,value:ah}]},{type:a,tag:h,props:{code:J,language:w},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:b,value:J}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:ai},{type:a,tag:f,props:{},children:[{type:b,value:K}]},{type:b,value:aj}]},{type:a,tag:h,props:{code:L,language:x},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:b,value:L}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:ak},{type:a,tag:f,props:{},children:[{type:b,value:al}]},{type:b,value:am},{type:a,tag:f,props:{},children:[{type:b,value:an}]},{type:b,value:ao},{type:a,tag:f,props:{},children:[{type:b,value:ap}]},{type:b,value:y}]},{type:a,tag:s,props:{id:aq},children:[{type:b,value:ar}]},{type:a,tag:i,props:{},children:[{type:b,value:as},{type:a,tag:f,props:{},children:[{type:b,value:M}]},{type:b,value:at},{type:a,tag:f,props:{},children:[{type:b,value:au}]},{type:b,value:av},{type:a,tag:f,props:{},children:[{type:b,value:aw}]},{type:b,value:ax},{type:a,tag:f,props:{},children:[{type:b,value:ay}]},{type:b,value:az},{type:a,tag:c,props:{className:[aA]},children:[{type:b,value:aB}]},{type:b,value:aC},{type:a,tag:f,props:{},children:[{type:b,value:aD}]},{type:b,value:y}]},{type:a,tag:i,props:{},children:[{type:b,value:aE},{type:a,tag:m,props:{href:z,rel:[n]},children:[{type:b,value:aF}]},{type:b,value:aG}]},{type:a,tag:A,props:{},children:[{type:a,tag:t,props:{},children:[{type:a,tag:f,props:{},children:[{type:b,value:aH}]},{type:b,value:aI},{type:a,tag:f,props:{},children:[{type:b,value:aJ}]},{type:b,value:aK},{type:a,tag:f,props:{},children:[{type:b,value:aL}]},{type:b,value:aM}]},{type:a,tag:t,props:{},children:[{type:a,tag:f,props:{},children:[{type:b,value:aN}]},{type:b,value:p},{type:a,tag:f,props:{},children:[{type:b,value:aO}]},{type:b,value:p},{type:a,tag:f,props:{},children:[{type:b,value:aP}]},{type:b,value:p},{type:a,tag:f,props:{},children:[{type:b,value:aQ}]},{type:b,value:p},{type:a,tag:f,props:{},children:[{type:b,value:aR}]},{type:b,value:p},{type:a,tag:f,props:{},children:[{type:b,value:aS}]},{type:b,value:aT}]}]},{type:a,tag:h,props:{code:N,language:aU},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:b,value:N}]}]}]},{type:a,tag:s,props:{id:aV},children:[{type:b,value:aW}]},{type:a,tag:i,props:{},children:[{type:b,value:aX},{type:a,tag:f,props:{},children:[{type:b,value:aY}]},{type:b,value:aZ}]},{type:a,tag:h,props:{code:O,language:w},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:b,value:O}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:a_}]},{type:a,tag:h,props:{code:P,language:x},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:b,value:P}]}]}]},{type:a,tag:s,props:{id:a$},children:[{type:b,value:ba}]},{type:a,tag:A,props:{},children:[{type:a,tag:t,props:{},children:[{type:a,tag:m,props:{href:z,rel:[n]},children:[{type:b,value:bb}]}]},{type:a,tag:t,props:{},children:[{type:a,tag:m,props:{href:bc,rel:[n]},children:[{type:b,value:bd}]}]}]}]},body:{type:X,children:[{type:a,tag:i,props:{},children:[{type:b,value:Y},{type:a,tag:m,props:{href:Z,rel:[n]},children:[{type:b,value:_}]},{type:b,value:$}]},{type:a,tag:s,props:{id:aa},children:[{type:b,value:ab}]},{type:a,tag:ac,props:{},children:[{type:a,tag:i,props:{},children:[{type:b,value:ad},{type:a,tag:m,props:{href:ae,rel:[n]},children:[{type:b,value:af}]},{type:b,value:ag}]}]},{type:a,tag:i,props:{},children:[{type:b,value:ah}]},{type:a,tag:h,props:{code:J,language:w},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:B},children:[{type:b,value:"import"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" ("}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:be},children:[{type:b,value:Q}]},{type:a,tag:c,props:{class:C},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:bf},children:[{type:b,value:"golang.org\u002Fx\u002Ftext\u002Flanguage"}]},{type:a,tag:c,props:{class:C},children:[{type:b,value:v}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:be},children:[{type:b,value:Q}]},{type:a,tag:c,props:{class:C},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:bf},children:[{type:b,value:"golang.org\u002Fx\u002Ftext\u002Fmessage"}]},{type:a,tag:c,props:{class:C},children:[{type:b,value:v}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:bg}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:R},children:[{type:b,value:"lang"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:D}]},{type:a,tag:c,props:{class:B},children:[{type:b,value:S}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" language."}]},{type:a,tag:c,props:{class:T},children:[{type:b,value:"MustParse"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:bh}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:bi}]},{type:a,tag:c,props:{class:"ct-601b0e"},children:[{type:b,value:K}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:bi}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:bg}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:R},children:[{type:b,value:"printer"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:D}]},{type:a,tag:c,props:{class:B},children:[{type:b,value:S}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" message."}]},{type:a,tag:c,props:{class:T},children:[{type:b,value:"NewPrinter"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"(lang)"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:R},children:[{type:b,value:"count"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:D}]},{type:a,tag:c,props:{class:B},children:[{type:b,value:S}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:D}]},{type:a,tag:c,props:{class:bj},children:[{type:b,value:bk}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"printer."}]},{type:a,tag:c,props:{class:T},children:[{type:b,value:"Sprintf"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:bh}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:"ct-37236e"},children:[{type:b,value:"%d"}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:" butterflies\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:", count)"}]}]}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:ai},{type:a,tag:f,props:{},children:[{type:b,value:K}]},{type:b,value:aj}]},{type:a,tag:h,props:{code:L,language:x},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"gotext -srclang=en-GB update -lang=ru-RU \\"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" -out=translations.go github.com\u002Fpath\u002Fto-output-folder"}]}]}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:ak},{type:a,tag:f,props:{},children:[{type:b,value:al}]},{type:b,value:am},{type:a,tag:f,props:{},children:[{type:b,value:an}]},{type:b,value:ao},{type:a,tag:f,props:{},children:[{type:b,value:ap}]},{type:b,value:y}]},{type:a,tag:s,props:{id:aq},children:[{type:b,value:ar}]},{type:a,tag:i,props:{},children:[{type:b,value:as},{type:a,tag:f,props:{},children:[{type:b,value:M}]},{type:b,value:at},{type:a,tag:f,props:{},children:[{type:b,value:au}]},{type:b,value:av},{type:a,tag:f,props:{},children:[{type:b,value:aw}]},{type:b,value:ax},{type:a,tag:f,props:{},children:[{type:b,value:ay}]},{type:b,value:az},{type:a,tag:c,props:{className:[aA]},children:[{type:b,value:aB}]},{type:b,value:aC},{type:a,tag:f,props:{},children:[{type:b,value:aD}]},{type:b,value:y}]},{type:a,tag:i,props:{},children:[{type:b,value:aE},{type:a,tag:m,props:{href:z,rel:[n]},children:[{type:b,value:aF}]},{type:b,value:aG}]},{type:a,tag:A,props:{},children:[{type:a,tag:t,props:{},children:[{type:a,tag:f,props:{},children:[{type:b,value:aH}]},{type:b,value:aI},{type:a,tag:f,props:{},children:[{type:b,value:aJ}]},{type:b,value:aK},{type:a,tag:f,props:{},children:[{type:b,value:aL}]},{type:b,value:aM}]},{type:a,tag:t,props:{},children:[{type:a,tag:f,props:{},children:[{type:b,value:aN}]},{type:b,value:p},{type:a,tag:f,props:{},children:[{type:b,value:aO}]},{type:b,value:p},{type:a,tag:f,props:{},children:[{type:b,value:aP}]},{type:b,value:p},{type:a,tag:f,props:{},children:[{type:b,value:aQ}]},{type:b,value:p},{type:a,tag:f,props:{},children:[{type:b,value:aR}]},{type:b,value:p},{type:a,tag:f,props:{},children:[{type:b,value:aS}]},{type:b,value:aT}]}]},{type:a,tag:h,props:{code:N,language:aU},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"{"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:bl}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:bm}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"message\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:bm}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:M}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:u}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:Q}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"select\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:u}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"feature\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"\"plural\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"arg\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:bn}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"cases\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:u}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:F}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"one\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:u}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:G}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:H}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"\"{Count} бабочка\""}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:U}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:F}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"few\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:u}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:G}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:H}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"\"{Count} бабочки\""}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:U}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:F}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"many\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:u}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:G}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:H}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"\"{Count} бабочек\""}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:U}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:F}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"other\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:u}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:G}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:H}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"\"{Count} бабочуль\""}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" }"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" }"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:bo}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" },"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:E}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"placeholders\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:": ["}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" {"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:bl}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:bn}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"string\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"\"%[1]d\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"type\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:bp}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"underlyingType\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:bp}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"argNum\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:bj},children:[{type:b,value:bk}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:g},children:[{type:b,value:"\"expr\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:k}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"\"count\""}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:bo}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" ]"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"},"}]}]}]}]}]},{type:a,tag:s,props:{id:aV},children:[{type:b,value:aW}]},{type:a,tag:i,props:{},children:[{type:b,value:aX},{type:a,tag:f,props:{},children:[{type:b,value:aY}]},{type:b,value:aZ}]},{type:a,tag:h,props:{code:O,language:w},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:"ct-a3abcc"},children:[{type:b,value:"\u002F\u002Fgo:generate gotext -srclang=en-GB update -out=translations.go -lang=ru-RU github.com\u002Fmuerwre\u002Fvault-golang\u002Finternal\u002Fapi"}]}]}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:a_}]},{type:a,tag:h,props:{code:P,language:x},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:"go generate .\u002F..."}]}]}]}]}]},{type:a,tag:s,props:{id:a$},children:[{type:b,value:ba}]},{type:a,tag:A,props:{},children:[{type:a,tag:t,props:{},children:[{type:a,tag:m,props:{href:z,rel:[n]},children:[{type:b,value:bb}]}]},{type:a,tag:t,props:{},children:[{type:a,tag:m,props:{href:bc,rel:[n]},children:[{type:b,value:bd}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-a3abcc{color:#8B949E}.ct-f85543{color:#79C0FF}.ct-37236e{color:#79C0FF}.ct-888095{color:#79C0FF}.ct-601b0e{color:#FFA198}.ct-671abd{color:#A5D6FF}.ct-52b090{color:#79C0FF}.ct-b05caf{color:#C9D1D9}.ct-906b3a{color:#FFA657}.ct-d19b58{color:#A5D6FF}.ct-3d6772{color:#C9D1D9}.ct-c9d8e7{color:#C9D1D9}.ct-e01c71{color:#FF7B72}.light .ct-e01c71{color:#859900}.light .ct-c9d8e7{color:#657B83}.light .ct-3d6772{color:#657B83}.light .ct-d19b58{color:#2AA198}.light .ct-906b3a{color:#2AA198}.light .ct-b05caf{color:#268BD2}.light .ct-52b090{color:#268BD2}.light .ct-671abd{color:#2AA198}.light .ct-601b0e{color:#CD3131}.light .ct-888095{color:#D33682}.light .ct-37236e{color:#CB4B16}.light .ct-f85543{color:#859900}.light .ct-a3abcc{color:#93A1A1}"}]}],toc:{title:l,searchDepth:bq,depth:bq,links:[]}},_type:"markdown",_id:"content:Golang:i18n in golang.md",_source:"content",_file:"Golang\u002Fi18n in golang.md",_extension:"md"}},prerenderedAt:1711020861873}}("element","text","span","ct-c9d8e7","line","code-inline","ct-f85543","code","p","ct-671abd",": ","","a","nofollow","pre"," | ",","," ","h4","li",": {","\"","go","shell",".","https:\u002F\u002Fgithub.com\u002Fgolang\u002Ftext\u002Fblob\u002Fmaster\u002Ffeature\u002Fplural\u002Fgen_common.go#L19","ul","ct-e01c71","ct-d19b58"," "," "," "," ","\"msg\"",false,"import (\n \"golang.org\u002Fx\u002Ftext\u002Flanguage\"\n \"golang.org\u002Fx\u002Ftext\u002Fmessage\"\n)\n\nlang := language.MustParse('ru-RU')\nprinter := message.NewPrinter(lang)\n\ncount := 1\nprinter.Sprintf(\"%d butterflies\", count)\n","ru-RU","gotext -srclang=en-GB update -lang=ru-RU \\\n -out=translations.go github.com\u002Fpath\u002Fto-output-folder\n","\"translation\"","{\n \"id\": \"{Count} butterflies\",\n \"message\": \"{Count} butterflies\",\n \"translation\": {\n \"select\": {\n \"feature\": \"plural\",\n \"arg\": \"Count\",\n \"cases\": {\n \"one\": {\n \"msg\": \"{Count} бабочка\"\n },\n \"few\": {\n \"msg\": \"{Count} бабочки\"\n },\n \"many\": {\n \"msg\": \"{Count} бабочек\"\n },\n \"other\": {\n \"msg\": \"{Count} бабочуль\"\n }\n }\n }\n },\n \"placeholders\": [\n {\n \"id\": \"Count\",\n \"string\": \"%[1]d\",\n \"type\": \"int\",\n \"underlyingType\": \"int\",\n \"argNum\": 1,\n \"expr\": \"count\"\n }\n ]\n},\n","\u002F\u002Fgo:generate gotext -srclang=en-GB update -out=translations.go -lang=ru-RU github.com\u002Fmuerwre\u002Fvault-golang\u002Finternal\u002Fapi\n","go generate .\u002F...\n"," ","ct-b05caf",":=","ct-52b090"," },","I18n In Golang","\u002Fgolang\u002Fi18n-in-golang","root","There are no good examples of ","https:\u002F\u002Fgolang.org\u002Fx\u002Ftext","golang.org\u002Fx\u002Ftext"," uses and description of how pluralization made. So, this is it.","generating-translations","Generating translations","blockquote","You should specify valid ","https:\u002F\u002Fwww.iso.org\u002Fobp\u002Fui\u002F#iso:code:3166","ISO-3166 locale code"," to get plurals working!","Write your code:","Then run generator for your locale (mine is ","):","This will generate ","out.gotext.json"," in ","\u002Fpath\u002Fto-output-folder\u002Fru-RU"," of your project. Copy it to ","messages.out.json","translating-and-adding-plural-forms","Translating and adding plural forms","Change "," value in generated ","messages.gotext.json"," to ","string"," or ","object"," of the form shown below if you want pluralize strings, ","highlight","then run gotext command again",", it will generate ",".go files with translations","According to ","source files of gen_common",", there's a couple of forms:","=N",", ","!=N",", ","%N"," for exact matches","zero","one","two","few","many","other"," - they're different for each language, so,","json","using-go-generate","Using go-generate","Write this at some ",".go"," file:","Then run go generation:","useful-links","Useful links","All available forms in this .go file","https:\u002F\u002Fcommunity.crowdin.com\u002Ft\u002Fplurals-in-gotext-json-files\u002F600","Answer, that solved it for me","ct-3d6772","ct-906b3a",")","(","'","ct-888095","1","\"id\"","\"{Count} butterflies\"","\"Count\""," }","\"int\"",2)) \ No newline at end of file diff --git a/docs/golang/i18n-in-golang/index.html b/docs/golang/i18n-in-golang/index.html index c2f0e53..f4bd4ff 100644 --- a/docs/golang/i18n-in-golang/index.html +++ b/docs/golang/i18n-in-golang/index.html @@ -1,6 +1,6 @@ -I18n In Golang • Obsidian Garden -

I18n In Golang

There are no good examples of golang.org/x/text uses and description of how pluralization made. So, this is it.

Generating translations

You should specify valid ISO-3166 locale code to get plurals working!

Write your code:

import (    "golang.org/x/text/language"    "golang.org/x/text/message")lang := language.MustParse('ru-RU')printer := message.NewPrinter(lang)count := 1printer.Sprintf("%d butterflies", count)

Then run generator for your locale (mine is ru-RU):

gotext -srclang=en-GB update -lang=ru-RU \    -out=translations.go github.com/path/to-output-folder

This will generate out.gotext.json in /path/to-output-folder/ru-RU of your project. Copy it to messages.out.json.

Translating and adding plural forms

Change "translation" value in generated messages.gotext.json to string or object of the form shown below if you want pluralize strings, then run gotext command again, it will generate .go files with translations.

According to source files of gen_common, there's a couple of forms:

  • =N, !=N, %N for exact matches
  • zero | one | two | few | many | other - they're different for each language, so,
{  "id": "{Count} butterflies",  "message": "{Count} butterflies",  "translation": {    "select": {      "feature": "plural",      "arg": "Count",      "cases": {        "one": {          "msg": "{Count} бабочка"        },        "few": {          "msg": "{Count} бабочки"        },        "many": {          "msg": "{Count} бабочек"        },        "other": {          "msg": "{Count} бабочуль"        }      }    }  },  "placeholders": [    {      "id": "Count",      "string": "%[1]d",      "type": "int",      "underlyingType": "int",      "argNum": 1,      "expr": "count"    }  ]},

Using go-generate

Write this at some .go file:

//go:generate gotext -srclang=en-GB update -out=translations.go -lang=ru-RU github.com/muerwre/vault-golang/internal/api

Then run go generation:

go generate ./...
btw, have a nice day
(2018 - 2024) muerwre
+

I18n In Golang

There are no good examples of golang.org/x/text uses and description of how pluralization made. So, this is it.

Generating translations

You should specify valid ISO-3166 locale code to get plurals working!

Write your code:

import (    "golang.org/x/text/language"    "golang.org/x/text/message")lang := language.MustParse('ru-RU')printer := message.NewPrinter(lang)count := 1printer.Sprintf("%d butterflies", count)

Then run generator for your locale (mine is ru-RU):

gotext -srclang=en-GB update -lang=ru-RU \    -out=translations.go github.com/path/to-output-folder

This will generate out.gotext.json in /path/to-output-folder/ru-RU of your project. Copy it to messages.out.json.

Translating and adding plural forms

Change "translation" value in generated messages.gotext.json to string or object of the form shown below if you want pluralize strings, then run gotext command again, it will generate .go files with translations.

According to source files of gen_common, there's a couple of forms:

  • =N, !=N, %N for exact matches
  • zero | one | two | few | many | other - they're different for each language, so,
{  "id": "{Count} butterflies",  "message": "{Count} butterflies",  "translation": {    "select": {      "feature": "plural",      "arg": "Count",      "cases": {        "one": {          "msg": "{Count} бабочка"        },        "few": {          "msg": "{Count} бабочки"        },        "many": {          "msg": "{Count} бабочек"        },        "other": {          "msg": "{Count} бабочуль"        }      }    }  },  "placeholders": [    {      "id": "Count",      "string": "%[1]d",      "type": "int",      "underlyingType": "int",      "argNum": 1,      "expr": "count"    }  ]},

Using go-generate

Write this at some .go file:

//go:generate gotext -srclang=en-GB update -out=translations.go -lang=ru-RU github.com/muerwre/vault-golang/internal/api

Then run go generation:

go generate ./...
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/graphql/apollo-client-pagination/_payload.js b/docs/graphql/apollo-client-pagination/_payload.js index 7fb1851..5c7865c 100644 --- a/docs/graphql/apollo-client-pagination/_payload.js +++ b/docs/graphql/apollo-client-pagination/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC,aD,aE,aF){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:ab,_path:ac},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-k91xxFGA5Y":{_path:ac,_dir:R,_draft:S,_partial:S,_locale:"en",_empty:S,title:ab,description:"Say, we have gql response like this and we wan't to have pagination with it. Let's merge it as it specified in official documentation",excerpt:{type:ad,children:[{type:a,tag:v,props:{},children:[{type:c,value:ae},{type:a,tag:o,props:{},children:[{type:c,value:af}]},{type:c,value:ag},{type:a,tag:ah,props:{href:ai,rel:[aj]},children:[{type:c,value:ak}]}]},{type:a,tag:k,props:{code:T,language:R},children:[{type:a,tag:w,props:{},children:[{type:a,tag:k,props:{__ignoreMap:r},children:[{type:c,value:T}]}]}]},{type:a,tag:v,props:{},children:[{type:c,value:al},{type:a,tag:o,props:{},children:[{type:c,value:I}]},{type:c,value:am},{type:a,tag:o,props:{},children:[{type:c,value:J}]},{type:c,value:an}]},{type:a,tag:k,props:{code:U,language:K},children:[{type:a,tag:w,props:{},children:[{type:a,tag:k,props:{__ignoreMap:r},children:[{type:c,value:U}]}]}]},{type:a,tag:v,props:{},children:[{type:c,value:ao},{type:a,tag:o,props:{},children:[{type:c,value:L}]},{type:c,value:ap}]},{type:a,tag:k,props:{code:V,language:K},children:[{type:a,tag:w,props:{},children:[{type:a,tag:k,props:{__ignoreMap:r},children:[{type:c,value:V}]}]}]}]},body:{type:ad,children:[{type:a,tag:v,props:{},children:[{type:c,value:ae},{type:a,tag:o,props:{},children:[{type:c,value:af}]},{type:c,value:ag},{type:a,tag:ah,props:{href:ai,rel:[aj]},children:[{type:c,value:ak}]}]},{type:a,tag:k,props:{code:T,language:R},children:[{type:a,tag:w,props:{},children:[{type:a,tag:k,props:{__ignoreMap:r},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:"query"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:M},children:[{type:c,value:"listItems"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:W}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"filter"}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"sort"}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:x}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"limit"}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:x}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:x}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"): "}]},{type:a,tag:b,props:{class:M},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:"input"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:at},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:C}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"name"}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:q}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:au}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:q}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:Z}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:au}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:at},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:C}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:": ["}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"Item"}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"]"}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:q}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"Int"}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:q}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:Z}]}]}]}]}]},{type:a,tag:v,props:{},children:[{type:c,value:al},{type:a,tag:o,props:{},children:[{type:c,value:I}]},{type:c,value:am},{type:a,tag:o,props:{},children:[{type:c,value:J}]},{type:c,value:an}]},{type:a,tag:k,props:{code:U,language:K},children:[{type:a,tag:w,props:{},children:[{type:a,tag:k,props:{__ignoreMap:r},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:"import"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" { "}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:av}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" } "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"from"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:"'@apollo\u002Fclient'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aw}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:N},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:O},children:[{type:c,value:"client"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ax}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:M},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"({"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ay}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" cache: "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ax}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:M},children:[{type:c,value:av}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"({ "}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" }),"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ay}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"});"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:"export"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:N},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:O},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:":"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:"ct-13862b"},children:[{type:c,value:"TypePolicies"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:C}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" Query: {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" fields: {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F\u002F query name"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" listItems: {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F\u002F apollo will serialize and use keyArgs as unique"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F\u002F identifier in cache for every query"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F\u002F consider choosing the right fields, "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F\u002F i.e. limit and offset won't work here"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" keyArgs: ["}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:"'sort'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F\u002F primitive type"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:"'filter'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:", ["}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:"'name'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:"'type'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"] "}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F\u002F nested fields of `filter`"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" ],"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" merge: "}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" },"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:Z}]}]}]}]}]},{type:a,tag:v,props:{},children:[{type:c,value:ao},{type:a,tag:o,props:{},children:[{type:c,value:L}]},{type:c,value:ap}]},{type:a,tag:k,props:{code:V,language:K},children:[{type:a,tag:w,props:{},children:[{type:a,tag:k,props:{__ignoreMap:r},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F** merges all sources with { items: unknown[], totalCount: number } *\u002F"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:aA},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:"ct-c198ce"},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:", { "}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:" }) "}]},{type:a,tag:b,props:{class:aA},children:[{type:c,value:"=\u003E"}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:C}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F\u002F no existing data"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"."}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\u003C"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aC}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aD}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F\u002F If hook was called multiple times"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aC}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aD}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F\u002F merge cache and incoming data"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:N},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:O},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" ["}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F\u002F apply latest result for totalCount"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:N},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:O},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aw}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:C}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-c198ce{color:#D2A8FF}.ct-da03a1{color:#FF7B72}.ct-13862b{color:#FFA657}.ct-153212{color:#8B949E}.ct-ba692c{color:#79C0FF}.ct-da6361{color:#FF7B72}.ct-5a2d2f{color:#A5D6FF}.ct-565cdc{color:#C9D1D9}.ct-b59deb{color:#FF7B72}.ct-f47193{color:#79C0FF}.ct-f1c0e2{color:#79C0FF}.ct-ea2c84{color:#FFA657}.ct-74bdc2{color:#C9D1D9}.ct-afdd79{color:#D2A8FF}.ct-90afac{color:#C9D1D9}.ct-89106e{color:#FF7B72}.light .ct-89106e{color:#859900}.light .ct-90afac{color:#657B83}.light .ct-afdd79{color:#268BD2}.light .ct-74bdc2{color:#657B83}.light .ct-ea2c84{color:#657B83}.light .ct-f1c0e2{color:#859900}.light .ct-f47193{color:#859900}.light .ct-b59deb{color:#859900}.light .ct-565cdc{color:#268BD2}.light .ct-5a2d2f{color:#2AA198}.light .ct-da6361{color:#073642}.light .ct-ba692c{color:#268BD2}.light .ct-153212{color:#93A1A1}.light .ct-13862b{color:#268BD2}.light .ct-da03a1{color:#073642}.light .ct-c198ce{color:#268BD2}"}]}],toc:{title:r,searchDepth:aF,depth:aF,links:[]}},_type:"markdown",_id:"content:GraphQL:Apollo Client pagination.md",_source:"content",_file:"GraphQL\u002FApollo Client pagination.md",_extension:"md"}},prerenderedAt:1711020227666}}("element","span","text","ct-90afac","line"," ","ct-89106e","ct-74bdc2","ct-565cdc","ct-153212","code","ct-ea2c84"," "," ","code-inline","ct-f1c0e2","!","",": ","existing","||","p","pre",",","ct-b59deb"," ","?.",", "," {","items","totalCount","ct-5a2d2f","const","=","ApolloClient","typePolicies","typescript","mergeItemsWithTotalCount","ct-afdd79","ct-da6361","ct-ba692c"," ","incoming","graphql",false,"query listItems(\n filter: Filter, \n sort: String,\n limit: Number,\n offset: Number,\n): ItemList!\n\ninput Filter {\n name: String!\n type: String!\n}\n\ntype ItemList {\n items: [Item!]!\n totalCount: Int!\n}\n","import { ApolloClient, InMemoryCache } from '@apollo\u002Fclient';\n\nconst client = new ApolloClient({\n \u002F\u002F ...\n cache: new InMemoryCache({ typePolicies }),\n \u002F\u002F ...\n});\n\nexport const typePolicies: TypePolicies = {\n Query: {\n fields: {\n \u002F\u002F query name\n listItems: {\n \u002F\u002F apollo will serialize and use keyArgs as unique\n \u002F\u002F identifier in cache for every query\n \u002F\u002F consider choosing the right fields, \n \u002F\u002F i.e. limit and offset won't work here\n keyArgs: [\n 'sort', \u002F\u002F primitive type\n 'filter', ['name', 'type'] \u002F\u002F nested fields of `filter`\n ],\n merge: mergeItemsWithTotalCount,\n },\n }\n}\n","\u002F** merges all sources with { items: unknown[], totalCount: number } *\u002F\nconst mergeItemsWithTotalCount = (existing, incoming, { args }) =\u003E {\n \u002F\u002F no existing data\n if (!existing || !args?.offset || args.offset \u003C existing.length) {\n return incoming || [];\n }\n\n \u002F\u002F If hook was called multiple times\n if (existing?.items?.length && args?.offset \u003C existing.items.length) {\n return existing || [];\n }\n\n \u002F\u002F merge cache and incoming data\n const items = [...(existing?.items || []), ...(incoming?.items || [])];\n\n \u002F\u002F apply latest result for totalCount\n const totalCount = incoming?.totalCount || existing?.totalCount;\n\n return {\n ...(incoming || existing || {}),\n items,\n totalCount,\n };\n };\n","(","String","offset","}"," (","args","return","Apollo Client Pagination","\u002Fgraphql\u002Fapollo-client-pagination","root","Say, we have ","gql"," response like this and we wan't to have pagination with it. Let's merge it as it specified in ","a","https:\u002F\u002Fwww.apollographql.com\u002Fdocs\u002Freact\u002Fcaching\u002Fcache-field-behavior\u002F#the-merge-function","nofollow","official documentation","We will setup "," with "," to merge incoming data in cache:","We will need merge function ",", which will join results of query and cached data for specific key:","Filter","Number","ItemList","ct-f47193","type","InMemoryCache",";","new","\u002F\u002F ..."," ","ct-da03a1","if"," [];"," }","...",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC,aD,aE,aF){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:ab,_path:ac},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-k91xxFGA5Y":{_path:ac,_dir:R,_draft:S,_partial:S,_locale:"en",_empty:S,title:ab,description:"Say, we have gql response like this and we wan't to have pagination with it. Let's merge it as it specified in official documentation",excerpt:{type:ad,children:[{type:a,tag:v,props:{},children:[{type:c,value:ae},{type:a,tag:o,props:{},children:[{type:c,value:af}]},{type:c,value:ag},{type:a,tag:ah,props:{href:ai,rel:[aj]},children:[{type:c,value:ak}]}]},{type:a,tag:k,props:{code:T,language:R},children:[{type:a,tag:w,props:{},children:[{type:a,tag:k,props:{__ignoreMap:r},children:[{type:c,value:T}]}]}]},{type:a,tag:v,props:{},children:[{type:c,value:al},{type:a,tag:o,props:{},children:[{type:c,value:I}]},{type:c,value:am},{type:a,tag:o,props:{},children:[{type:c,value:J}]},{type:c,value:an}]},{type:a,tag:k,props:{code:U,language:K},children:[{type:a,tag:w,props:{},children:[{type:a,tag:k,props:{__ignoreMap:r},children:[{type:c,value:U}]}]}]},{type:a,tag:v,props:{},children:[{type:c,value:ao},{type:a,tag:o,props:{},children:[{type:c,value:L}]},{type:c,value:ap}]},{type:a,tag:k,props:{code:V,language:K},children:[{type:a,tag:w,props:{},children:[{type:a,tag:k,props:{__ignoreMap:r},children:[{type:c,value:V}]}]}]}]},body:{type:ad,children:[{type:a,tag:v,props:{},children:[{type:c,value:ae},{type:a,tag:o,props:{},children:[{type:c,value:af}]},{type:c,value:ag},{type:a,tag:ah,props:{href:ai,rel:[aj]},children:[{type:c,value:ak}]}]},{type:a,tag:k,props:{code:T,language:R},children:[{type:a,tag:w,props:{},children:[{type:a,tag:k,props:{__ignoreMap:r},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:"query"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:M},children:[{type:c,value:"listItems"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:W}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"filter"}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"sort"}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:x}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"limit"}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:x}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:x}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"): "}]},{type:a,tag:b,props:{class:M},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:"input"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:at},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:C}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"name"}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:q}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:au}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:q}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:Z}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:au}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:at},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:C}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:": ["}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"Item"}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"]"}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:q}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"Int"}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:q}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:Z}]}]}]}]}]},{type:a,tag:v,props:{},children:[{type:c,value:al},{type:a,tag:o,props:{},children:[{type:c,value:I}]},{type:c,value:am},{type:a,tag:o,props:{},children:[{type:c,value:J}]},{type:c,value:an}]},{type:a,tag:k,props:{code:U,language:K},children:[{type:a,tag:w,props:{},children:[{type:a,tag:k,props:{__ignoreMap:r},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:"import"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" { "}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:av}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" } "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"from"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:"'@apollo\u002Fclient'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aw}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:N},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:O},children:[{type:c,value:"client"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ax}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:M},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"({"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ay}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" cache: "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ax}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:M},children:[{type:c,value:av}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"({ "}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" }),"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ay}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"});"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:"export"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:N},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:O},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:":"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:"ct-8c4995"},children:[{type:c,value:"TypePolicies"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:C}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" Query: {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" fields: {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F\u002F query name"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" listItems: {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F\u002F apollo will serialize and use keyArgs as unique"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F\u002F identifier in cache for every query"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F\u002F consider choosing the right fields, "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:P}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F\u002F i.e. limit and offset won't work here"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" keyArgs: ["}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:"'sort'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F\u002F primitive type"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:"'filter'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:", ["}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:"'name'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:"'type'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"] "}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F\u002F nested fields of `filter`"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" ],"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" merge: "}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" },"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:Z}]}]}]}]}]},{type:a,tag:v,props:{},children:[{type:c,value:ao},{type:a,tag:o,props:{},children:[{type:c,value:L}]},{type:c,value:ap}]},{type:a,tag:k,props:{code:V,language:K},children:[{type:a,tag:w,props:{},children:[{type:a,tag:k,props:{__ignoreMap:r},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F** merges all sources with { items: unknown[], totalCount: number } *\u002F"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:aA},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:"ct-031566"},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:", { "}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:" }) "}]},{type:a,tag:b,props:{class:aA},children:[{type:c,value:"=\u003E"}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:C}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F\u002F no existing data"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"."}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:Y}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\u003C"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aC}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aD}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F\u002F If hook was called multiple times"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aC}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aD}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F\u002F merge cache and incoming data"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:N},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:O},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" ["}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"\u002F\u002F apply latest result for totalCount"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:N},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:O},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aw}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:n}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aa}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:C}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-031566{color:#D2A8FF}.ct-9dffe1{color:#FF7B72}.ct-8c4995{color:#FFA657}.ct-845267{color:#8B949E}.ct-ccbc70{color:#79C0FF}.ct-a5e4ff{color:#FF7B72}.ct-3764bc{color:#A5D6FF}.ct-7744f1{color:#C9D1D9}.ct-7b1289{color:#FF7B72}.ct-eac85e{color:#79C0FF}.ct-3b4ce6{color:#79C0FF}.ct-af2982{color:#FFA657}.ct-d80d1a{color:#C9D1D9}.ct-1e640f{color:#D2A8FF}.ct-dbc662{color:#C9D1D9}.ct-3add6e{color:#FF7B72}.light .ct-3add6e{color:#859900}.light .ct-dbc662{color:#657B83}.light .ct-1e640f{color:#268BD2}.light .ct-d80d1a{color:#657B83}.light .ct-af2982{color:#657B83}.light .ct-3b4ce6{color:#859900}.light .ct-eac85e{color:#859900}.light .ct-7b1289{color:#859900}.light .ct-7744f1{color:#268BD2}.light .ct-3764bc{color:#2AA198}.light .ct-a5e4ff{color:#073642}.light .ct-ccbc70{color:#268BD2}.light .ct-845267{color:#93A1A1}.light .ct-8c4995{color:#268BD2}.light .ct-9dffe1{color:#073642}.light .ct-031566{color:#268BD2}"}]}],toc:{title:r,searchDepth:aF,depth:aF,links:[]}},_type:"markdown",_id:"content:GraphQL:Apollo Client pagination.md",_source:"content",_file:"GraphQL\u002FApollo Client pagination.md",_extension:"md"}},prerenderedAt:1711020861959}}("element","span","text","ct-dbc662","line"," ","ct-3add6e","ct-d80d1a","ct-7744f1","ct-845267","code","ct-af2982"," "," ","code-inline","ct-3b4ce6","!","",": ","existing","||","p","pre",",","ct-7b1289"," ","?.",", "," {","items","totalCount","ct-3764bc","const","=","ApolloClient","typePolicies","typescript","mergeItemsWithTotalCount","ct-1e640f","ct-a5e4ff","ct-ccbc70"," ","incoming","graphql",false,"query listItems(\n filter: Filter, \n sort: String,\n limit: Number,\n offset: Number,\n): ItemList!\n\ninput Filter {\n name: String!\n type: String!\n}\n\ntype ItemList {\n items: [Item!]!\n totalCount: Int!\n}\n","import { ApolloClient, InMemoryCache } from '@apollo\u002Fclient';\n\nconst client = new ApolloClient({\n \u002F\u002F ...\n cache: new InMemoryCache({ typePolicies }),\n \u002F\u002F ...\n});\n\nexport const typePolicies: TypePolicies = {\n Query: {\n fields: {\n \u002F\u002F query name\n listItems: {\n \u002F\u002F apollo will serialize and use keyArgs as unique\n \u002F\u002F identifier in cache for every query\n \u002F\u002F consider choosing the right fields, \n \u002F\u002F i.e. limit and offset won't work here\n keyArgs: [\n 'sort', \u002F\u002F primitive type\n 'filter', ['name', 'type'] \u002F\u002F nested fields of `filter`\n ],\n merge: mergeItemsWithTotalCount,\n },\n }\n}\n","\u002F** merges all sources with { items: unknown[], totalCount: number } *\u002F\nconst mergeItemsWithTotalCount = (existing, incoming, { args }) =\u003E {\n \u002F\u002F no existing data\n if (!existing || !args?.offset || args.offset \u003C existing.length) {\n return incoming || [];\n }\n\n \u002F\u002F If hook was called multiple times\n if (existing?.items?.length && args?.offset \u003C existing.items.length) {\n return existing || [];\n }\n\n \u002F\u002F merge cache and incoming data\n const items = [...(existing?.items || []), ...(incoming?.items || [])];\n\n \u002F\u002F apply latest result for totalCount\n const totalCount = incoming?.totalCount || existing?.totalCount;\n\n return {\n ...(incoming || existing || {}),\n items,\n totalCount,\n };\n };\n","(","String","offset","}"," (","args","return","Apollo Client Pagination","\u002Fgraphql\u002Fapollo-client-pagination","root","Say, we have ","gql"," response like this and we wan't to have pagination with it. Let's merge it as it specified in ","a","https:\u002F\u002Fwww.apollographql.com\u002Fdocs\u002Freact\u002Fcaching\u002Fcache-field-behavior\u002F#the-merge-function","nofollow","official documentation","We will setup "," with "," to merge incoming data in cache:","We will need merge function ",", which will join results of query and cached data for specific key:","Filter","Number","ItemList","ct-eac85e","type","InMemoryCache",";","new","\u002F\u002F ..."," ","ct-9dffe1","if"," [];"," }","...",2)) \ No newline at end of file diff --git a/docs/graphql/apollo-client-pagination/index.html b/docs/graphql/apollo-client-pagination/index.html index 316fbb8..8e03756 100644 --- a/docs/graphql/apollo-client-pagination/index.html +++ b/docs/graphql/apollo-client-pagination/index.html @@ -1,6 +1,6 @@ -Apollo Client Pagination • Obsidian Garden -

Apollo Client Pagination

Say, we have gql response like this and we wan't to have pagination with it. Let's merge it as it specified in official documentation

query listItems(  filter: Filter,   sort: String,  limit: Number,  offset: Number,): ItemList!input Filter {  name: String!  type: String!}type ItemList {  items: [Item!]!  totalCount: Int!}

We will setup ApolloClient with typePolicies to merge incoming data in cache:

import { ApolloClient, InMemoryCache } from '@apollo/client';const client = new ApolloClient({  // ...  cache: new InMemoryCache({ typePolicies }),  // ...});export const typePolicies: TypePolicies = {  Query: {    fields: {      // query name      listItems: {        // apollo will serialize and use keyArgs as unique        // identifier in cache for every query        // consider choosing the right fields,         // i.e. limit and offset won't work here        keyArgs: [          'sort', // primitive type          'filter', ['name', 'type'] // nested fields of `filter`        ],        merge: mergeItemsWithTotalCount,      },  }}

We will need merge function mergeItemsWithTotalCount, which will join results of query and cached data for specific key:

/** merges all sources with { items: unknown[], totalCount: number } */const mergeItemsWithTotalCount = (existing, incoming, { args }) => {    // no existing data    if (!existing || !args?.offset || args.offset < existing      return incoming || [];    }    // If hook was called multiple times    if (existing?.items?.      return existing || [];    }    // merge cache and incoming data    const items = [...(existing?.items ||     // apply latest result for totalCount    const totalCount = incoming?.totalCount || existing?.totalCount;    return {      ...(incoming ||       items,      totalCount,    };  };
btw, have a nice day
(2018 - 2024) muerwre
+

Apollo Client Pagination

Say, we have gql response like this and we wan't to have pagination with it. Let's merge it as it specified in official documentation

query listItems(  filter: Filter,   sort: String,  limit: Number,  offset: Number,): ItemList!input Filter {  name: String!  type: String!}type ItemList {  items: [Item!]!  totalCount: Int!}

We will setup ApolloClient with typePolicies to merge incoming data in cache:

import { ApolloClient, InMemoryCache } from '@apollo/client';const client = new ApolloClient({  // ...  cache: new InMemoryCache({ typePolicies }),  // ...});export const typePolicies: TypePolicies = {  Query: {    fields: {      // query name      listItems: {        // apollo will serialize and use keyArgs as unique        // identifier in cache for every query        // consider choosing the right fields,         // i.e. limit and offset won't work here        keyArgs: [          'sort', // primitive type          'filter', ['name', 'type'] // nested fields of `filter`        ],        merge: mergeItemsWithTotalCount,      },  }}

We will need merge function mergeItemsWithTotalCount, which will join results of query and cached data for specific key:

/** merges all sources with { items: unknown[], totalCount: number } */const mergeItemsWithTotalCount = (existing, incoming, { args }) => {    // no existing data    if (!existing || !args?.offset || args.offset < existing      return incoming || [];    }    // If hook was called multiple times    if (existing?.items?.      return existing || [];    }    // merge cache and incoming data    const items = [...(existing?.items ||     // apply latest result for totalCount    const totalCount = incoming?.totalCount || existing?.totalCount;    return {      ...(incoming ||       items,      totalCount,    };  };
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/graphql/refresh-token-in-apollo-client/_payload.js b/docs/graphql/refresh-token-in-apollo-client/_payload.js index 8ce3a89..e682716 100644 --- a/docs/graphql/refresh-token-in-apollo-client/_payload.js +++ b/docs/graphql/refresh-token-in-apollo-client/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC,aD,aE,aF,aG,aH,aI,aJ,aK,aL,aM,aN,aO,aP,aQ,aR,aS,aT,aU,aV,aW,aX,aY,aZ,a_,a$,ba,bb,bc,bd,be,bf,bg,bh,bi,bj,bk,bl,bm,bn,bo,bp,bq,br,bs,bt,bu,bv,bw,bx,by,bz,bA,bB){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:aN,_path:aO}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-4TVlzFXfLi":{_path:aO,_dir:"graphql",_draft:at,_partial:at,_locale:"en",_empty:at,title:aN,description:au,excerpt:{type:aP,children:[{type:a,tag:ag,props:{},children:[{type:c,value:au}]},{type:a,tag:E,props:{code:av,language:ah},children:[{type:a,tag:ai,props:{},children:[{type:a,tag:E,props:{__ignoreMap:Y},children:[{type:c,value:av}]}]}]},{type:a,tag:ag,props:{},children:[{type:c,value:aQ},{type:a,tag:aj,props:{},children:[{type:c,value:ak}]},{type:c,value:aR},{type:a,tag:aj,props:{},children:[{type:c,value:Z}]},{type:c,value:aS}]},{type:a,tag:E,props:{code:aw,language:ah},children:[{type:a,tag:ai,props:{},children:[{type:a,tag:E,props:{__ignoreMap:Y},children:[{type:c,value:aw}]}]}]}]},body:{type:aP,children:[{type:a,tag:ag,props:{},children:[{type:c,value:au}]},{type:a,tag:E,props:{code:av,language:ah},children:[{type:a,tag:ai,props:{},children:[{type:a,tag:E,props:{__ignoreMap:Y},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:aT}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"createApolloClient"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:aU}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:al}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:aV}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:S},children:[{type:c,value:aW}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:" { "}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:aX}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:" },"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:ax},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:" { "}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:ay}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aY}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:aA}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:aZ}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" \u003E,"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"ApolloClientBase"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:a_}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:a$}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" link: "}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"ApolloLink"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"from"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"(["}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:a$}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:S},children:[{type:c,value:"setContext"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:"_"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:", { "}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:" }) "}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" headers: {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aW}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"(),"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" },"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ba}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bb}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"HttpLink"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:a_}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" uri: "}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aU}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" fetch: "}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:bc}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:al}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:am}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"),"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bb}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" ]),"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bd}]}]}]}]}]},{type:a,tag:ag,props:{},children:[{type:c,value:aQ},{type:a,tag:aj,props:{},children:[{type:c,value:ak}]},{type:c,value:aR},{type:a,tag:aj,props:{},children:[{type:c,value:Z}]},{type:c,value:aS}]},{type:a,tag:E,props:{code:aw,language:ah},children:[{type:a,tag:ai,props:{},children:[{type:a,tag:E,props:{__ignoreMap:Y},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F** Global singleton for refreshing promise *\u002F"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:k},children:[{type:c,value:"let"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:ax},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:an}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:X},children:[{type:c,value:an}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:P}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F** Checks if GraphQl errors has unauthenticated error *\u002F"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:S},children:[{type:c,value:ak}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:Q},children:[{type:c,value:be}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\u003C{ "}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"?:"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:Q},children:[{type:c,value:"ErrorCode"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:" }\u003E)"}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:be}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"isArray"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aC}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"some"}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"error"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"status"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bf}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:"ct-03d8ec"},children:[{type:c,value:"401"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F Distinguish unauthorized error here"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bd}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F** Detects if customFetch is sending refresh request *\u002F"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:S},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:Q},children:[{type:c,value:bg}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"try"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:$},children:[{type:c,value:bh}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:bh}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"operationName"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bf}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:ab},children:[{type:c,value:"'RefreshToken'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:P}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" } "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ao}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"e"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aD}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:X},children:[{type:c,value:"false"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:P}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"};"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F** fetchWithTokenRefresh is a custom fetch function with token refresh for apollo *\u002F"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:aT}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:$},children:[{type:c,value:bc}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" ("}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:al}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bi}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aV}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bi}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" { accessToken: "}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aY}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:X},children:[{type:c,value:aZ}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"\u003E"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" ) "}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:am}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:Q},children:[{type:c,value:bg}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aF}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:Q},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:Q},children:[{type:c,value:"Response"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F already refreshing token, wait for it and then use refreshed token"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F or use empty authorization if refreshing failed"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aC}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aC}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" ("}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"as"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:ax},children:[{type:c,value:"Record"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:am}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"\u003E)?."}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aX}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" ) {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:$},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bj}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:M}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aG}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ao}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bk}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:bl}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:ab},children:[{type:c,value:bm}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:P}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bn}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aH}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" authorization: "}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aI}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:am}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:")."}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aJ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:$},children:[{type:c,value:c}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bj}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:bo}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:c}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bp}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:$},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F check for unauthorized errors, if not present, just return result"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ad}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aK}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ad}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ak}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aF}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" ) {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:bo}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" ok: "}]},{type:a,tag:b,props:{class:X},children:[{type:c,value:"true"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:"unknown"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bq}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:br}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:c}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bq}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:c}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:br}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ba}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bs}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F If unauthorized, refresh token and try again"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aD}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"()"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:bt}]},{type:a,tag:b,props:{class:S},children:[{type:c,value:aJ}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:aL}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aF}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:Q},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:X},children:[{type:c,value:an}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:P}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aL}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aK}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ay}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aD}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bu}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:bv}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:ab},children:[{type:c,value:bw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aL}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aK}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ay}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:P}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" })"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bt}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ao}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bk}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:X},children:[{type:c,value:an}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:P}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F can't refresh token. logging out"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:al}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bp}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bu}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:bv}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:ab},children:[{type:c,value:bw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aM}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bs}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F success or any non-auth error"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:M}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:aG}]},{type:a,tag:b,props:{class:S},children:[{type:c,value:aJ}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F wait for other request's refreshing query to finish, when retry"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aI}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bx}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:by}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aH}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bz}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bA}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aM}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" })"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aG}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ao}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:bl}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aI}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bx}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:by}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aH}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bz}]},{type:a,tag:b,props:{class:ab},children:[{type:c,value:bm}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bA}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aM}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bn}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" });"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-e3a64a{color:#A5D6FF}.ct-fa659e{color:#79C0FF}.ct-03d8ec{color:#79C0FF}.ct-b9161f{color:#FFA657}.ct-f6b4b1{color:#79C0FF}.ct-e13940{color:#C9D1D9}.ct-c46233{color:#8B949E}.ct-474837{color:#FFA657}.ct-74cbcf{color:#FF7B72}.ct-950598{color:#D2A8FF}.ct-7a154e{color:#79C0FF}.ct-8cd428{color:#79C0FF}.ct-fea699{color:#FF7B72}.ct-130286{color:#FFA657}.ct-5c3e14{color:#C9D1D9}.ct-6ce606{color:#D2A8FF}.ct-47017b{color:#FF7B72}.ct-5af85c{color:#C9D1D9}.ct-e8f4d5{color:#FF7B72}.light .ct-e8f4d5{color:#859900}.light .ct-5af85c{color:#657B83}.light .ct-47017b{color:#073642}.light .ct-6ce606{color:#268BD2}.light .ct-5c3e14{color:#657B83}.light .ct-130286{color:#657B83}.light .ct-fea699{color:#859900}.light .ct-8cd428{color:#859900}.light .ct-7a154e{color:#859900}.light .ct-950598{color:#268BD2}.light .ct-74cbcf{color:#073642}.light .ct-474837{color:#268BD2}.light .ct-c46233{color:#93A1A1}.light .ct-e13940{color:#268BD2}.light .ct-f6b4b1{color:#B58900}.light .ct-b9161f{color:#268BD2}.light .ct-03d8ec{color:#D33682}.light .ct-fa659e{color:#268BD2}.light .ct-e3a64a{color:#2AA198}"}]}],toc:{title:Y,searchDepth:bB,depth:bB,links:[]}},_type:"markdown",_id:"content:GraphQL:Refresh token in Apollo client.md",_source:"content",_file:"GraphQL\u002FRefresh token in Apollo client.md",_extension:"md"}},prerenderedAt:1711020227703}}("element","span","text","ct-5af85c","line"," ","ct-5c3e14","ct-e8f4d5","ct-e13940","ct-6ce606","ct-47017b","=\u003E","(","ct-fea699",":","ct-c46233"," ","ct-130286","ct-74cbcf"," {","string","=",","," "," (","ct-8cd428"," ",".","options","return","code"," ","ct-7a154e"," ","const","async"," ","...","refreshingPromise","\u003C","headers",";","ct-b9161f"," () ","ct-950598","refreshToken","Promise",") ","new","ct-f6b4b1","","isRefreshRequestOptions","errors","ct-fa659e",");","ct-e3a64a","!","||","json"," ","p","typescript","pre","code-inline","hasUnauthorizedError","logout",", ","null","catch","uri","if","newAccessToken","resolve",false,"If your GraphQL api needs token refresh option, you can pass custom fetch function for Apollo Client.","export const createApolloClient = (\n url: string,\n logout: () =\u003E void,\n getAuthorizationData: () =\u003E { authorization: string },\n refreshToken: () =\u003E Promise\u003C\n { accessToken: string; refreshToken: string } | undefined\n \u003E,\n) =\u003E\n new ApolloClientBase({\n \u002F\u002F ...other options\n link: ApolloLink.from([\n \u002F\u002F ...other options\n setContext(async (_, { headers }) =\u003E {\n return {\n headers: {\n ...headers,\n ...getAuthorizationData(),\n },\n };\n }),\n new HttpLink({\n uri: url,\n fetch: fetchWithTokenRefresh(logout, refreshToken),\n }),\n ]),\n });\n","\u002F** Global singleton for refreshing promise *\u002F\nlet refreshingPromise: Promise\u003Cstring\u003E | null = null;\n\n\u002F** Checks if GraphQl errors has unauthenticated error *\u002F\nconst hasUnauthorizedError = (errors: Array\u003C{ code?: ErrorCode }\u003E): boolean =\u003E\n Array.isArray(errors) &&\n errors.some(error =\u003E {\n return error.status === 401; \u002F\u002F Distinguish unauthorized error here\n });\n\n\u002F** Detects if customFetch is sending refresh request *\u002F\nconst isRefreshRequestOptions = (options: RequestInit) =\u003E {\n try {\n const body = JSON.parse(options?.body as string);\n return body.operationName === 'RefreshToken';\n } catch (e) {\n return false;\n }\n};\n\n\u002F** fetchWithTokenRefresh is a custom fetch function with token refresh for apollo *\u002F\nexport const fetchWithTokenRefresh =\n (\n logout: () =\u003E void,\n refreshToken: () =\u003E Promise\u003C\n { accessToken: string; refreshToken: string } | undefined\n \u003E,\n ) =\u003E\n async (uri: string, options: RequestInit): Promise\u003CResponse\u003E =\u003E {\n \u002F\u002F already refreshing token, wait for it and then use refreshed token\n \u002F\u002F or use empty authorization if refreshing failed\n if (\n !isRefreshRequestOptions(options) &&\n refreshingPromise &&\n (options.headers as Record\u003Cstring, string\u003E)?.authorization\n ) {\n const newAccessToken = await refreshingPromise\n .catch(() =\u003E {\n \u002F\u002F refreshing token from other request failed, retry without authorization\n return '';\n });\n \n options.headers = {\n ...(options.headers || {}),\n authorization: newAccessToken,\n };\n }\n\n return fetch(uri, options).then(async response =\u003E {\n const text = await response.text();\n const json = JSON.parse(text);\n\n \u002F\u002F check for unauthorized errors, if not present, just return result\n if (\n isRefreshRequestOptions(options) ||\n !json?.errors ||\n !Array.isArray(json.errors) ||\n !hasUnauthorizedError(json.errors)\n ) {\n return {\n ...response,\n ok: true,\n json: async () =\u003E\n new Promise\u003Cunknown\u003E(resolve =\u003E {\n resolve(json);\n }),\n text: async () =\u003E\n new Promise\u003Cstring\u003E(resolve =\u003E {\n resolve(text);\n }),\n };\n }\n\n \u002F\u002F If unauthorized, refresh token and try again\n if (!refreshingPromise) {\n refreshingPromise = refreshToken()\n .then(async (tokens): Promise\u003Cstring\u003E =\u003E {\n refreshingPromise = null;\n\n if (!tokens?.accessToken) {\n throw new Error('Session expired');\n }\n\n return tokens?.accessToken;\n })\n .catch(() =\u003E {\n refreshingPromise = null;\n\n \u002F\u002F can't refresh token. logging out\n logout();\n throw new Error('Session expired');\n });\n }\n\n \u002F\u002F success or any non-auth error\n return refreshingPromise\n .then(async (newAccessToken: string) =\u003E {\n \u002F\u002F wait for other request's refreshing query to finish, when retry\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: newAccessToken,\n },\n });\n })\n .catch(async () =\u003E {\n \u002F\u002F refreshing token from other request failed, retry without authorization\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: '',\n },\n });\n });\n });\n };\n\n","ct-474837","accessToken","; ","|","\u003E ","&&",") {",": ",")"," ."," {}),","fetch","then","?.","tokens"," });","Refresh Token In Apollo Client","\u002Fgraphql\u002Frefresh-token-in-apollo-client","root","Custom fetch function for this request. You should tune "," and\n"," to match your api.","export","url","void","getAuthorizationData","authorization"," } ","undefined","({","\u002F\u002F ...other options"," };"," }),","fetchWithTokenRefresh"," });","Array","===","RequestInit","body",": () ","await","(() ","\u002F\u002F refreshing token from other request failed, retry without authorization","''"," });","response","();","\u003E("," }),"," }"," .","throw","Error","'Session expired'",", {"," headers: {"," authorization: "," },",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC,aD,aE,aF,aG,aH,aI,aJ,aK,aL,aM,aN,aO,aP,aQ,aR,aS,aT,aU,aV,aW,aX,aY,aZ,a_,a$,ba,bb,bc,bd,be,bf,bg,bh,bi,bj,bk,bl,bm,bn,bo,bp,bq,br,bs,bt,bu,bv,bw,bx,by,bz,bA,bB){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:aN,_path:aO}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-4TVlzFXfLi":{_path:aO,_dir:"graphql",_draft:at,_partial:at,_locale:"en",_empty:at,title:aN,description:au,excerpt:{type:aP,children:[{type:a,tag:ag,props:{},children:[{type:c,value:au}]},{type:a,tag:E,props:{code:av,language:ah},children:[{type:a,tag:ai,props:{},children:[{type:a,tag:E,props:{__ignoreMap:Y},children:[{type:c,value:av}]}]}]},{type:a,tag:ag,props:{},children:[{type:c,value:aQ},{type:a,tag:aj,props:{},children:[{type:c,value:ak}]},{type:c,value:aR},{type:a,tag:aj,props:{},children:[{type:c,value:Z}]},{type:c,value:aS}]},{type:a,tag:E,props:{code:aw,language:ah},children:[{type:a,tag:ai,props:{},children:[{type:a,tag:E,props:{__ignoreMap:Y},children:[{type:c,value:aw}]}]}]}]},body:{type:aP,children:[{type:a,tag:ag,props:{},children:[{type:c,value:au}]},{type:a,tag:E,props:{code:av,language:ah},children:[{type:a,tag:ai,props:{},children:[{type:a,tag:E,props:{__ignoreMap:Y},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:aT}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"createApolloClient"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:aU}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:al}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:aV}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:S},children:[{type:c,value:aW}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:" { "}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:aX}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:" },"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:ax},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:" { "}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:ay}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aY}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:aA}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:aZ}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" \u003E,"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"ApolloClientBase"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:a_}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:a$}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" link: "}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"ApolloLink"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"from"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"(["}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:a$}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:S},children:[{type:c,value:"setContext"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:"_"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:", { "}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:" }) "}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" headers: {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aW}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"(),"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" },"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ba}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bb}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"HttpLink"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:a_}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" uri: "}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aU}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" fetch: "}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:bc}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:al}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:am}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"),"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bb}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" ]),"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bd}]}]}]}]}]},{type:a,tag:ag,props:{},children:[{type:c,value:aQ},{type:a,tag:aj,props:{},children:[{type:c,value:ak}]},{type:c,value:aR},{type:a,tag:aj,props:{},children:[{type:c,value:Z}]},{type:c,value:aS}]},{type:a,tag:E,props:{code:aw,language:ah},children:[{type:a,tag:ai,props:{},children:[{type:a,tag:E,props:{__ignoreMap:Y},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F** Global singleton for refreshing promise *\u002F"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:k},children:[{type:c,value:"let"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:ax},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:an}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:X},children:[{type:c,value:an}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:P}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F** Checks if GraphQl errors has unauthenticated error *\u002F"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:S},children:[{type:c,value:ak}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:Q},children:[{type:c,value:be}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\u003C{ "}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"?:"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:Q},children:[{type:c,value:"ErrorCode"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:" }\u003E)"}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:be}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"isArray"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aC}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"some"}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"error"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"status"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bf}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:"ct-afc81b"},children:[{type:c,value:"401"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F Distinguish unauthorized error here"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bd}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F** Detects if customFetch is sending refresh request *\u002F"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:s},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:S},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:Q},children:[{type:c,value:bg}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"try"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:$},children:[{type:c,value:bh}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:bh}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"operationName"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bf}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:ab},children:[{type:c,value:"'RefreshToken'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:P}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" } "}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ao}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"e"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aD}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:X},children:[{type:c,value:"false"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:P}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"};"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F** fetchWithTokenRefresh is a custom fetch function with token refresh for apollo *\u002F"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:h},children:[{type:c,value:aT}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:$},children:[{type:c,value:bc}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" ("}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:al}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bi}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aV}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bi}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" { accessToken: "}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:az}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aY}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aA}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:X},children:[{type:c,value:aZ}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"\u003E"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" ) "}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:am}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:Q},children:[{type:c,value:bg}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aF}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:Q},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:Q},children:[{type:c,value:"Response"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F already refreshing token, wait for it and then use refreshed token"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F or use empty authorization if refreshing failed"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aC}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aC}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" ("}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:"as"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:ax},children:[{type:c,value:"Record"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:am}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"\u003E)?."}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aX}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" ) {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:$},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bj}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:M}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aG}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ao}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bk}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:bl}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:ab},children:[{type:c,value:bm}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:P}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bn}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aH}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" authorization: "}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aI}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:am}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:")."}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aJ}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:$},children:[{type:c,value:c}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bj}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:bo}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:c}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bp}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:$},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F check for unauthorized errors, if not present, just return result"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:Z}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ad}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aK}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ad}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ak}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:_}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aF}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" ) {"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:bo}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" ok: "}]},{type:a,tag:b,props:{class:X},children:[{type:c,value:"true"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:"unknown"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bq}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:br}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:c}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aE}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:bq}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:c}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:br}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ba}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bs}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F If unauthorized, refresh token and try again"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aD}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"()"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:bt}]},{type:a,tag:b,props:{class:S},children:[{type:c,value:aJ}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:aL}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aF}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:Q},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:aB}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:X},children:[{type:c,value:an}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:P}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aL}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aK}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ay}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aD}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bu}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:bv}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:ab},children:[{type:c,value:bw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" }"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:aL}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aK}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ay}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:P}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" })"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bt}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ao}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bk}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:X},children:[{type:c,value:an}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:P}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F can't refresh token. logging out"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:al}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bp}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:bu}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:G},children:[{type:c,value:bv}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:ab},children:[{type:c,value:bw}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aM}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bs}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F success or any non-auth error"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:M}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:g},children:[{type:c,value:aG}]},{type:a,tag:b,props:{class:S},children:[{type:c,value:aJ}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:y}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:z},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:s},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"\u002F\u002F wait for other request's refreshing query to finish, when retry"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aI}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bx}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:by}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aH}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bz}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bA}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aM}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" })"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aG}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:ao}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:bl}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:aI}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:bx}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:by}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:f}]},{type:a,tag:b,props:{class:h},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aH}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bz}]},{type:a,tag:b,props:{class:ab},children:[{type:c,value:bm}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bA}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:aM}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:bn}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" });"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" };"}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-8edec8{color:#A5D6FF}.ct-73c394{color:#79C0FF}.ct-afc81b{color:#79C0FF}.ct-b67ae4{color:#FFA657}.ct-fa24e7{color:#79C0FF}.ct-6c128f{color:#C9D1D9}.ct-4762e0{color:#8B949E}.ct-90393e{color:#FFA657}.ct-f419fe{color:#FF7B72}.ct-2c2f82{color:#D2A8FF}.ct-ad18b4{color:#79C0FF}.ct-f22a4a{color:#79C0FF}.ct-67bf9e{color:#FF7B72}.ct-8f51b2{color:#FFA657}.ct-9341de{color:#C9D1D9}.ct-701850{color:#D2A8FF}.ct-c8d8bc{color:#FF7B72}.ct-f6697b{color:#C9D1D9}.ct-323b77{color:#FF7B72}.light .ct-323b77{color:#859900}.light .ct-f6697b{color:#657B83}.light .ct-c8d8bc{color:#073642}.light .ct-701850{color:#268BD2}.light .ct-9341de{color:#657B83}.light .ct-8f51b2{color:#657B83}.light .ct-67bf9e{color:#859900}.light .ct-f22a4a{color:#859900}.light .ct-ad18b4{color:#859900}.light .ct-2c2f82{color:#268BD2}.light .ct-f419fe{color:#073642}.light .ct-90393e{color:#268BD2}.light .ct-4762e0{color:#93A1A1}.light .ct-6c128f{color:#268BD2}.light .ct-fa24e7{color:#B58900}.light .ct-b67ae4{color:#268BD2}.light .ct-afc81b{color:#D33682}.light .ct-73c394{color:#268BD2}.light .ct-8edec8{color:#2AA198}"}]}],toc:{title:Y,searchDepth:bB,depth:bB,links:[]}},_type:"markdown",_id:"content:GraphQL:Refresh token in Apollo client.md",_source:"content",_file:"GraphQL\u002FRefresh token in Apollo client.md",_extension:"md"}},prerenderedAt:1711020862013}}("element","span","text","ct-f6697b","line"," ","ct-9341de","ct-323b77","ct-6c128f","ct-701850","ct-c8d8bc","=\u003E","(","ct-67bf9e",":","ct-4762e0"," ","ct-8f51b2","ct-f419fe"," {","string","=",","," "," (","ct-f22a4a"," ",".","options","return","code"," ","ct-ad18b4"," ","const","async"," ","...","refreshingPromise","\u003C","headers",";","ct-b67ae4"," () ","ct-2c2f82","refreshToken","Promise",") ","new","ct-fa24e7","","isRefreshRequestOptions","errors","ct-73c394",");","ct-8edec8","!","||","json"," ","p","typescript","pre","code-inline","hasUnauthorizedError","logout",", ","null","catch","uri","if","newAccessToken","resolve",false,"If your GraphQL api needs token refresh option, you can pass custom fetch function for Apollo Client.","export const createApolloClient = (\n url: string,\n logout: () =\u003E void,\n getAuthorizationData: () =\u003E { authorization: string },\n refreshToken: () =\u003E Promise\u003C\n { accessToken: string; refreshToken: string } | undefined\n \u003E,\n) =\u003E\n new ApolloClientBase({\n \u002F\u002F ...other options\n link: ApolloLink.from([\n \u002F\u002F ...other options\n setContext(async (_, { headers }) =\u003E {\n return {\n headers: {\n ...headers,\n ...getAuthorizationData(),\n },\n };\n }),\n new HttpLink({\n uri: url,\n fetch: fetchWithTokenRefresh(logout, refreshToken),\n }),\n ]),\n });\n","\u002F** Global singleton for refreshing promise *\u002F\nlet refreshingPromise: Promise\u003Cstring\u003E | null = null;\n\n\u002F** Checks if GraphQl errors has unauthenticated error *\u002F\nconst hasUnauthorizedError = (errors: Array\u003C{ code?: ErrorCode }\u003E): boolean =\u003E\n Array.isArray(errors) &&\n errors.some(error =\u003E {\n return error.status === 401; \u002F\u002F Distinguish unauthorized error here\n });\n\n\u002F** Detects if customFetch is sending refresh request *\u002F\nconst isRefreshRequestOptions = (options: RequestInit) =\u003E {\n try {\n const body = JSON.parse(options?.body as string);\n return body.operationName === 'RefreshToken';\n } catch (e) {\n return false;\n }\n};\n\n\u002F** fetchWithTokenRefresh is a custom fetch function with token refresh for apollo *\u002F\nexport const fetchWithTokenRefresh =\n (\n logout: () =\u003E void,\n refreshToken: () =\u003E Promise\u003C\n { accessToken: string; refreshToken: string } | undefined\n \u003E,\n ) =\u003E\n async (uri: string, options: RequestInit): Promise\u003CResponse\u003E =\u003E {\n \u002F\u002F already refreshing token, wait for it and then use refreshed token\n \u002F\u002F or use empty authorization if refreshing failed\n if (\n !isRefreshRequestOptions(options) &&\n refreshingPromise &&\n (options.headers as Record\u003Cstring, string\u003E)?.authorization\n ) {\n const newAccessToken = await refreshingPromise\n .catch(() =\u003E {\n \u002F\u002F refreshing token from other request failed, retry without authorization\n return '';\n });\n \n options.headers = {\n ...(options.headers || {}),\n authorization: newAccessToken,\n };\n }\n\n return fetch(uri, options).then(async response =\u003E {\n const text = await response.text();\n const json = JSON.parse(text);\n\n \u002F\u002F check for unauthorized errors, if not present, just return result\n if (\n isRefreshRequestOptions(options) ||\n !json?.errors ||\n !Array.isArray(json.errors) ||\n !hasUnauthorizedError(json.errors)\n ) {\n return {\n ...response,\n ok: true,\n json: async () =\u003E\n new Promise\u003Cunknown\u003E(resolve =\u003E {\n resolve(json);\n }),\n text: async () =\u003E\n new Promise\u003Cstring\u003E(resolve =\u003E {\n resolve(text);\n }),\n };\n }\n\n \u002F\u002F If unauthorized, refresh token and try again\n if (!refreshingPromise) {\n refreshingPromise = refreshToken()\n .then(async (tokens): Promise\u003Cstring\u003E =\u003E {\n refreshingPromise = null;\n\n if (!tokens?.accessToken) {\n throw new Error('Session expired');\n }\n\n return tokens?.accessToken;\n })\n .catch(() =\u003E {\n refreshingPromise = null;\n\n \u002F\u002F can't refresh token. logging out\n logout();\n throw new Error('Session expired');\n });\n }\n\n \u002F\u002F success or any non-auth error\n return refreshingPromise\n .then(async (newAccessToken: string) =\u003E {\n \u002F\u002F wait for other request's refreshing query to finish, when retry\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: newAccessToken,\n },\n });\n })\n .catch(async () =\u003E {\n \u002F\u002F refreshing token from other request failed, retry without authorization\n\n return fetch(uri, {\n ...options,\n headers: {\n ...(options.headers || {}),\n authorization: '',\n },\n });\n });\n });\n };\n\n","ct-90393e","accessToken","; ","|","\u003E ","&&",") {",": ",")"," ."," {}),","fetch","then","?.","tokens"," });","Refresh Token In Apollo Client","\u002Fgraphql\u002Frefresh-token-in-apollo-client","root","Custom fetch function for this request. You should tune "," and\n"," to match your api.","export","url","void","getAuthorizationData","authorization"," } ","undefined","({","\u002F\u002F ...other options"," };"," }),","fetchWithTokenRefresh"," });","Array","===","RequestInit","body",": () ","await","(() ","\u002F\u002F refreshing token from other request failed, retry without authorization","''"," });","response","();","\u003E("," }),"," }"," .","throw","Error","'Session expired'",", {"," headers: {"," authorization: "," },",2)) \ No newline at end of file diff --git a/docs/graphql/refresh-token-in-apollo-client/index.html b/docs/graphql/refresh-token-in-apollo-client/index.html index 88e6499..2bbf611 100644 --- a/docs/graphql/refresh-token-in-apollo-client/index.html +++ b/docs/graphql/refresh-token-in-apollo-client/index.html @@ -1,7 +1,7 @@ -Refresh Token In Apollo Client • Obsidian Garden -

Refresh Token In Apollo Client

If your GraphQL api needs token refresh option, you can pass custom fetch function for Apollo Client.

export const createApolloClient = (  url: string,  logout: () => void,  getAuthorizationData: () => { authorization: string },  refreshToken: () => Promise<    { accessToken: string; refreshToken: string } | undefined  >,) =>  new ApolloClientBase({    // ...other options    link: ApolloLink.from([      // ...other options      setContext(async (_, { headers }) => {        return {          headers: {            ...headers,            ...getAuthorizationData(),          },        };      }),      new HttpLink({        uri: url,        fetch: fetchWithTokenRefresh(logout, refreshToken),      }),    ]),  });

Custom fetch function for this request. You should tune hasUnauthorizedError and -isRefreshRequestOptions to match your api.

/** Global singleton for refreshing promise */let refreshingPromise: Promise<string> | null = null;/** Checks if GraphQl errors has unauthenticated error */const hasUnauthorizedError = (errors: Array<{ code?: ErrorCode }>): =>  Array.isArray(errors) &&  errors.some=> {    return error.status === 401; // Distinguish unauthorized error here  });/** Detects if customFetch is sending refresh request */const isRefreshRequestOptions = (options: RequestInit) => {  try {    const body = string);    return body.operationName === 'RefreshToken';  } catch (e) {    return false;  }};/** fetchWithTokenRefresh is a custom fetch function with token refresh for apollo */export const fetchWithTokenRefresh =  (    logout: () => void,    refreshToken: () =>       { accessToken: string; refreshToken: string } | undefined    >,  ) =>  async (uri: string, options: RequestInit): Promise<Response> => {    // already refreshing token, wait for it and then use refreshed token    // or use empty authorization if refreshing failed    if (      !isRefreshRequestOptions(options) &&      refreshingPromise &&      (options.headers as Record<string, string>)?.authorization    ) {      const newAccessToken = await refreshingPromise        .catch(() => {          // refreshing token from other request failed, retry without authorization          return '';        });            options.headers = {        ...(options.headers || {}),        authorization: newAccessToken,      };    }    return fetch(uri, options).then(async      const text = await response.text();      const json =      // check for unauthorized errors, if not present, just return result      if (        isRefreshRequestOptions(options) ||        !json?.errors ||                !hasUnauthorizedError(json.errors)      ) {        return {          ...response,          ok: true,          json: async () =>            new Promise<unknown>(resolve => {              resolve(json);            }),          text: async () =>            new Promise<string>(resolve => {              resolve(text);            }),        };      }      // If unauthorized, refresh token and try again      if (!refreshingPromise) {        refreshingPromise = refreshToken()          .then(async (tokens): Promise<string> => {            refreshingPromise = null;            if (!tokens?.accessToken) {              throw new Error('Session expired');            }            return tokens?.accessToken;          })          .catch(() => {            refreshingPromise = null;            // can't refresh token. logging out            logout();            throw new Error('Session expired');          });      }      // success or any non-auth error      return refreshingPromise        .then(async (newAccessToken: string) => {          // wait for other request's refreshing query to finish, when retry          return fetch(uri, {            ...options,            headers: {              ...(options.headers || {}),              authorization: newAccessToken,            },          });        })        .catch(async () => {          // refreshing token from other request failed, retry without authorization          return fetch(uri, {            ...options,            headers: {              ...(options.headers || {}),              authorization: '',            },          });        });    });  };
btw, have a nice day
(2018 - 2024) muerwre
+

Refresh Token In Apollo Client

If your GraphQL api needs token refresh option, you can pass custom fetch function for Apollo Client.

export const createApolloClient = (  url: string,  logout: () => void,  getAuthorizationData: () => { authorization: string },  refreshToken: () => Promise<    { accessToken: string; refreshToken: string } | undefined  >,) =>  new ApolloClientBase({    // ...other options    link: ApolloLink.from([      // ...other options      setContext(async (_, { headers }) => {        return {          headers: {            ...headers,            ...getAuthorizationData(),          },        };      }),      new HttpLink({        uri: url,        fetch: fetchWithTokenRefresh(logout, refreshToken),      }),    ]),  });

Custom fetch function for this request. You should tune hasUnauthorizedError and +isRefreshRequestOptions to match your api.

/** Global singleton for refreshing promise */let refreshingPromise: Promise<string> | null = null;/** Checks if GraphQl errors has unauthenticated error */const hasUnauthorizedError = (errors: Array<{ code?: ErrorCode }>): =>  Array.isArray(errors) &&  errors.some=> {    return error.status === 401; // Distinguish unauthorized error here  });/** Detects if customFetch is sending refresh request */const isRefreshRequestOptions = (options: RequestInit) => {  try {    const body = string);    return body.operationName === 'RefreshToken';  } catch (e) {    return false;  }};/** fetchWithTokenRefresh is a custom fetch function with token refresh for apollo */export const fetchWithTokenRefresh =  (    logout: () => void,    refreshToken: () =>       { accessToken: string; refreshToken: string } | undefined    >,  ) =>  async (uri: string, options: RequestInit): Promise<Response> => {    // already refreshing token, wait for it and then use refreshed token    // or use empty authorization if refreshing failed    if (      !isRefreshRequestOptions(options) &&      refreshingPromise &&      (options.headers as Record<string, string>)?.authorization    ) {      const newAccessToken = await refreshingPromise        .catch(() => {          // refreshing token from other request failed, retry without authorization          return '';        });            options.headers = {        ...(options.headers || {}),        authorization: newAccessToken,      };    }    return fetch(uri, options).then(async      const text = await response.text();      const json =      // check for unauthorized errors, if not present, just return result      if (        isRefreshRequestOptions(options) ||        !json?.errors ||                !hasUnauthorizedError(json.errors)      ) {        return {          ...response,          ok: true,          json: async () =>            new Promise<unknown>(resolve => {              resolve(json);            }),          text: async () =>            new Promise<string>(resolve => {              resolve(text);            }),        };      }      // If unauthorized, refresh token and try again      if (!refreshingPromise) {        refreshingPromise = refreshToken()          .then(async (tokens): Promise<string> => {            refreshingPromise = null;            if (!tokens?.accessToken) {              throw new Error('Session expired');            }            return tokens?.accessToken;          })          .catch(() => {            refreshingPromise = null;            // can't refresh token. logging out            logout();            throw new Error('Session expired');          });      }      // success or any non-auth error      return refreshingPromise        .then(async (newAccessToken: string) => {          // wait for other request's refreshing query to finish, when retry          return fetch(uri, {            ...options,            headers: {              ...(options.headers || {}),              authorization: newAccessToken,            },          });        })        .catch(async () => {          // refreshing token from other request failed, retry without authorization          return fetch(uri, {            ...options,            headers: {              ...(options.headers || {}),              authorization: '',            },          });        });    });  };
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/index.html b/docs/index.html index 7539480..1716354 100644 --- a/docs/index.html +++ b/docs/index.html @@ -1,6 +1,6 @@ -Obsidian Garden -

Welcome to my Obsidian Garden

Obsidian is a note-taking app, that I use to store chunks of code and technical documentation. Here's the frontend for my notebook.

There's also my Curriculum Vitae and contact info here.

It's me, muerwre
btw, have a nice day
(2018 - 2024) muerwre
+

Welcome to my Obsidian Garden

Obsidian is a note-taking app, that I use to store chunks of code and technical documentation. Here's the frontend for my notebook.

There's also my Curriculum Vitae and contact info here.

It's me, muerwre
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/linux/certbot-well-known-auto-renew/_payload.js b/docs/linux/certbot-well-known-auto-renew/_payload.js index 2d22147..c2e058b 100644 --- a/docs/linux/certbot-well-known-auto-renew/_payload.js +++ b/docs/linux/certbot-well-known-auto-renew/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:v,_path:w},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-h5bgYxRbdF":{_path:w,_dir:"linux",_draft:n,_partial:n,_locale:"en",_empty:n,title:v,description:"This is translation of article from clsv.ru, which explains how to automate certbot's well-known, also known as HTTP challenge for wildcard certs renewal.",excerpt:{type:x,children:[{type:a,tag:l,props:{},children:[{type:b,value:y},{type:a,tag:z,props:{href:A,rel:[B]},children:[{type:b,value:C}]},{type:b,value:D}]},{type:a,tag:l,props:{},children:[{type:b,value:E}]},{type:a,tag:h,props:{},children:[{type:a,tag:i,props:{},children:[{type:b,value:F}]}]},{type:a,tag:d,props:{code:o,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:g},children:[{type:b,value:o}]}]}]},{type:a,tag:h,props:{start:m},children:[{type:a,tag:i,props:{},children:[{type:b,value:G}]}]},{type:a,tag:d,props:{code:p,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:g},children:[{type:b,value:p}]}]}]},{type:a,tag:h,props:{start:H},children:[{type:a,tag:i,props:{},children:[{type:b,value:I}]}]},{type:a,tag:d,props:{code:q,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:g},children:[{type:b,value:q}]}]}]},{type:a,tag:h,props:{start:J},children:[{type:a,tag:i,props:{},children:[{type:b,value:K}]}]},{type:a,tag:d,props:{code:r,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:g},children:[{type:b,value:r}]}]}]},{type:a,tag:l,props:{},children:[{type:b,value:L},{type:a,tag:M,props:{},children:[{type:b,value:N}]},{type:b,value:O}]}]},body:{type:x,children:[{type:a,tag:l,props:{},children:[{type:b,value:y},{type:a,tag:z,props:{href:A,rel:[B]},children:[{type:b,value:C}]},{type:b,value:D}]},{type:a,tag:l,props:{},children:[{type:b,value:E}]},{type:a,tag:h,props:{},children:[{type:a,tag:i,props:{},children:[{type:b,value:F}]}]},{type:a,tag:d,props:{code:o,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:g},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:P},children:[{type:b,value:Q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:"ct-5e1d2f"},children:[{type:b,value:"echo"}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:R}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:u},children:[{type:b,value:"CERTBOT_VALIDATION"}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:R}]},{type:a,tag:c,props:{class:"ct-d4cb39"},children:[{type:b,value:"\u003E"}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:" \u002Fvar\u002Fwww\u002Fhtml\u002F.well-known\u002F"}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:u},children:[{type:b,value:S}]}]}]}]}]},{type:a,tag:h,props:{start:m},children:[{type:a,tag:i,props:{},children:[{type:b,value:G}]}]},{type:a,tag:d,props:{code:p,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:g},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:P},children:[{type:b,value:Q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"rm -f \u002Fvar\u002Fwww\u002Fhtml\u002F.well-known\u002F"}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:u},children:[{type:b,value:S}]}]}]}]}]},{type:a,tag:h,props:{start:H},children:[{type:a,tag:i,props:{},children:[{type:b,value:I}]}]},{type:a,tag:d,props:{code:q,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:g},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"certbot certonly \\"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:" --preferred-challenges=http --manual \\"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:T}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:" --manual-cleanup-hook \u002Foath\u002Fto\u002Fclean.sh"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:" -d "}]},{type:a,tag:c,props:{class:"ct-8f08f4"},children:[{type:b,value:"\"yourhost.org,*.yourhost.org\""}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:" \\"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:" --manual-public-ip-logging-ok"}]}]}]}]}]},{type:a,tag:h,props:{start:J},children:[{type:a,tag:i,props:{},children:[{type:b,value:K}]}]},{type:a,tag:d,props:{code:r,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:g},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"certbot renew --manual-public-ip-logging-ok \\"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:T}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:" --manual-cleanup-hook \u002Fpath\u002Fto\u002Fclean.sh"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"systemctl reload nginx"}]}]}]}]}]},{type:a,tag:l,props:{},children:[{type:b,value:L},{type:a,tag:M,props:{},children:[{type:b,value:N}]},{type:b,value:O}]},{type:a,tag:"style",children:[{type:b,value:".ct-8f08f4{color:#A5D6FF}.ct-d4cb39{color:#FF7B72}.ct-61baa0{color:#C9D1D9}.ct-0f1e10{color:#C9D1D9}.ct-722310{color:#C9D1D9}.ct-5e1d2f{color:#79C0FF}.ct-30b3d5{color:#8B949E}.light .ct-30b3d5{color:#93A1A1}.light .ct-5e1d2f{color:#268BD2}.light .ct-722310{color:#657B83}.light .ct-0f1e10{color:#859900}.light .ct-61baa0{color:#268BD2}.light .ct-d4cb39{color:#859900}.light .ct-8f08f4{color:#2AA198}"}]}],toc:{title:g,searchDepth:m,depth:m,links:[]}},_type:"markdown",_id:"content:Linux:Certbot well-known auto renew.md",_source:"content",_file:"Linux\u002FCertbot well-known auto renew.md",_extension:"md"}},prerenderedAt:1711020227763}}("element","text","span","code","line","ct-722310","","ol","li","shell","pre","p",2,false,"#!\u002Fbin\u002Fbash\necho $CERTBOT_VALIDATION \u003E \u002Fvar\u002Fwww\u002Fhtml\u002F.well-known\u002F$CERTBOT_TOKEN\n","#!\u002Fbin\u002Fbash\nrm -f \u002Fvar\u002Fwww\u002Fhtml\u002F.well-known\u002F$CERTBOT_TOKEN\n","certbot certonly \\\n --preferred-challenges=http --manual \\\n --manual-auth-hook \u002Fpath\u002Fto\u002Fauth.sh \\\n --manual-cleanup-hook \u002Foath\u002Fto\u002Fclean.sh\n -d \"yourhost.org,*.yourhost.org\" \\\n --manual-public-ip-logging-ok\n","certbot renew --manual-public-ip-logging-ok \\\n --manual-auth-hook \u002Fpath\u002Fto\u002Fauth.sh \\\n --manual-cleanup-hook \u002Fpath\u002Fto\u002Fclean.sh\n\nsystemctl reload nginx\n","ct-0f1e10","$","ct-61baa0","Certbot Well Known Auto Renew","\u002Flinux\u002Fcertbot-well-known-auto-renew","root","This is translation of article from ","a","https:\u002F\u002Fclsv.ru\u002Flinux\u002Flets_encrypt_eto_legko_i_prosto_60","nofollow","clsv.ru",", which explains how to automate certbot's well-known, also known as HTTP challenge for wildcard certs renewal.","You'll need 4 scripts:","Authentication script, which will write authentication file:","Cleanup script, that will delete that",3,"Initial cert acquiring script:",4,"Renewal script itself, to put it in crontab (or \u002Fetc\u002Fcron.weekly)","Don't forget to configure your http server to serve ","code-inline",".well-known",".","ct-30b3d5","#!\u002Fbin\u002Fbash"," ","CERTBOT_TOKEN"," --manual-auth-hook \u002Fpath\u002Fto\u002Fauth.sh \\")) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:v,_path:w},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-h5bgYxRbdF":{_path:w,_dir:"linux",_draft:n,_partial:n,_locale:"en",_empty:n,title:v,description:"This is translation of article from clsv.ru, which explains how to automate certbot's well-known, also known as HTTP challenge for wildcard certs renewal.",excerpt:{type:x,children:[{type:a,tag:l,props:{},children:[{type:b,value:y},{type:a,tag:z,props:{href:A,rel:[B]},children:[{type:b,value:C}]},{type:b,value:D}]},{type:a,tag:l,props:{},children:[{type:b,value:E}]},{type:a,tag:h,props:{},children:[{type:a,tag:i,props:{},children:[{type:b,value:F}]}]},{type:a,tag:d,props:{code:o,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:g},children:[{type:b,value:o}]}]}]},{type:a,tag:h,props:{start:m},children:[{type:a,tag:i,props:{},children:[{type:b,value:G}]}]},{type:a,tag:d,props:{code:p,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:g},children:[{type:b,value:p}]}]}]},{type:a,tag:h,props:{start:H},children:[{type:a,tag:i,props:{},children:[{type:b,value:I}]}]},{type:a,tag:d,props:{code:q,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:g},children:[{type:b,value:q}]}]}]},{type:a,tag:h,props:{start:J},children:[{type:a,tag:i,props:{},children:[{type:b,value:K}]}]},{type:a,tag:d,props:{code:r,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:g},children:[{type:b,value:r}]}]}]},{type:a,tag:l,props:{},children:[{type:b,value:L},{type:a,tag:M,props:{},children:[{type:b,value:N}]},{type:b,value:O}]}]},body:{type:x,children:[{type:a,tag:l,props:{},children:[{type:b,value:y},{type:a,tag:z,props:{href:A,rel:[B]},children:[{type:b,value:C}]},{type:b,value:D}]},{type:a,tag:l,props:{},children:[{type:b,value:E}]},{type:a,tag:h,props:{},children:[{type:a,tag:i,props:{},children:[{type:b,value:F}]}]},{type:a,tag:d,props:{code:o,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:g},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:P},children:[{type:b,value:Q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:"ct-b712ed"},children:[{type:b,value:"echo"}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:R}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:u},children:[{type:b,value:"CERTBOT_VALIDATION"}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:R}]},{type:a,tag:c,props:{class:"ct-ab39e2"},children:[{type:b,value:"\u003E"}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:" \u002Fvar\u002Fwww\u002Fhtml\u002F.well-known\u002F"}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:u},children:[{type:b,value:S}]}]}]}]}]},{type:a,tag:h,props:{start:m},children:[{type:a,tag:i,props:{},children:[{type:b,value:G}]}]},{type:a,tag:d,props:{code:p,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:g},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:P},children:[{type:b,value:Q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"rm -f \u002Fvar\u002Fwww\u002Fhtml\u002F.well-known\u002F"}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:u},children:[{type:b,value:S}]}]}]}]}]},{type:a,tag:h,props:{start:H},children:[{type:a,tag:i,props:{},children:[{type:b,value:I}]}]},{type:a,tag:d,props:{code:q,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:g},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"certbot certonly \\"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:" --preferred-challenges=http --manual \\"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:T}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:" --manual-cleanup-hook \u002Foath\u002Fto\u002Fclean.sh"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:" -d "}]},{type:a,tag:c,props:{class:"ct-13b590"},children:[{type:b,value:"\"yourhost.org,*.yourhost.org\""}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:" \\"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:" --manual-public-ip-logging-ok"}]}]}]}]}]},{type:a,tag:h,props:{start:J},children:[{type:a,tag:i,props:{},children:[{type:b,value:K}]}]},{type:a,tag:d,props:{code:r,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:g},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"certbot renew --manual-public-ip-logging-ok \\"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:T}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:" --manual-cleanup-hook \u002Fpath\u002Fto\u002Fclean.sh"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:f},children:[{type:b,value:"systemctl reload nginx"}]}]}]}]}]},{type:a,tag:l,props:{},children:[{type:b,value:L},{type:a,tag:M,props:{},children:[{type:b,value:N}]},{type:b,value:O}]},{type:a,tag:"style",children:[{type:b,value:".ct-13b590{color:#A5D6FF}.ct-ab39e2{color:#FF7B72}.ct-80830f{color:#C9D1D9}.ct-4a3db1{color:#C9D1D9}.ct-3f309e{color:#C9D1D9}.ct-b712ed{color:#79C0FF}.ct-93e482{color:#8B949E}.light .ct-93e482{color:#93A1A1}.light .ct-b712ed{color:#268BD2}.light .ct-3f309e{color:#657B83}.light .ct-4a3db1{color:#859900}.light .ct-80830f{color:#268BD2}.light .ct-ab39e2{color:#859900}.light .ct-13b590{color:#2AA198}"}]}],toc:{title:g,searchDepth:m,depth:m,links:[]}},_type:"markdown",_id:"content:Linux:Certbot well-known auto renew.md",_source:"content",_file:"Linux\u002FCertbot well-known auto renew.md",_extension:"md"}},prerenderedAt:1711020862110}}("element","text","span","code","line","ct-3f309e","","ol","li","shell","pre","p",2,false,"#!\u002Fbin\u002Fbash\necho $CERTBOT_VALIDATION \u003E \u002Fvar\u002Fwww\u002Fhtml\u002F.well-known\u002F$CERTBOT_TOKEN\n","#!\u002Fbin\u002Fbash\nrm -f \u002Fvar\u002Fwww\u002Fhtml\u002F.well-known\u002F$CERTBOT_TOKEN\n","certbot certonly \\\n --preferred-challenges=http --manual \\\n --manual-auth-hook \u002Fpath\u002Fto\u002Fauth.sh \\\n --manual-cleanup-hook \u002Foath\u002Fto\u002Fclean.sh\n -d \"yourhost.org,*.yourhost.org\" \\\n --manual-public-ip-logging-ok\n","certbot renew --manual-public-ip-logging-ok \\\n --manual-auth-hook \u002Fpath\u002Fto\u002Fauth.sh \\\n --manual-cleanup-hook \u002Fpath\u002Fto\u002Fclean.sh\n\nsystemctl reload nginx\n","ct-4a3db1","$","ct-80830f","Certbot Well Known Auto Renew","\u002Flinux\u002Fcertbot-well-known-auto-renew","root","This is translation of article from ","a","https:\u002F\u002Fclsv.ru\u002Flinux\u002Flets_encrypt_eto_legko_i_prosto_60","nofollow","clsv.ru",", which explains how to automate certbot's well-known, also known as HTTP challenge for wildcard certs renewal.","You'll need 4 scripts:","Authentication script, which will write authentication file:","Cleanup script, that will delete that",3,"Initial cert acquiring script:",4,"Renewal script itself, to put it in crontab (or \u002Fetc\u002Fcron.weekly)","Don't forget to configure your http server to serve ","code-inline",".well-known",".","ct-93e482","#!\u002Fbin\u002Fbash"," ","CERTBOT_TOKEN"," --manual-auth-hook \u002Fpath\u002Fto\u002Fauth.sh \\")) \ No newline at end of file diff --git a/docs/linux/certbot-well-known-auto-renew/index.html b/docs/linux/certbot-well-known-auto-renew/index.html index 9e53592..a236263 100644 --- a/docs/linux/certbot-well-known-auto-renew/index.html +++ b/docs/linux/certbot-well-known-auto-renew/index.html @@ -1,6 +1,6 @@ -Certbot Well Known Auto Renew • Obsidian Garden -

Certbot Well Known Auto Renew

This is translation of article from clsv.ru, which explains how to automate certbot's well-known, also known as HTTP challenge for wildcard certs renewal.

You'll need 4 scripts:

  1. Authentication script, which will write authentication file:
#!/bin/bashecho $CERTBOT_VALIDATION > /var/www/html/.well-known/$CERTBOT_TOKEN
  1. Cleanup script, that will delete that
#!/bin/bashrm -f /var/www/html/.well-known/$CERTBOT_TOKEN
  1. Initial cert acquiring script:
certbot certonly \  --preferred-challenges=http --manual \  --manual-auth-hook /path/to/auth.sh \  --manual-cleanup-hook /oath/to/clean.sh  -d "yourhost.org,*.yourhost.org" \  --manual-public-ip-logging-ok
  1. Renewal script itself, to put it in crontab (or /etc/cron.weekly)
certbot renew --manual-public-ip-logging-ok \  --manual-auth-hook /path/to/auth.sh \  --manual-cleanup-hook /path/to/clean.shsystemctl reload nginx

Don't forget to configure your http server to serve .well-known.

btw, have a nice day
(2018 - 2024) muerwre
+

Certbot Well Known Auto Renew

This is translation of article from clsv.ru, which explains how to automate certbot's well-known, also known as HTTP challenge for wildcard certs renewal.

You'll need 4 scripts:

  1. Authentication script, which will write authentication file:
#!/bin/bashecho $CERTBOT_VALIDATION > /var/www/html/.well-known/$CERTBOT_TOKEN
  1. Cleanup script, that will delete that
#!/bin/bashrm -f /var/www/html/.well-known/$CERTBOT_TOKEN
  1. Initial cert acquiring script:
certbot certonly \  --preferred-challenges=http --manual \  --manual-auth-hook /path/to/auth.sh \  --manual-cleanup-hook /oath/to/clean.sh  -d "yourhost.org,*.yourhost.org" \  --manual-public-ip-logging-ok
  1. Renewal script itself, to put it in crontab (or /etc/cron.weekly)
certbot renew --manual-public-ip-logging-ok \  --manual-auth-hook /path/to/auth.sh \  --manual-cleanup-hook /path/to/clean.shsystemctl reload nginx

Don't forget to configure your http server to serve .well-known.

btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/linux/find-out-who-uses-swap/_payload.js b/docs/linux/find-out-who-uses-swap/_payload.js index 847f4c1..28123cc 100644 --- a/docs/linux/find-out-who-uses-swap/_payload.js +++ b/docs/linux/find-out-who-uses-swap/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:k,_path:l},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-wEk0a2qvIe":{_path:l,_dir:"linux",_draft:i,_partial:i,_locale:"en",_empty:i,title:k,description:g,excerpt:{type:m,children:[{type:a,tag:h,props:{code:j,language:n},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:g},children:[{type:b,value:j}]}]}]}]},body:{type:m,children:[{type:a,tag:h,props:{code:j,language:n},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:g},children:[{type:a,tag:c,props:{class:"line"},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:"for"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:"ct-d057a0"},children:[{type:b,value:"file"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:"in"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" \u002Fproc\u002F"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:"*"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"\u002Fstatus "}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:";"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:"do"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" awk "}]},{type:a,tag:c,props:{class:"ct-bfbbb0"},children:[{type:b,value:"'\u002FVmSwap|Name\u002F{printf $2 \" \" $3}END{ print \"\"}'"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:"done"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" sort -k 2 -n -r "}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" less"}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-bfbbb0{color:#A5D6FF}.ct-d057a0{color:#C9D1D9}.ct-6e3e30{color:#C9D1D9}.ct-c4cc87{color:#FF7B72}.light .ct-c4cc87{color:#859900}.light .ct-6e3e30{color:#657B83}.light .ct-d057a0{color:#268BD2}.light .ct-bfbbb0{color:#2AA198}"}]}],toc:{title:g,searchDepth:q,depth:q,links:[]}},_type:"markdown",_id:"content:Linux:Find out who uses swap.md",_source:"content",_file:"Linux\u002FFind out who uses swap.md",_extension:"md"}},prerenderedAt:1711020227781}}("element","text","span","ct-6e3e30","ct-c4cc87"," ","","code",false,"for file in \u002Fproc\u002F*\u002Fstatus ; do awk '\u002FVmSwap|Name\u002F{printf $2 \" \" $3}END{ print \"\"}' $file; done | sort -k 2 -n -r | less\n","Find Out Who Uses Swap","\u002Flinux\u002Ffind-out-who-uses-swap","root","shell","pre","|",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:k,_path:l},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-wEk0a2qvIe":{_path:l,_dir:"linux",_draft:i,_partial:i,_locale:"en",_empty:i,title:k,description:g,excerpt:{type:m,children:[{type:a,tag:h,props:{code:j,language:n},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:g},children:[{type:b,value:j}]}]}]}]},body:{type:m,children:[{type:a,tag:h,props:{code:j,language:n},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:g},children:[{type:a,tag:c,props:{class:"line"},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:"for"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:"ct-83057a"},children:[{type:b,value:"file"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:"in"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" \u002Fproc\u002F"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:"*"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"\u002Fstatus "}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:";"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:"do"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" awk "}]},{type:a,tag:c,props:{class:"ct-9a56ef"},children:[{type:b,value:"'\u002FVmSwap|Name\u002F{printf $2 \" \" $3}END{ print \"\"}'"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:"done"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:f}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" sort -k 2 -n -r "}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" less"}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-9a56ef{color:#A5D6FF}.ct-83057a{color:#C9D1D9}.ct-e0d9a3{color:#C9D1D9}.ct-444031{color:#FF7B72}.light .ct-444031{color:#859900}.light .ct-e0d9a3{color:#657B83}.light .ct-83057a{color:#268BD2}.light .ct-9a56ef{color:#2AA198}"}]}],toc:{title:g,searchDepth:q,depth:q,links:[]}},_type:"markdown",_id:"content:Linux:Find out who uses swap.md",_source:"content",_file:"Linux\u002FFind out who uses swap.md",_extension:"md"}},prerenderedAt:1711020862138}}("element","text","span","ct-e0d9a3","ct-444031"," ","","code",false,"for file in \u002Fproc\u002F*\u002Fstatus ; do awk '\u002FVmSwap|Name\u002F{printf $2 \" \" $3}END{ print \"\"}' $file; done | sort -k 2 -n -r | less\n","Find Out Who Uses Swap","\u002Flinux\u002Ffind-out-who-uses-swap","root","shell","pre","|",2)) \ No newline at end of file diff --git a/docs/linux/find-out-who-uses-swap/index.html b/docs/linux/find-out-who-uses-swap/index.html index 7769c7c..99cc1df 100644 --- a/docs/linux/find-out-who-uses-swap/index.html +++ b/docs/linux/find-out-who-uses-swap/index.html @@ -1,6 +1,6 @@ -Find Out Who Uses Swap • Obsidian Garden -

Find Out Who Uses Swap

for file in /proc/*/status ; do awk '/VmSwap|Name/{printf $2 " " $3}END{ print ""}' done | sort -k 2 -n -r | less
btw, have a nice day
(2018 - 2024) muerwre
+

Find Out Who Uses Swap

for file in /proc/*/status ; do awk '/VmSwap|Name/{printf $2 " " $3}END{ print ""}' done | sort -k 2 -n -r | less
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/linux/fixing-lagging-usb-headphones/_payload.js b/docs/linux/fixing-lagging-usb-headphones/_payload.js index 99c614c..a53a4dd 100644 --- a/docs/linux/fixing-lagging-usb-headphones/_payload.js +++ b/docs/linux/fixing-lagging-usb-headphones/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:C,_path:D},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-WBdE8kMsNc":{_path:D,_dir:"linux",_draft:s,_partial:s,_locale:"en",_empty:s,title:C,description:t,excerpt:{type:E,children:[{type:a,tag:i,props:{},children:[{type:b,value:t}]},{type:a,tag:d,props:{code:u,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:h},children:[{type:b,value:u}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:F},{type:a,tag:m,props:{},children:[{type:b,value:G}]},{type:b,value:H}]},{type:a,tag:d,props:{code:v,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:h},children:[{type:b,value:v}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:I}]},{type:a,tag:d,props:{code:w,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:h},children:[{type:b,value:w}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:J}]},{type:a,tag:d,props:{code:x,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:h},children:[{type:b,value:x}]}]}]},{type:a,tag:o,props:{id:y},children:[{type:b,value:z}]},{type:a,tag:p,props:{},children:[{type:a,tag:e,props:{},children:[{type:b,value:K},{type:a,tag:m,props:{},children:[{type:b,value:L}]},{type:b,value:M},{type:a,tag:m,props:{},children:[{type:b,value:N}]}]},{type:a,tag:e,props:{},children:[{type:b,value:O}]},{type:a,tag:e,props:{},children:[{type:b,value:P},{type:a,tag:f,props:{href:q,rel:[g]},children:[{type:b,value:Q}]},{type:b,value:R}]}]},{type:a,tag:o,props:{id:A},children:[{type:b,value:B}]},{type:a,tag:p,props:{},children:[{type:a,tag:e,props:{},children:[{type:a,tag:f,props:{href:S,rel:[g]},children:[{type:b,value:T}]}]},{type:a,tag:e,props:{},children:[{type:a,tag:f,props:{href:U,rel:[g]},children:[{type:b,value:V}]}]},{type:a,tag:e,props:{},children:[{type:a,tag:f,props:{href:W,rel:[g]},children:[{type:b,value:X}]}]},{type:a,tag:e,props:{},children:[{type:a,tag:f,props:{href:q,rel:[g]},children:[{type:b,value:Y}]}]}]}]},body:{type:E,children:[{type:a,tag:i,props:{},children:[{type:b,value:t}]},{type:a,tag:d,props:{code:u,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:h},children:[{type:a,tag:c,props:{class:n},children:[{type:a,tag:c,props:{class:l},children:[{type:b,value:"Bluetooth: hci0: ACL packet "}]},{type:a,tag:c,props:{class:Z},children:[{type:b,value:"for"}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:" unknown connection handle 256"}]}]}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:F},{type:a,tag:m,props:{},children:[{type:b,value:G}]},{type:b,value:H}]},{type:a,tag:d,props:{code:v,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:h},children:[{type:a,tag:c,props:{class:n},children:[{type:a,tag:c,props:{class:_},children:[{type:b,value:"# Disable autosuspend for btusb to make the bluetooth keyboard work again"}]}]},{type:a,tag:c,props:{class:n},children:[{type:a,tag:c,props:{class:l},children:[{type:b,value:"options btusb enable_autosuspend=n"}]}]}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:I}]},{type:a,tag:d,props:{code:w,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:h},children:[{type:a,tag:c,props:{class:n},children:[{type:a,tag:c,props:{class:l},children:[{type:b,value:"mkinitcpio -P"}]}]}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:J}]},{type:a,tag:d,props:{code:x,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:h},children:[{type:a,tag:c,props:{class:n},children:[{type:a,tag:c,props:{class:l},children:[{type:b,value:"$ systool -v -m btusb "}]},{type:a,tag:c,props:{class:Z},children:[{type:b,value:"|"}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:" grep autosuspend"}]}]},{type:a,tag:c,props:{class:n},children:[{type:a,tag:c,props:{class:l},children:[{type:b,value:" enable_autosuspend = "}]},{type:a,tag:c,props:{class:"ct-be00c3"},children:[{type:b,value:"\"N\""}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:_},children:[{type:b,value:"# should be \"N\""}]}]}]}]}]},{type:a,tag:o,props:{id:y},children:[{type:b,value:z}]},{type:a,tag:p,props:{},children:[{type:a,tag:e,props:{},children:[{type:b,value:K},{type:a,tag:m,props:{},children:[{type:b,value:L}]},{type:b,value:M},{type:a,tag:m,props:{},children:[{type:b,value:N}]}]},{type:a,tag:e,props:{},children:[{type:b,value:O}]},{type:a,tag:e,props:{},children:[{type:b,value:P},{type:a,tag:f,props:{href:q,rel:[g]},children:[{type:b,value:Q}]},{type:b,value:R}]}]},{type:a,tag:o,props:{id:A},children:[{type:b,value:B}]},{type:a,tag:p,props:{},children:[{type:a,tag:e,props:{},children:[{type:a,tag:f,props:{href:S,rel:[g]},children:[{type:b,value:T}]}]},{type:a,tag:e,props:{},children:[{type:a,tag:f,props:{href:U,rel:[g]},children:[{type:b,value:V}]}]},{type:a,tag:e,props:{},children:[{type:a,tag:f,props:{href:W,rel:[g]},children:[{type:b,value:X}]}]},{type:a,tag:e,props:{},children:[{type:a,tag:f,props:{href:q,rel:[g]},children:[{type:b,value:Y}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-be00c3{color:#A5D6FF}.ct-08f1b7{color:#8B949E}.ct-107814{color:#FF7B72}.ct-b5e4a7{color:#C9D1D9}.light .ct-b5e4a7{color:#657B83}.light .ct-107814{color:#859900}.light .ct-08f1b7{color:#93A1A1}.light .ct-be00c3{color:#2AA198}"}]}],toc:{title:h,searchDepth:r,depth:r,links:[{id:y,depth:r,text:z},{id:A,depth:r,text:B}]}},_type:"markdown",_id:"content:Linux:Fixing lagging USB Headphones.md",_source:"content",_file:"Linux\u002FFixing lagging USB Headphones.md",_extension:"md"}},prerenderedAt:1711020227799}}("element","text","span","code","li","a","nofollow","","p","shell","pre","ct-b5e4a7","code-inline","line","h2","ul","https:\u002F\u002Fubuntuforums.org\u002Fshowthread.php?t=2159645&page=6&p=12926730#post12926730",2,false,"When receiving messages like this:","Bluetooth: hci0: ACL packet for unknown connection handle 256\n","# Disable autosuspend for btusb to make the bluetooth keyboard work again\noptions btusb enable_autosuspend=n\n","mkinitcpio -P\n","$ systool -v -m btusb | grep autosuspend\n enable_autosuspend = \"N\" # should be \"N\"\n","also","Also","refs","Refs","Fixing Lagging USB Headphones","\u002Flinux\u002Ffixing-lagging-usb-headphones","root","Create ","\u002Fetc\u002Fmodprobe.d\u002Fdisable_btusb_autosuspend.conf"," with following content:","Then run","Reboot and debug with","That could be either ","btusb.enable_autosuspend=n"," or ","usbcore.autosuspend=-1","TLP has settings for BTUSB, check it to exclude your device from autosuspend","There's a guy on ubuntuforums, who wrote ","solution",", which disables autosuspend manually","https:\u002F\u002Fbbs.archlinux.org\u002Fviewtopic.php?id=236479","Bluetooth keyboard disconnects randomly","https:\u002F\u002Fbbs.archlinux.org\u002Fviewtopic.php?id=275962","Bluetooth keeps turning off","https:\u002F\u002Fwiki.archlinux.org\u002Ftitle\u002FBluetooth#Device_connects,_then_disconnects_after_a_few_moments","ArchWiki: Device connects, then disconnects after a few moments","Said solution with a script in rc.local","ct-107814","ct-08f1b7")) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:C,_path:D},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-WBdE8kMsNc":{_path:D,_dir:"linux",_draft:s,_partial:s,_locale:"en",_empty:s,title:C,description:t,excerpt:{type:E,children:[{type:a,tag:i,props:{},children:[{type:b,value:t}]},{type:a,tag:d,props:{code:u,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:h},children:[{type:b,value:u}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:F},{type:a,tag:m,props:{},children:[{type:b,value:G}]},{type:b,value:H}]},{type:a,tag:d,props:{code:v,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:h},children:[{type:b,value:v}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:I}]},{type:a,tag:d,props:{code:w,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:h},children:[{type:b,value:w}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:J}]},{type:a,tag:d,props:{code:x,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:h},children:[{type:b,value:x}]}]}]},{type:a,tag:o,props:{id:y},children:[{type:b,value:z}]},{type:a,tag:p,props:{},children:[{type:a,tag:e,props:{},children:[{type:b,value:K},{type:a,tag:m,props:{},children:[{type:b,value:L}]},{type:b,value:M},{type:a,tag:m,props:{},children:[{type:b,value:N}]}]},{type:a,tag:e,props:{},children:[{type:b,value:O}]},{type:a,tag:e,props:{},children:[{type:b,value:P},{type:a,tag:f,props:{href:q,rel:[g]},children:[{type:b,value:Q}]},{type:b,value:R}]}]},{type:a,tag:o,props:{id:A},children:[{type:b,value:B}]},{type:a,tag:p,props:{},children:[{type:a,tag:e,props:{},children:[{type:a,tag:f,props:{href:S,rel:[g]},children:[{type:b,value:T}]}]},{type:a,tag:e,props:{},children:[{type:a,tag:f,props:{href:U,rel:[g]},children:[{type:b,value:V}]}]},{type:a,tag:e,props:{},children:[{type:a,tag:f,props:{href:W,rel:[g]},children:[{type:b,value:X}]}]},{type:a,tag:e,props:{},children:[{type:a,tag:f,props:{href:q,rel:[g]},children:[{type:b,value:Y}]}]}]}]},body:{type:E,children:[{type:a,tag:i,props:{},children:[{type:b,value:t}]},{type:a,tag:d,props:{code:u,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:h},children:[{type:a,tag:c,props:{class:n},children:[{type:a,tag:c,props:{class:l},children:[{type:b,value:"Bluetooth: hci0: ACL packet "}]},{type:a,tag:c,props:{class:Z},children:[{type:b,value:"for"}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:" unknown connection handle 256"}]}]}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:F},{type:a,tag:m,props:{},children:[{type:b,value:G}]},{type:b,value:H}]},{type:a,tag:d,props:{code:v,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:h},children:[{type:a,tag:c,props:{class:n},children:[{type:a,tag:c,props:{class:_},children:[{type:b,value:"# Disable autosuspend for btusb to make the bluetooth keyboard work again"}]}]},{type:a,tag:c,props:{class:n},children:[{type:a,tag:c,props:{class:l},children:[{type:b,value:"options btusb enable_autosuspend=n"}]}]}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:I}]},{type:a,tag:d,props:{code:w,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:h},children:[{type:a,tag:c,props:{class:n},children:[{type:a,tag:c,props:{class:l},children:[{type:b,value:"mkinitcpio -P"}]}]}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:J}]},{type:a,tag:d,props:{code:x,language:j},children:[{type:a,tag:k,props:{},children:[{type:a,tag:d,props:{__ignoreMap:h},children:[{type:a,tag:c,props:{class:n},children:[{type:a,tag:c,props:{class:l},children:[{type:b,value:"$ systool -v -m btusb "}]},{type:a,tag:c,props:{class:Z},children:[{type:b,value:"|"}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:" grep autosuspend"}]}]},{type:a,tag:c,props:{class:n},children:[{type:a,tag:c,props:{class:l},children:[{type:b,value:" enable_autosuspend = "}]},{type:a,tag:c,props:{class:"ct-3e1943"},children:[{type:b,value:"\"N\""}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:_},children:[{type:b,value:"# should be \"N\""}]}]}]}]}]},{type:a,tag:o,props:{id:y},children:[{type:b,value:z}]},{type:a,tag:p,props:{},children:[{type:a,tag:e,props:{},children:[{type:b,value:K},{type:a,tag:m,props:{},children:[{type:b,value:L}]},{type:b,value:M},{type:a,tag:m,props:{},children:[{type:b,value:N}]}]},{type:a,tag:e,props:{},children:[{type:b,value:O}]},{type:a,tag:e,props:{},children:[{type:b,value:P},{type:a,tag:f,props:{href:q,rel:[g]},children:[{type:b,value:Q}]},{type:b,value:R}]}]},{type:a,tag:o,props:{id:A},children:[{type:b,value:B}]},{type:a,tag:p,props:{},children:[{type:a,tag:e,props:{},children:[{type:a,tag:f,props:{href:S,rel:[g]},children:[{type:b,value:T}]}]},{type:a,tag:e,props:{},children:[{type:a,tag:f,props:{href:U,rel:[g]},children:[{type:b,value:V}]}]},{type:a,tag:e,props:{},children:[{type:a,tag:f,props:{href:W,rel:[g]},children:[{type:b,value:X}]}]},{type:a,tag:e,props:{},children:[{type:a,tag:f,props:{href:q,rel:[g]},children:[{type:b,value:Y}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-3e1943{color:#A5D6FF}.ct-b1f60c{color:#8B949E}.ct-3fc0e0{color:#FF7B72}.ct-c92475{color:#C9D1D9}.light .ct-c92475{color:#657B83}.light .ct-3fc0e0{color:#859900}.light .ct-b1f60c{color:#93A1A1}.light .ct-3e1943{color:#2AA198}"}]}],toc:{title:h,searchDepth:r,depth:r,links:[{id:y,depth:r,text:z},{id:A,depth:r,text:B}]}},_type:"markdown",_id:"content:Linux:Fixing lagging USB Headphones.md",_source:"content",_file:"Linux\u002FFixing lagging USB Headphones.md",_extension:"md"}},prerenderedAt:1711020862161}}("element","text","span","code","li","a","nofollow","","p","shell","pre","ct-c92475","code-inline","line","h2","ul","https:\u002F\u002Fubuntuforums.org\u002Fshowthread.php?t=2159645&page=6&p=12926730#post12926730",2,false,"When receiving messages like this:","Bluetooth: hci0: ACL packet for unknown connection handle 256\n","# Disable autosuspend for btusb to make the bluetooth keyboard work again\noptions btusb enable_autosuspend=n\n","mkinitcpio -P\n","$ systool -v -m btusb | grep autosuspend\n enable_autosuspend = \"N\" # should be \"N\"\n","also","Also","refs","Refs","Fixing Lagging USB Headphones","\u002Flinux\u002Ffixing-lagging-usb-headphones","root","Create ","\u002Fetc\u002Fmodprobe.d\u002Fdisable_btusb_autosuspend.conf"," with following content:","Then run","Reboot and debug with","That could be either ","btusb.enable_autosuspend=n"," or ","usbcore.autosuspend=-1","TLP has settings for BTUSB, check it to exclude your device from autosuspend","There's a guy on ubuntuforums, who wrote ","solution",", which disables autosuspend manually","https:\u002F\u002Fbbs.archlinux.org\u002Fviewtopic.php?id=236479","Bluetooth keyboard disconnects randomly","https:\u002F\u002Fbbs.archlinux.org\u002Fviewtopic.php?id=275962","Bluetooth keeps turning off","https:\u002F\u002Fwiki.archlinux.org\u002Ftitle\u002FBluetooth#Device_connects,_then_disconnects_after_a_few_moments","ArchWiki: Device connects, then disconnects after a few moments","Said solution with a script in rc.local","ct-3fc0e0","ct-b1f60c")) \ No newline at end of file diff --git a/docs/linux/fixing-lagging-usb-headphones/index.html b/docs/linux/fixing-lagging-usb-headphones/index.html index 198449f..0035550 100644 --- a/docs/linux/fixing-lagging-usb-headphones/index.html +++ b/docs/linux/fixing-lagging-usb-headphones/index.html @@ -1,6 +1,6 @@ -Fixing Lagging USB Headphones • Obsidian Garden -

Fixing Lagging USB Headphones

When receiving messages like this:

Bluetooth: hci0: ACL packet for unknown connection handle 256

Create /etc/modprobe.d/disable_btusb_autosuspend.conf with following content:

# Disable autosuspend for btusb to make the bluetooth keyboard work againoptions btusb enable_autosuspend=n

Then run

mkinitcpio -P

Reboot and debug with

$ systool -v -m btusb | grep autosuspend    enable_autosuspend = "N" # should be "N"

Also

  • That could be either btusb.enable_autosuspend=n or usbcore.autosuspend=-1
  • TLP has settings for BTUSB, check it to exclude your device from autosuspend
  • There's a guy on ubuntuforums, who wrote solution, which disables autosuspend manually

Refs

btw, have a nice day
(2018 - 2024) muerwre
+

Fixing Lagging USB Headphones

When receiving messages like this:

Bluetooth: hci0: ACL packet for unknown connection handle 256

Create /etc/modprobe.d/disable_btusb_autosuspend.conf with following content:

# Disable autosuspend for btusb to make the bluetooth keyboard work againoptions btusb enable_autosuspend=n

Then run

mkinitcpio -P

Reboot and debug with

$ systool -v -m btusb | grep autosuspend    enable_autosuspend = "N" # should be "N"

Also

  • That could be either btusb.enable_autosuspend=n or usbcore.autosuspend=-1
  • TLP has settings for BTUSB, check it to exclude your device from autosuspend
  • There's a guy on ubuntuforums, who wrote solution, which disables autosuspend manually

Refs

btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/linux/gitea-for-git-hosting/_payload.js b/docs/linux/gitea-for-git-hosting/_payload.js index 1427275..7ce3f7a 100644 --- a/docs/linux/gitea-for-git-hosting/_payload.js +++ b/docs/linux/gitea-for-git-hosting/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:t,_path:u},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-t1CslyFV8V":{_path:u,_dir:"linux",_draft:n,_partial:n,_locale:"en",_empty:n,title:t,description:"Self-hosted #git repositories with gitea and #docker.",excerpt:{type:v,children:[{type:a,tag:w,props:{},children:[{type:c,value:x},{type:a,tag:y,props:{href:z,rel:[A]},children:[{type:c,value:k}]},{type:c,value:B}]},{type:a,tag:C,props:{id:o},children:[{type:c,value:p}]},{type:a,tag:m,props:{code:q,language:D},children:[{type:a,tag:E,props:{},children:[{type:a,tag:m,props:{__ignoreMap:r},children:[{type:c,value:q}]}]}]}]},body:{type:v,children:[{type:a,tag:w,props:{},children:[{type:c,value:x},{type:a,tag:y,props:{href:z,rel:[A]},children:[{type:c,value:k}]},{type:c,value:B}]},{type:a,tag:C,props:{id:o},children:[{type:c,value:p}]},{type:a,tag:m,props:{code:q,language:D},children:[{type:a,tag:E,props:{},children:[{type:a,tag:m,props:{__ignoreMap:r},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:"version"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"3\""}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"external"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:"ct-9f6859"},children:[{type:c,value:"false"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:"services"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"server"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"image"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"gitea\u002Fgitea:latest"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"container_name"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"environment"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"USER_UID=1000"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"USER_GID=1000"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"restart"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"always"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"volumes"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:".\u002Fvar\u002Flib\u002Fgitea:\u002Fdata"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:".\u002Fetc\u002Fgitea:\u002Fetc\u002Fgitea"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\u002Fetc\u002Ftimezone:\u002Fetc\u002Ftimezone:ro"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\u002Fetc\u002Flocaltime:\u002Fetc\u002Flocaltime:ro"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"ports"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"3000:3000\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"222:22\""}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-9f6859{color:#79C0FF}.ct-fb340e{color:#A5D6FF}.ct-d2407a{color:#C9D1D9}.ct-03701d{color:#7EE787}.light .ct-03701d{color:#268BD2}.light .ct-d2407a{color:#657B83}.light .ct-fb340e{color:#2AA198}.light .ct-9f6859{color:#B58900}"}]}],toc:{title:r,searchDepth:s,depth:s,links:[{id:o,depth:s,text:p}]}},_type:"markdown",_id:"content:Linux:Gitea for git hosting.md",_source:"content",_file:"Linux\u002FGitea for git hosting.md",_extension:"md"}},prerenderedAt:1711020227822}}("element","span","text","ct-d2407a","line","ct-03701d","ct-fb340e"," - ",":"," ","gitea",": ","code",false,"setting-up-with-docker-compose","Setting up with docker-compose","version: \"3\"\n\nnetworks:\n gitea:\n external: false\nservices:\n server:\n image: gitea\u002Fgitea:latest\n container_name: gitea\n environment:\n - USER_UID=1000\n - USER_GID=1000\n restart: always\n networks:\n - gitea\n volumes:\n - .\u002Fvar\u002Flib\u002Fgitea:\u002Fdata\n - .\u002Fetc\u002Fgitea:\u002Fetc\u002Fgitea\n - \u002Fetc\u002Ftimezone:\u002Fetc\u002Ftimezone:ro\n - \u002Fetc\u002Flocaltime:\u002Fetc\u002Flocaltime:ro\n ports:\n - \"3000:3000\"\n - \"222:22\"\n","",2,"Gitea For Git Hosting","\u002Flinux\u002Fgitea-for-git-hosting","root","p","Self-hosted #git repositories with ","a","https:\u002F\u002Fgitea.io\u002Fru-ru\u002F","nofollow"," and #docker.","h2","yaml","pre","networks"," ")) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:t,_path:u},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-t1CslyFV8V":{_path:u,_dir:"linux",_draft:n,_partial:n,_locale:"en",_empty:n,title:t,description:"Self-hosted #git repositories with gitea and #docker.",excerpt:{type:v,children:[{type:a,tag:w,props:{},children:[{type:c,value:x},{type:a,tag:y,props:{href:z,rel:[A]},children:[{type:c,value:k}]},{type:c,value:B}]},{type:a,tag:C,props:{id:o},children:[{type:c,value:p}]},{type:a,tag:m,props:{code:q,language:D},children:[{type:a,tag:E,props:{},children:[{type:a,tag:m,props:{__ignoreMap:r},children:[{type:c,value:q}]}]}]}]},body:{type:v,children:[{type:a,tag:w,props:{},children:[{type:c,value:x},{type:a,tag:y,props:{href:z,rel:[A]},children:[{type:c,value:k}]},{type:c,value:B}]},{type:a,tag:C,props:{id:o},children:[{type:c,value:p}]},{type:a,tag:m,props:{code:q,language:D},children:[{type:a,tag:E,props:{},children:[{type:a,tag:m,props:{__ignoreMap:r},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:"version"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"3\""}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:k}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"external"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:"ct-6e94ca"},children:[{type:c,value:"false"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:"services"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"server"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"image"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"gitea\u002Fgitea:latest"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"container_name"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"environment"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"USER_UID=1000"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"USER_GID=1000"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"restart"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"always"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:F}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"volumes"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:".\u002Fvar\u002Flib\u002Fgitea:\u002Fdata"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:".\u002Fetc\u002Fgitea:\u002Fetc\u002Fgitea"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\u002Fetc\u002Ftimezone:\u002Fetc\u002Ftimezone:ro"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\u002Fetc\u002Flocaltime:\u002Fetc\u002Flocaltime:ro"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"ports"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"3000:3000\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"222:22\""}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-6e94ca{color:#79C0FF}.ct-09000e{color:#A5D6FF}.ct-6227ac{color:#C9D1D9}.ct-38d0af{color:#7EE787}.light .ct-38d0af{color:#268BD2}.light .ct-6227ac{color:#657B83}.light .ct-09000e{color:#2AA198}.light .ct-6e94ca{color:#B58900}"}]}],toc:{title:r,searchDepth:s,depth:s,links:[{id:o,depth:s,text:p}]}},_type:"markdown",_id:"content:Linux:Gitea for git hosting.md",_source:"content",_file:"Linux\u002FGitea for git hosting.md",_extension:"md"}},prerenderedAt:1711020862206}}("element","span","text","ct-6227ac","line","ct-38d0af","ct-09000e"," - ",":"," ","gitea",": ","code",false,"setting-up-with-docker-compose","Setting up with docker-compose","version: \"3\"\n\nnetworks:\n gitea:\n external: false\nservices:\n server:\n image: gitea\u002Fgitea:latest\n container_name: gitea\n environment:\n - USER_UID=1000\n - USER_GID=1000\n restart: always\n networks:\n - gitea\n volumes:\n - .\u002Fvar\u002Flib\u002Fgitea:\u002Fdata\n - .\u002Fetc\u002Fgitea:\u002Fetc\u002Fgitea\n - \u002Fetc\u002Ftimezone:\u002Fetc\u002Ftimezone:ro\n - \u002Fetc\u002Flocaltime:\u002Fetc\u002Flocaltime:ro\n ports:\n - \"3000:3000\"\n - \"222:22\"\n","",2,"Gitea For Git Hosting","\u002Flinux\u002Fgitea-for-git-hosting","root","p","Self-hosted #git repositories with ","a","https:\u002F\u002Fgitea.io\u002Fru-ru\u002F","nofollow"," and #docker.","h2","yaml","pre","networks"," ")) \ No newline at end of file diff --git a/docs/linux/gitea-for-git-hosting/index.html b/docs/linux/gitea-for-git-hosting/index.html index d2ae235..bbf3df4 100644 --- a/docs/linux/gitea-for-git-hosting/index.html +++ b/docs/linux/gitea-for-git-hosting/index.html @@ -1,6 +1,6 @@ -Gitea For Git Hosting • Obsidian Garden -

Gitea For Git Hosting

Self-hosted #git repositories with gitea and #docker.

Setting up with docker-compose

version: "3"networks:  gitea:    external: falseservices:  server:    image: gitea/gitea:latest    container_name: gitea    environment:      - USER_UID=1000      - USER_GID=1000    restart: always    networks:      - gitea    volumes:      - ./var/lib/gitea:/data      - ./etc/gitea:/etc/gitea      - /etc/timezone:/etc/timezone:ro      - /etc/localtime:/etc/localtime:ro    ports:      - "3000:3000"      - "222:22"
btw, have a nice day
(2018 - 2024) muerwre
+

Gitea For Git Hosting

Self-hosted #git repositories with gitea and #docker.

Setting up with docker-compose

version: "3"networks:  gitea:    external: falseservices:  server:    image: gitea/gitea:latest    container_name: gitea    environment:      - USER_UID=1000      - USER_GID=1000    restart: always    networks:      - gitea    volumes:      - ./var/lib/gitea:/data      - ./etc/gitea:/etc/gitea      - /etc/timezone:/etc/timezone:ro      - /etc/localtime:/etc/localtime:ro    ports:      - "3000:3000"      - "222:22"
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/linux/google-photos-alternative-with-photoprism/_payload.js b/docs/linux/google-photos-alternative-with-photoprism/_payload.js index cf88b23..347b7d0 100644 --- a/docs/linux/google-photos-alternative-with-photoprism/_payload.js +++ b/docs/linux/google-photos-alternative-with-photoprism/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:C,_path:D},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-N7FETNtB3c":{_path:D,_dir:"linux",_draft:v,_partial:v,_locale:"en",_empty:v,title:C,description:"Photo Prism is a free alternative to Google photos, can be set up with #docker.",excerpt:{type:E,children:[{type:a,tag:r,props:{},children:[{type:a,tag:n,props:{href:F,rel:[o]},children:[{type:c,value:G}]},{type:c,value:H}]},{type:a,tag:I,props:{id:w},children:[{type:c,value:x}]},{type:a,tag:r,props:{},children:[{type:c,value:J},{type:a,tag:n,props:{href:K,rel:[o]},children:[{type:c,value:L}]},{type:c,value:M},{type:a,tag:n,props:{href:N,rel:[o]},children:[{type:c,value:O}]},{type:c,value:P}]},{type:a,tag:s,props:{code:y,language:Q},children:[{type:a,tag:R,props:{},children:[{type:a,tag:s,props:{__ignoreMap:z},children:[{type:c,value:y}]}]}]}]},body:{type:E,children:[{type:a,tag:r,props:{},children:[{type:a,tag:n,props:{href:F,rel:[o]},children:[{type:c,value:G}]},{type:c,value:H}]},{type:a,tag:I,props:{id:w},children:[{type:c,value:x}]},{type:a,tag:r,props:{},children:[{type:c,value:J},{type:a,tag:n,props:{href:K,rel:[o]},children:[{type:c,value:L}]},{type:c,value:M},{type:a,tag:n,props:{href:N,rel:[o]},children:[{type:c,value:O}]},{type:c,value:P}]},{type:a,tag:s,props:{code:y,language:Q},children:[{type:a,tag:R,props:{},children:[{type:a,tag:s,props:{__ignoreMap:z},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:"version"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"'3.5'"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:"services"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"photoprism__app"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"photoprism\u002Fphotoprism:latest"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"depends_on"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:U}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:W}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:Y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:Z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"ports"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"2342:2342"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:_},children:[{type:c,value:"# HTTP port (host:container)"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_ADMIN_PASSWORD"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"password\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_SITE_URL"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"https:\u002F\u002Fservice.url\u002F\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_ORIGINALS_LIMIT"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:"ct-074800"},children:[{type:c,value:"5000"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_HTTP_COMPRESSION"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"gzip\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DEBUG"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_PUBLIC"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_READONLY"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_EXPERIMENTAL"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DISABLE_CHOWN"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DISABLE_WEBDAV"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DISABLE_SETTINGS"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DISABLE_TENSORFLOW"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DISABLE_FACES"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DISABLE_CLASSIFICATION"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DARKTABLE_PRESETS"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DETECT_NSFW"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_UPLOAD_NSFW"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"true\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DATABASE_DRIVER"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"mysql\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DATABASE_SERVER"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"mariadb:3306\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DATABASE_NAME"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"photoprism\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DATABASE_USER"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"root\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DATABASE_PASSWORD"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"insecure\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_SITE_TITLE"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"PhotoPrism\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_SITE_CAPTION"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"Browse Your Life\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_SITE_DESCRIPTION"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ab}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_SITE_AUTHOR"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ab}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"HOME"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ac}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"working_dir"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ac}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\".\u002Fdata\u002Foriginals:\u002Fphotoprism\u002Foriginals\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"    "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\".\u002Fdata\u002Fimports:\u002Fphotoprism\u002Fimport\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\".\u002Fdata\u002Fstorage:\u002Fphotoprism\u002Fstorage\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"  "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"photoprism__db"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:W}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"mariadb:10.6"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:Y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:Z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"command"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"mysqld --innodb-buffer-pool-size=128M --transaction-isolation=READ-COMMITTED --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci --max-connections=512 --innodb-rollback-on-timeout=OFF --innodb-lock-wait-timeout=120"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\".\u002Fdatabase:\u002Fvar\u002Flib\u002Fmysql\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:_},children:[{type:c,value:"# Important, don't remove"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"MYSQL_ROOT_PASSWORD"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ae}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"MYSQL_DATABASE"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:A}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"MYSQL_USER"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:A}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"MYSQL_PASSWORD"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ae}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-074800{color:#79C0FF}.ct-5f03ff{color:#8B949E}.ct-608ab5{color:#A5D6FF}.ct-9aaab4{color:#C9D1D9}.ct-6b85fe{color:#7EE787}.light .ct-6b85fe{color:#268BD2}.light .ct-9aaab4{color:#657B83}.light .ct-608ab5{color:#2AA198}.light .ct-5f03ff{color:#93A1A1}.light .ct-074800{color:#D33682}"}]}],toc:{title:z,searchDepth:B,depth:B,links:[{id:w,depth:B,text:x}]}},_type:"markdown",_id:"content:Linux:Google photos alternative with Photoprism.md",_source:"content",_file:"Linux\u002FGoogle photos alternative with Photoprism.md",_extension:"md"}},prerenderedAt:1711020227841}}("element","span","text","ct-9aaab4","line","ct-6b85fe","ct-608ab5",": "," ","\"false\"",":"," ","    ","a","nofollow","      ","      - ","p","code"," - "," ",false,"docker-compose-file-to-run-it","Docker compose file to run it","version: '3.5'\n\nservices:\n photoprism:\n container_name: photoprism__app\n image: photoprism\u002Fphotoprism:latest\n depends_on:\n - mariadb\n restart: unless-stopped\n security_opt:\n - seccomp:unconfined\n - apparmor:unconfined\n ports:\n - 2342:2342 # HTTP port (host:container)\n environment:\n PHOTOPRISM_ADMIN_PASSWORD: \"password\"\n PHOTOPRISM_SITE_URL: \"https:\u002F\u002Fservice.url\u002F\"\n PHOTOPRISM_ORIGINALS_LIMIT: 5000\n PHOTOPRISM_HTTP_COMPRESSION: \"gzip\"\n PHOTOPRISM_DEBUG: \"false\" \n PHOTOPRISM_PUBLIC: \"false\" \n PHOTOPRISM_READONLY: \"false\" \n PHOTOPRISM_EXPERIMENTAL: \"false\"\n PHOTOPRISM_DISABLE_CHOWN: \"false\"\n PHOTOPRISM_DISABLE_WEBDAV: \"false\" \n PHOTOPRISM_DISABLE_SETTINGS: \"false\"\n PHOTOPRISM_DISABLE_TENSORFLOW: \"false\"\n PHOTOPRISM_DISABLE_FACES: \"false\" \n PHOTOPRISM_DISABLE_CLASSIFICATION: \"false\"\n PHOTOPRISM_DARKTABLE_PRESETS: \"false\" \n PHOTOPRISM_DETECT_NSFW: \"false\" \n PHOTOPRISM_UPLOAD_NSFW: \"true\" \n PHOTOPRISM_DATABASE_DRIVER: \"mysql\" \n PHOTOPRISM_DATABASE_SERVER: \"mariadb:3306\"\n PHOTOPRISM_DATABASE_NAME: \"photoprism\" \n PHOTOPRISM_DATABASE_USER: \"root\" \n PHOTOPRISM_DATABASE_PASSWORD: \"insecure\" \n PHOTOPRISM_SITE_TITLE: \"PhotoPrism\"\n PHOTOPRISM_SITE_CAPTION: \"Browse Your Life\"\n PHOTOPRISM_SITE_DESCRIPTION: \"\"\n      PHOTOPRISM_SITE_AUTHOR: \"\"\n      HOME: \"\u002Fphotoprism\"\n    working_dir: \"\u002Fphotoprism\"\n    volumes:\n      - \".\u002Fdata\u002Foriginals:\u002Fphotoprism\u002Foriginals\"    \n      - \".\u002Fdata\u002Fimports:\u002Fphotoprism\u002Fimport\"\n      - \".\u002Fdata\u002Fstorage:\u002Fphotoprism\u002Fstorage\"\n  mariadb:\n    container_name: photoprism__db\n    restart: unless-stopped\n    image: mariadb:10.6\n    security_opt:\n      - seccomp:unconfined\n      - apparmor:unconfined\n    command: mysqld --innodb-buffer-pool-size=128M --transaction-isolation=READ-COMMITTED --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci --max-connections=512 --innodb-rollback-on-timeout=OFF --innodb-lock-wait-timeout=120\n    volumes:\n      - \".\u002Fdatabase:\u002Fvar\u002Flib\u002Fmysql\" # Important, don't remove\n    environment:\n      MYSQL_ROOT_PASSWORD: insecure\n      MYSQL_DATABASE: photoprism\n      MYSQL_USER: photoprism\n      MYSQL_PASSWORD: insecure\n","","photoprism",2,"Google Photos Alternative With Photoprism","\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism","root","https:\u002F\u002Fphotoprism.app\u002F","Photo Prism"," is a free alternative to Google photos, can be set up with #docker.","h2","Check out current ","https:\u002F\u002Fdl.photoprism.app\u002Fdocker\u002Fdocker-compose.yml","example"," at photoprism's ","https:\u002F\u002Fdocs.photoprism.app\u002Fgetting-started\u002Fdocker-compose\u002F","documentation",".","yaml","pre","container_name","image","mariadb","restart","unless-stopped","security_opt","seccomp:unconfined","apparmor:unconfined","ct-5f03ff","environment"," ","\"\"","\"\u002Fphotoprism\"","volumes","insecure")) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:C,_path:D},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-N7FETNtB3c":{_path:D,_dir:"linux",_draft:v,_partial:v,_locale:"en",_empty:v,title:C,description:"Photo Prism is a free alternative to Google photos, can be set up with #docker.",excerpt:{type:E,children:[{type:a,tag:r,props:{},children:[{type:a,tag:n,props:{href:F,rel:[o]},children:[{type:c,value:G}]},{type:c,value:H}]},{type:a,tag:I,props:{id:w},children:[{type:c,value:x}]},{type:a,tag:r,props:{},children:[{type:c,value:J},{type:a,tag:n,props:{href:K,rel:[o]},children:[{type:c,value:L}]},{type:c,value:M},{type:a,tag:n,props:{href:N,rel:[o]},children:[{type:c,value:O}]},{type:c,value:P}]},{type:a,tag:s,props:{code:y,language:Q},children:[{type:a,tag:R,props:{},children:[{type:a,tag:s,props:{__ignoreMap:z},children:[{type:c,value:y}]}]}]}]},body:{type:E,children:[{type:a,tag:r,props:{},children:[{type:a,tag:n,props:{href:F,rel:[o]},children:[{type:c,value:G}]},{type:c,value:H}]},{type:a,tag:I,props:{id:w},children:[{type:c,value:x}]},{type:a,tag:r,props:{},children:[{type:c,value:J},{type:a,tag:n,props:{href:K,rel:[o]},children:[{type:c,value:L}]},{type:c,value:M},{type:a,tag:n,props:{href:N,rel:[o]},children:[{type:c,value:O}]},{type:c,value:P}]},{type:a,tag:s,props:{code:y,language:Q},children:[{type:a,tag:R,props:{},children:[{type:a,tag:s,props:{__ignoreMap:z},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:"version"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"'3.5'"}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:"services"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:A}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"photoprism__app"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"photoprism\u002Fphotoprism:latest"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"depends_on"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:U}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:W}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:Y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:Z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"ports"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"2342:2342"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:_},children:[{type:c,value:"# HTTP port (host:container)"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_ADMIN_PASSWORD"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"password\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_SITE_URL"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"https:\u002F\u002Fservice.url\u002F\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_ORIGINALS_LIMIT"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:"ct-db7588"},children:[{type:c,value:"5000"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_HTTP_COMPRESSION"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"gzip\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DEBUG"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_PUBLIC"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_READONLY"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_EXPERIMENTAL"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DISABLE_CHOWN"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DISABLE_WEBDAV"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DISABLE_SETTINGS"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DISABLE_TENSORFLOW"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DISABLE_FACES"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DISABLE_CLASSIFICATION"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DARKTABLE_PRESETS"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:aa}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DETECT_NSFW"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_UPLOAD_NSFW"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"true\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DATABASE_DRIVER"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"mysql\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DATABASE_SERVER"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"mariadb:3306\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DATABASE_NAME"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"photoprism\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:l}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DATABASE_USER"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"root\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_DATABASE_PASSWORD"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"insecure\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_SITE_TITLE"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"PhotoPrism\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_SITE_CAPTION"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\"Browse Your Life\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_SITE_DESCRIPTION"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ab}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"PHOTOPRISM_SITE_AUTHOR"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ab}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"HOME"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ac}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"working_dir"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ac}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\".\u002Fdata\u002Foriginals:\u002Fphotoprism\u002Foriginals\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"    "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\".\u002Fdata\u002Fimports:\u002Fphotoprism\u002Fimport\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\".\u002Fdata\u002Fstorage:\u002Fphotoprism\u002Fstorage\""}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"  "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"photoprism__db"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:W}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"mariadb:10.6"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:X}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:Y}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:Z}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"command"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"mysqld --innodb-buffer-pool-size=128M --transaction-isolation=READ-COMMITTED --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci --max-connections=512 --innodb-rollback-on-timeout=OFF --innodb-lock-wait-timeout=120"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ad}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"\".\u002Fdatabase:\u002Fvar\u002Flib\u002Fmysql\""}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:_},children:[{type:c,value:"# Important, don't remove"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:m}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:$}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:k}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"MYSQL_ROOT_PASSWORD"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ae}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"MYSQL_DATABASE"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:A}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"MYSQL_USER"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:A}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"MYSQL_PASSWORD"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ae}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-db7588{color:#79C0FF}.ct-9477a5{color:#8B949E}.ct-525fbc{color:#A5D6FF}.ct-4c91c4{color:#C9D1D9}.ct-18810c{color:#7EE787}.light .ct-18810c{color:#268BD2}.light .ct-4c91c4{color:#657B83}.light .ct-525fbc{color:#2AA198}.light .ct-9477a5{color:#93A1A1}.light .ct-db7588{color:#D33682}"}]}],toc:{title:z,searchDepth:B,depth:B,links:[{id:w,depth:B,text:x}]}},_type:"markdown",_id:"content:Linux:Google photos alternative with Photoprism.md",_source:"content",_file:"Linux\u002FGoogle photos alternative with Photoprism.md",_extension:"md"}},prerenderedAt:1711020862248}}("element","span","text","ct-4c91c4","line","ct-18810c","ct-525fbc",": "," ","\"false\"",":"," ","    ","a","nofollow","      ","      - ","p","code"," - "," ",false,"docker-compose-file-to-run-it","Docker compose file to run it","version: '3.5'\n\nservices:\n photoprism:\n container_name: photoprism__app\n image: photoprism\u002Fphotoprism:latest\n depends_on:\n - mariadb\n restart: unless-stopped\n security_opt:\n - seccomp:unconfined\n - apparmor:unconfined\n ports:\n - 2342:2342 # HTTP port (host:container)\n environment:\n PHOTOPRISM_ADMIN_PASSWORD: \"password\"\n PHOTOPRISM_SITE_URL: \"https:\u002F\u002Fservice.url\u002F\"\n PHOTOPRISM_ORIGINALS_LIMIT: 5000\n PHOTOPRISM_HTTP_COMPRESSION: \"gzip\"\n PHOTOPRISM_DEBUG: \"false\" \n PHOTOPRISM_PUBLIC: \"false\" \n PHOTOPRISM_READONLY: \"false\" \n PHOTOPRISM_EXPERIMENTAL: \"false\"\n PHOTOPRISM_DISABLE_CHOWN: \"false\"\n PHOTOPRISM_DISABLE_WEBDAV: \"false\" \n PHOTOPRISM_DISABLE_SETTINGS: \"false\"\n PHOTOPRISM_DISABLE_TENSORFLOW: \"false\"\n PHOTOPRISM_DISABLE_FACES: \"false\" \n PHOTOPRISM_DISABLE_CLASSIFICATION: \"false\"\n PHOTOPRISM_DARKTABLE_PRESETS: \"false\" \n PHOTOPRISM_DETECT_NSFW: \"false\" \n PHOTOPRISM_UPLOAD_NSFW: \"true\" \n PHOTOPRISM_DATABASE_DRIVER: \"mysql\" \n PHOTOPRISM_DATABASE_SERVER: \"mariadb:3306\"\n PHOTOPRISM_DATABASE_NAME: \"photoprism\" \n PHOTOPRISM_DATABASE_USER: \"root\" \n PHOTOPRISM_DATABASE_PASSWORD: \"insecure\" \n PHOTOPRISM_SITE_TITLE: \"PhotoPrism\"\n PHOTOPRISM_SITE_CAPTION: \"Browse Your Life\"\n PHOTOPRISM_SITE_DESCRIPTION: \"\"\n      PHOTOPRISM_SITE_AUTHOR: \"\"\n      HOME: \"\u002Fphotoprism\"\n    working_dir: \"\u002Fphotoprism\"\n    volumes:\n      - \".\u002Fdata\u002Foriginals:\u002Fphotoprism\u002Foriginals\"    \n      - \".\u002Fdata\u002Fimports:\u002Fphotoprism\u002Fimport\"\n      - \".\u002Fdata\u002Fstorage:\u002Fphotoprism\u002Fstorage\"\n  mariadb:\n    container_name: photoprism__db\n    restart: unless-stopped\n    image: mariadb:10.6\n    security_opt:\n      - seccomp:unconfined\n      - apparmor:unconfined\n    command: mysqld --innodb-buffer-pool-size=128M --transaction-isolation=READ-COMMITTED --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci --max-connections=512 --innodb-rollback-on-timeout=OFF --innodb-lock-wait-timeout=120\n    volumes:\n      - \".\u002Fdatabase:\u002Fvar\u002Flib\u002Fmysql\" # Important, don't remove\n    environment:\n      MYSQL_ROOT_PASSWORD: insecure\n      MYSQL_DATABASE: photoprism\n      MYSQL_USER: photoprism\n      MYSQL_PASSWORD: insecure\n","","photoprism",2,"Google Photos Alternative With Photoprism","\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism","root","https:\u002F\u002Fphotoprism.app\u002F","Photo Prism"," is a free alternative to Google photos, can be set up with #docker.","h2","Check out current ","https:\u002F\u002Fdl.photoprism.app\u002Fdocker\u002Fdocker-compose.yml","example"," at photoprism's ","https:\u002F\u002Fdocs.photoprism.app\u002Fgetting-started\u002Fdocker-compose\u002F","documentation",".","yaml","pre","container_name","image","mariadb","restart","unless-stopped","security_opt","seccomp:unconfined","apparmor:unconfined","ct-9477a5","environment"," ","\"\"","\"\u002Fphotoprism\"","volumes","insecure")) \ No newline at end of file diff --git a/docs/linux/google-photos-alternative-with-photoprism/index.html b/docs/linux/google-photos-alternative-with-photoprism/index.html index 90dd9cf..6972381 100644 --- a/docs/linux/google-photos-alternative-with-photoprism/index.html +++ b/docs/linux/google-photos-alternative-with-photoprism/index.html @@ -1,6 +1,6 @@ -Google Photos Alternative With Photoprism • Obsidian Garden -

Google Photos Alternative With Photoprism

Photo Prism is a free alternative to Google photos, can be set up with #docker.

Docker compose file to run it

Check out current example at photoprism's documentation.

version: '3.5'services:  photoprism:    container_name: photoprism__app    image: photoprism/photoprism:latest    depends_on:      - mariadb    restart: unless-stopped    security_opt:      - seccomp:unconfined      - apparmor:unconfined    ports:      - 2342:2342 # HTTP port (host:container)    environment:      PHOTOPRISM_ADMIN_PASSWORD: "password"      PHOTOPRISM_SITE_URL: "https://service.url/"      PHOTOPRISM_ORIGINALS_LIMIT: 5000      PHOTOPRISM_HTTP_COMPRESSION: "gzip"      PHOTOPRISM_DEBUG: "false"                PHOTOPRISM_PUBLIC: "false"            PHOTOPRISM_READONLY: "false"          PHOTOPRISM_EXPERIMENTAL: "false"      PHOTOPRISM_DISABLE_CHOWN: "false"      PHOTOPRISM_DISABLE_WEBDAV: "false"       PHOTOPRISM_DISABLE_SETTINGS: "false"      PHOTOPRISM_DISABLE_TENSORFLOW: "false"      PHOTOPRISM_DISABLE_FACES: "false"           PHOTOPRISM_DISABLE_CLASSIFICATION: "false"      PHOTOPRISM_DARKTABLE_PRESETS: "false"           PHOTOPRISM_DETECT_NSFW: "false"                 PHOTOPRISM_UPLOAD_NSFW: "true"                  PHOTOPRISM_DATABASE_DRIVER: "mysql"             PHOTOPRISM_DATABASE_SERVER: "mariadb:3306"      PHOTOPRISM_DATABASE_NAME: "photoprism"          PHOTOPRISM_DATABASE_USER: "root"               PHOTOPRISM_DATABASE_PASSWORD: "insecure"       PHOTOPRISM_SITE_TITLE: "PhotoPrism"      PHOTOPRISM_SITE_CAPTION: "Browse Your Life"      PHOTOPRISM_SITE_DESCRIPTION: ""      PHOTOPRISM_SITE_AUTHOR: ""      HOME: "/photoprism"    working_dir: "/photoprism"    volumes:      - "./data/originals:/photoprism/originals"          - "./data/imports:/photoprism/import"      - "./data/storage:/photoprism/storage"  mariadb:    container_name: photoprism__db    restart: unless-stopped    image: mariadb:10.6    security_opt:      - seccomp:unconfined      - apparmor:unconfined    command: mysqld --innodb-buffer-pool-size=128M --transaction-isolation=READ-COMMITTED --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci --max-connections=512 --innodb-rollback-on-timeout=OFF --innodb-lock-wait-timeout=120    volumes:      - "./database:/var/lib/mysql" # Important, don't remove    environment:      MYSQL_ROOT_PASSWORD: insecure      MYSQL_DATABASE: photoprism      MYSQL_USER: photoprism      MYSQL_PASSWORD: insecure
btw, have a nice day
(2018 - 2024) muerwre
+

Google Photos Alternative With Photoprism

Photo Prism is a free alternative to Google photos, can be set up with #docker.

Docker compose file to run it

Check out current example at photoprism's documentation.

version: '3.5'services:  photoprism:    container_name: photoprism__app    image: photoprism/photoprism:latest    depends_on:      - mariadb    restart: unless-stopped    security_opt:      - seccomp:unconfined      - apparmor:unconfined    ports:      - 2342:2342 # HTTP port (host:container)    environment:      PHOTOPRISM_ADMIN_PASSWORD: "password"      PHOTOPRISM_SITE_URL: "https://service.url/"      PHOTOPRISM_ORIGINALS_LIMIT: 5000      PHOTOPRISM_HTTP_COMPRESSION: "gzip"      PHOTOPRISM_DEBUG: "false"                PHOTOPRISM_PUBLIC: "false"            PHOTOPRISM_READONLY: "false"          PHOTOPRISM_EXPERIMENTAL: "false"      PHOTOPRISM_DISABLE_CHOWN: "false"      PHOTOPRISM_DISABLE_WEBDAV: "false"       PHOTOPRISM_DISABLE_SETTINGS: "false"      PHOTOPRISM_DISABLE_TENSORFLOW: "false"      PHOTOPRISM_DISABLE_FACES: "false"           PHOTOPRISM_DISABLE_CLASSIFICATION: "false"      PHOTOPRISM_DARKTABLE_PRESETS: "false"           PHOTOPRISM_DETECT_NSFW: "false"                 PHOTOPRISM_UPLOAD_NSFW: "true"                  PHOTOPRISM_DATABASE_DRIVER: "mysql"             PHOTOPRISM_DATABASE_SERVER: "mariadb:3306"      PHOTOPRISM_DATABASE_NAME: "photoprism"          PHOTOPRISM_DATABASE_USER: "root"               PHOTOPRISM_DATABASE_PASSWORD: "insecure"       PHOTOPRISM_SITE_TITLE: "PhotoPrism"      PHOTOPRISM_SITE_CAPTION: "Browse Your Life"      PHOTOPRISM_SITE_DESCRIPTION: ""      PHOTOPRISM_SITE_AUTHOR: ""      HOME: "/photoprism"    working_dir: "/photoprism"    volumes:      - "./data/originals:/photoprism/originals"          - "./data/imports:/photoprism/import"      - "./data/storage:/photoprism/storage"  mariadb:    container_name: photoprism__db    restart: unless-stopped    image: mariadb:10.6    security_opt:      - seccomp:unconfined      - apparmor:unconfined    command: mysqld --innodb-buffer-pool-size=128M --transaction-isolation=READ-COMMITTED --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci --max-connections=512 --innodb-rollback-on-timeout=OFF --innodb-lock-wait-timeout=120    volumes:      - "./database:/var/lib/mysql" # Important, don't remove    environment:      MYSQL_ROOT_PASSWORD: insecure      MYSQL_DATABASE: photoprism      MYSQL_USER: photoprism      MYSQL_PASSWORD: insecure
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/linux/linux-on-asus-zenbook-um3402-ya/_payload.js b/docs/linux/linux-on-asus-zenbook-um3402-ya/_payload.js index 4d5a0aa..1da8261 100644 --- a/docs/linux/linux-on-asus-zenbook-um3402-ya/_payload.js +++ b/docs/linux/linux-on-asus-zenbook-um3402-ya/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:t,_path:u},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-fA8a6w5U1s":{_path:u,_dir:"linux",_draft:m,_partial:m,_locale:"en",_empty:m,title:t,description:v,excerpt:{type:w,children:[{type:b,tag:f,props:{id:n},children:[{type:a,value:o}]},{type:b,tag:g,props:{},children:[{type:b,tag:c,props:{},children:[{type:b,tag:d,props:{href:x,rel:[e]},children:[{type:a,value:y}]},{type:a,value:z}]},{type:b,tag:c,props:{},children:[{type:b,tag:d,props:{href:A,rel:[e]},children:[{type:a,value:B}]}]},{type:b,tag:c,props:{},children:[{type:a,value:C},{type:b,tag:g,props:{},children:[{type:b,tag:c,props:{},children:[{type:a,value:D}]},{type:b,tag:c,props:{},children:[{type:a,value:E}]},{type:b,tag:c,props:{},children:[{type:a,value:F}]},{type:b,tag:c,props:{},children:[{type:a,value:G}]}]}]},{type:b,tag:c,props:{},children:[{type:a,value:H}]},{type:b,tag:c,props:{},children:[{type:a,value:I},{type:b,tag:d,props:{href:J,rel:[e]},children:[{type:a,value:K}]},{type:a,value:L}]}]},{type:b,tag:f,props:{id:p},children:[{type:a,value:q}]},{type:b,tag:h,props:{},children:[{type:b,tag:M,props:{},children:[{type:a,value:N}]},{type:a,value:O}]},{type:b,tag:h,props:{},children:[{type:a,value:P},{type:b,tag:d,props:{href:Q,rel:[e]},children:[{type:a,value:R}]},{type:a,value:S},{type:b,tag:j,props:{className:[k]},children:[{type:a,value:T}]},{type:a,value:U}]},{type:b,tag:h,props:{},children:[{type:a,value:V},{type:b,tag:j,props:{className:[k]},children:[{type:a,value:W}]},{type:a,value:X}]},{type:b,tag:f,props:{id:r},children:[{type:a,value:s}]},{type:b,tag:g,props:{},children:[{type:b,tag:c,props:{},children:[{type:a,value:Y},{type:b,tag:l,props:{},children:[{type:a,value:Z}]},{type:a,value:_},{type:b,tag:l,props:{},children:[{type:a,value:$}]}]}]}]},body:{type:w,children:[{type:b,tag:f,props:{id:n},children:[{type:a,value:o}]},{type:b,tag:g,props:{},children:[{type:b,tag:c,props:{},children:[{type:b,tag:d,props:{href:x,rel:[e]},children:[{type:a,value:y}]},{type:a,value:z}]},{type:b,tag:c,props:{},children:[{type:b,tag:d,props:{href:A,rel:[e]},children:[{type:a,value:B}]}]},{type:b,tag:c,props:{},children:[{type:a,value:C},{type:b,tag:g,props:{},children:[{type:b,tag:c,props:{},children:[{type:a,value:D}]},{type:b,tag:c,props:{},children:[{type:a,value:E}]},{type:b,tag:c,props:{},children:[{type:a,value:F}]},{type:b,tag:c,props:{},children:[{type:a,value:G}]}]}]},{type:b,tag:c,props:{},children:[{type:a,value:H}]},{type:b,tag:c,props:{},children:[{type:a,value:I},{type:b,tag:d,props:{href:J,rel:[e]},children:[{type:a,value:K}]},{type:a,value:L}]}]},{type:b,tag:f,props:{id:p},children:[{type:a,value:q}]},{type:b,tag:h,props:{},children:[{type:b,tag:M,props:{},children:[{type:a,value:N}]},{type:a,value:O}]},{type:b,tag:h,props:{},children:[{type:a,value:P},{type:b,tag:d,props:{href:Q,rel:[e]},children:[{type:a,value:R}]},{type:a,value:S},{type:b,tag:j,props:{className:[k]},children:[{type:a,value:T}]},{type:a,value:U}]},{type:b,tag:h,props:{},children:[{type:a,value:V},{type:b,tag:j,props:{className:[k]},children:[{type:a,value:W}]},{type:a,value:X}]},{type:b,tag:f,props:{id:r},children:[{type:a,value:s}]},{type:b,tag:g,props:{},children:[{type:b,tag:c,props:{},children:[{type:a,value:Y},{type:b,tag:l,props:{},children:[{type:a,value:Z}]},{type:a,value:_},{type:b,tag:l,props:{},children:[{type:a,value:$}]}]}]}],toc:{title:v,searchDepth:i,depth:i,links:[{id:n,depth:i,text:o},{id:p,depth:i,text:q},{id:r,depth:i,text:s}]}},_type:"markdown",_id:"content:Linux:Linux on Asus Zenbook UM3402-YA.md",_source:"content",_file:"Linux\u002FLinux on Asus Zenbook UM3402-YA.md",_extension:"md"}},prerenderedAt:1711020227879}}("text","element","li","a","nofollow","h2","ul","p",2,"span","highlight","code-inline",false,"installing-linux-with-dualboot-alongside-windows-11","Installing Linux with DualBoot alongside Windows 11","getting-bluetooth-working-with-mediatek-7921e","Getting bluetooth working with Mediatek 7921e","power-usage-optimizations","Power usage optimizations","Linux On Asus Zenbook UM3402 YA","\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya","","root","https:\u002F\u002Fwww.asus.com\u002Fsupport\u002FFAQ\u002F1047461\u002F","Disable BitLocker in Windows",", don't forget to backup your key","https:\u002F\u002Fwww.asus.com\u002Fme-en\u002Fsupport\u002FFAQ\u002F1044688\u002F#Win11","Shrink system partition","Disable Secure Boot in Bios:","Pressing F2 while booting","Then F7 in bios","Select \"Security\" -\u003E \"Secure Boot\" -\u003E Disable.","Press F10 to save and reboot","Boot in windows, check that everything's wotking","Burn image with ","https:\u002F\u002Frufus.ie\u002F","rufus",", reboot, press F2, choose your USB drive as first boot option","strong","Problem",": WiFi is working on Zenbook UM3402-YA, but bluetooth doesn't.","According to this ","https:\u002F\u002Fwww.linux.org\u002Fthreads\u002Fsolved-wifi-adaptator-not-found-mediatek-wi-fi-6-mt7921-wireless-lan-card.37699\u002Fpage-2#post-143291","answer"," you should just turn your laptop off, disconnect power supply and ","hold power key for 60 seconds",".","After that press Power key again and wait for about 10-20sec for asus logo to appear. Then ","press F2 and disable secure boot again",", that's the necessary part.","Install ","tlp"," and enable it with ","systemctl enable --now tlp")) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:t,_path:u},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-fA8a6w5U1s":{_path:u,_dir:"linux",_draft:m,_partial:m,_locale:"en",_empty:m,title:t,description:v,excerpt:{type:w,children:[{type:b,tag:f,props:{id:n},children:[{type:a,value:o}]},{type:b,tag:g,props:{},children:[{type:b,tag:c,props:{},children:[{type:b,tag:d,props:{href:x,rel:[e]},children:[{type:a,value:y}]},{type:a,value:z}]},{type:b,tag:c,props:{},children:[{type:b,tag:d,props:{href:A,rel:[e]},children:[{type:a,value:B}]}]},{type:b,tag:c,props:{},children:[{type:a,value:C},{type:b,tag:g,props:{},children:[{type:b,tag:c,props:{},children:[{type:a,value:D}]},{type:b,tag:c,props:{},children:[{type:a,value:E}]},{type:b,tag:c,props:{},children:[{type:a,value:F}]},{type:b,tag:c,props:{},children:[{type:a,value:G}]}]}]},{type:b,tag:c,props:{},children:[{type:a,value:H}]},{type:b,tag:c,props:{},children:[{type:a,value:I},{type:b,tag:d,props:{href:J,rel:[e]},children:[{type:a,value:K}]},{type:a,value:L}]}]},{type:b,tag:f,props:{id:p},children:[{type:a,value:q}]},{type:b,tag:h,props:{},children:[{type:b,tag:M,props:{},children:[{type:a,value:N}]},{type:a,value:O}]},{type:b,tag:h,props:{},children:[{type:a,value:P},{type:b,tag:d,props:{href:Q,rel:[e]},children:[{type:a,value:R}]},{type:a,value:S},{type:b,tag:j,props:{className:[k]},children:[{type:a,value:T}]},{type:a,value:U}]},{type:b,tag:h,props:{},children:[{type:a,value:V},{type:b,tag:j,props:{className:[k]},children:[{type:a,value:W}]},{type:a,value:X}]},{type:b,tag:f,props:{id:r},children:[{type:a,value:s}]},{type:b,tag:g,props:{},children:[{type:b,tag:c,props:{},children:[{type:a,value:Y},{type:b,tag:l,props:{},children:[{type:a,value:Z}]},{type:a,value:_},{type:b,tag:l,props:{},children:[{type:a,value:$}]}]}]}]},body:{type:w,children:[{type:b,tag:f,props:{id:n},children:[{type:a,value:o}]},{type:b,tag:g,props:{},children:[{type:b,tag:c,props:{},children:[{type:b,tag:d,props:{href:x,rel:[e]},children:[{type:a,value:y}]},{type:a,value:z}]},{type:b,tag:c,props:{},children:[{type:b,tag:d,props:{href:A,rel:[e]},children:[{type:a,value:B}]}]},{type:b,tag:c,props:{},children:[{type:a,value:C},{type:b,tag:g,props:{},children:[{type:b,tag:c,props:{},children:[{type:a,value:D}]},{type:b,tag:c,props:{},children:[{type:a,value:E}]},{type:b,tag:c,props:{},children:[{type:a,value:F}]},{type:b,tag:c,props:{},children:[{type:a,value:G}]}]}]},{type:b,tag:c,props:{},children:[{type:a,value:H}]},{type:b,tag:c,props:{},children:[{type:a,value:I},{type:b,tag:d,props:{href:J,rel:[e]},children:[{type:a,value:K}]},{type:a,value:L}]}]},{type:b,tag:f,props:{id:p},children:[{type:a,value:q}]},{type:b,tag:h,props:{},children:[{type:b,tag:M,props:{},children:[{type:a,value:N}]},{type:a,value:O}]},{type:b,tag:h,props:{},children:[{type:a,value:P},{type:b,tag:d,props:{href:Q,rel:[e]},children:[{type:a,value:R}]},{type:a,value:S},{type:b,tag:j,props:{className:[k]},children:[{type:a,value:T}]},{type:a,value:U}]},{type:b,tag:h,props:{},children:[{type:a,value:V},{type:b,tag:j,props:{className:[k]},children:[{type:a,value:W}]},{type:a,value:X}]},{type:b,tag:f,props:{id:r},children:[{type:a,value:s}]},{type:b,tag:g,props:{},children:[{type:b,tag:c,props:{},children:[{type:a,value:Y},{type:b,tag:l,props:{},children:[{type:a,value:Z}]},{type:a,value:_},{type:b,tag:l,props:{},children:[{type:a,value:$}]}]}]}],toc:{title:v,searchDepth:i,depth:i,links:[{id:n,depth:i,text:o},{id:p,depth:i,text:q},{id:r,depth:i,text:s}]}},_type:"markdown",_id:"content:Linux:Linux on Asus Zenbook UM3402-YA.md",_source:"content",_file:"Linux\u002FLinux on Asus Zenbook UM3402-YA.md",_extension:"md"}},prerenderedAt:1711020862334}}("text","element","li","a","nofollow","h2","ul","p",2,"span","highlight","code-inline",false,"installing-linux-with-dualboot-alongside-windows-11","Installing Linux with DualBoot alongside Windows 11","getting-bluetooth-working-with-mediatek-7921e","Getting bluetooth working with Mediatek 7921e","power-usage-optimizations","Power usage optimizations","Linux On Asus Zenbook UM3402 YA","\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya","","root","https:\u002F\u002Fwww.asus.com\u002Fsupport\u002FFAQ\u002F1047461\u002F","Disable BitLocker in Windows",", don't forget to backup your key","https:\u002F\u002Fwww.asus.com\u002Fme-en\u002Fsupport\u002FFAQ\u002F1044688\u002F#Win11","Shrink system partition","Disable Secure Boot in Bios:","Pressing F2 while booting","Then F7 in bios","Select \"Security\" -\u003E \"Secure Boot\" -\u003E Disable.","Press F10 to save and reboot","Boot in windows, check that everything's wotking","Burn image with ","https:\u002F\u002Frufus.ie\u002F","rufus",", reboot, press F2, choose your USB drive as first boot option","strong","Problem",": WiFi is working on Zenbook UM3402-YA, but bluetooth doesn't.","According to this ","https:\u002F\u002Fwww.linux.org\u002Fthreads\u002Fsolved-wifi-adaptator-not-found-mediatek-wi-fi-6-mt7921-wireless-lan-card.37699\u002Fpage-2#post-143291","answer"," you should just turn your laptop off, disconnect power supply and ","hold power key for 60 seconds",".","After that press Power key again and wait for about 10-20sec for asus logo to appear. Then ","press F2 and disable secure boot again",", that's the necessary part.","Install ","tlp"," and enable it with ","systemctl enable --now tlp")) \ No newline at end of file diff --git a/docs/linux/linux-on-asus-zenbook-um3402-ya/index.html b/docs/linux/linux-on-asus-zenbook-um3402-ya/index.html index 75db3a1..aee54da 100644 --- a/docs/linux/linux-on-asus-zenbook-um3402-ya/index.html +++ b/docs/linux/linux-on-asus-zenbook-um3402-ya/index.html @@ -1,6 +1,6 @@ -Linux On Asus Zenbook UM3402 YA • Obsidian Garden -

Linux On Asus Zenbook UM3402 YA

Installing Linux with DualBoot alongside Windows 11

  • Disable BitLocker in Windows, don't forget to backup your key
  • Shrink system partition
  • Disable Secure Boot in Bios:
    • Pressing F2 while booting
    • Then F7 in bios
    • Select "Security" -> "Secure Boot" -> Disable.
    • Press F10 to save and reboot
  • Boot in windows, check that everything's wotking
  • Burn image with rufus, reboot, press F2, choose your USB drive as first boot option

Getting bluetooth working with Mediatek 7921e

Problem: WiFi is working on Zenbook UM3402-YA, but bluetooth doesn't.

According to this answer you should just turn your laptop off, disconnect power supply and hold power key for 60 seconds.

After that press Power key again and wait for about 10-20sec for asus logo to appear. Then press F2 and disable secure boot again, that's the necessary part.

Power usage optimizations

  • Install tlp and enable it with systemctl enable --now tlp
btw, have a nice day
(2018 - 2024) muerwre
+

Linux On Asus Zenbook UM3402 YA

Installing Linux with DualBoot alongside Windows 11

  • Disable BitLocker in Windows, don't forget to backup your key
  • Shrink system partition
  • Disable Secure Boot in Bios:
    • Pressing F2 while booting
    • Then F7 in bios
    • Select "Security" -> "Secure Boot" -> Disable.
    • Press F10 to save and reboot
  • Boot in windows, check that everything's wotking
  • Burn image with rufus, reboot, press F2, choose your USB drive as first boot option

Getting bluetooth working with Mediatek 7921e

Problem: WiFi is working on Zenbook UM3402-YA, but bluetooth doesn't.

According to this answer you should just turn your laptop off, disconnect power supply and hold power key for 60 seconds.

After that press Power key again and wait for about 10-20sec for asus logo to appear. Then press F2 and disable secure boot again, that's the necessary part.

Power usage optimizations

  • Install tlp and enable it with systemctl enable --now tlp
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/linux/resume-or-start-screen-session/_payload.js b/docs/linux/resume-or-start-screen-session/_payload.js index 36288fd..74f0ff4 100644 --- a/docs/linux/resume-or-start-screen-session/_payload.js +++ b/docs/linux/resume-or-start-screen-session/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:j,_path:k},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-KZPaWw5ajQ":{_path:k,_dir:"linux",_draft:f,_partial:f,_locale:"en",_empty:f,title:j,description:"Running this script will enter currently running screen session or will start new one.",excerpt:{type:l,children:[{type:a,tag:m,props:{},children:[{type:b,value:n},{type:a,tag:o,props:{},children:[{type:b,value:p}]},{type:b,value:q}]},{type:a,tag:d,props:{code:g,language:r},children:[{type:a,tag:s,props:{},children:[{type:a,tag:d,props:{__ignoreMap:h},children:[{type:b,value:g}]}]}]}]},body:{type:l,children:[{type:a,tag:m,props:{},children:[{type:b,value:n},{type:a,tag:o,props:{},children:[{type:b,value:p}]},{type:b,value:q}]},{type:a,tag:d,props:{code:g,language:r},children:[{type:a,tag:s,props:{},children:[{type:a,tag:d,props:{__ignoreMap:h},children:[{type:a,tag:c,props:{class:"line"},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:"( screen -r bash "}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:" ( screen -d bash "}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:"&&"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:" screen -r bash "}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:" screen -SAm bash bash ) )"}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-14dc6a{color:#FF7B72}.ct-322b82{color:#C9D1D9}.light .ct-322b82{color:#657B83}.light .ct-14dc6a{color:#859900}"}]}],toc:{title:h,searchDepth:u,depth:u,links:[]}},_type:"markdown",_id:"content:Linux:Resume or start screen session.md",_source:"content",_file:"Linux\u002FResume or start screen session.md",_extension:"md"}},prerenderedAt:1711020227898}}("element","text","span","code","ct-322b82",false,"( screen -r bash || ( screen -d bash && screen -r bash || screen -SAm bash bash ) )\n","","ct-14dc6a","Resume Or Start Screen Session","\u002Flinux\u002Fresume-or-start-screen-session","root","p","Running this script will enter currently running ","code-inline","screen"," session or will start new one.","shell","pre","||",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:j,_path:k},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-KZPaWw5ajQ":{_path:k,_dir:"linux",_draft:f,_partial:f,_locale:"en",_empty:f,title:j,description:"Running this script will enter currently running screen session or will start new one.",excerpt:{type:l,children:[{type:a,tag:m,props:{},children:[{type:b,value:n},{type:a,tag:o,props:{},children:[{type:b,value:p}]},{type:b,value:q}]},{type:a,tag:d,props:{code:g,language:r},children:[{type:a,tag:s,props:{},children:[{type:a,tag:d,props:{__ignoreMap:h},children:[{type:b,value:g}]}]}]}]},body:{type:l,children:[{type:a,tag:m,props:{},children:[{type:b,value:n},{type:a,tag:o,props:{},children:[{type:b,value:p}]},{type:b,value:q}]},{type:a,tag:d,props:{code:g,language:r},children:[{type:a,tag:s,props:{},children:[{type:a,tag:d,props:{__ignoreMap:h},children:[{type:a,tag:c,props:{class:"line"},children:[{type:a,tag:c,props:{class:e},children:[{type:b,value:"( screen -r bash "}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:" ( screen -d bash "}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:"&&"}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:" screen -r bash "}]},{type:a,tag:c,props:{class:i},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:e},children:[{type:b,value:" screen -SAm bash bash ) )"}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-c0622b{color:#FF7B72}.ct-8433fd{color:#C9D1D9}.light .ct-8433fd{color:#657B83}.light .ct-c0622b{color:#859900}"}]}],toc:{title:h,searchDepth:u,depth:u,links:[]}},_type:"markdown",_id:"content:Linux:Resume or start screen session.md",_source:"content",_file:"Linux\u002FResume or start screen session.md",_extension:"md"}},prerenderedAt:1711020862373}}("element","text","span","code","ct-8433fd",false,"( screen -r bash || ( screen -d bash && screen -r bash || screen -SAm bash bash ) )\n","","ct-c0622b","Resume Or Start Screen Session","\u002Flinux\u002Fresume-or-start-screen-session","root","p","Running this script will enter currently running ","code-inline","screen"," session or will start new one.","shell","pre","||",2)) \ No newline at end of file diff --git a/docs/linux/resume-or-start-screen-session/index.html b/docs/linux/resume-or-start-screen-session/index.html index 046b134..c5f3a5e 100644 --- a/docs/linux/resume-or-start-screen-session/index.html +++ b/docs/linux/resume-or-start-screen-session/index.html @@ -1,6 +1,6 @@ -Resume Or Start Screen Session • Obsidian Garden -

Resume Or Start Screen Session

Running this script will enter currently running screen session or will start new one.

( screen -r bash || ( screen -d bash && screen -r bash || screen -SAm bash bash ) )
btw, have a nice day
(2018 - 2024) muerwre
+

Resume Or Start Screen Session

Running this script will enter currently running screen session or will start new one.

( screen -r bash || ( screen -d bash && screen -r bash || screen -SAm bash bash ) )
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/linux/rsync-file-with-ssh/_payload.js b/docs/linux/rsync-file-with-ssh/_payload.js index b795b69..6f815dc 100644 --- a/docs/linux/rsync-file-with-ssh/_payload.js +++ b/docs/linux/rsync-file-with-ssh/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:p,_path:q},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-3kXgAF354y":{_path:q,_dir:"linux",_draft:l,_partial:l,_locale:"en",_empty:l,title:p,description:m,excerpt:{type:r,children:[{type:a,tag:s,props:{},children:[{type:c,value:m}]},{type:a,tag:k,props:{code:n,language:t},children:[{type:a,tag:u,props:{},children:[{type:a,tag:k,props:{__ignoreMap:o},children:[{type:c,value:n}]}]}]}]},body:{type:r,children:[{type:a,tag:s,props:{},children:[{type:c,value:m}]},{type:a,tag:k,props:{code:n,language:t},children:[{type:a,tag:u,props:{},children:[{type:a,tag:k,props:{__ignoreMap:o},children:[{type:a,tag:b,props:{class:d},children:[{type:a,tag:b,props:{class:"ct-90ed2f"},children:[{type:c,value:"#!\u002Fbin\u002Fbash"}]}]},{type:a,tag:b,props:{class:d},children:[]},{type:a,tag:b,props:{class:d},children:[{type:a,tag:b,props:{class:e},children:[{type:c,value:"PORT=22"}]}]},{type:a,tag:b,props:{class:d},children:[{type:a,tag:b,props:{class:e},children:[{type:c,value:"USER=user"}]}]},{type:a,tag:b,props:{class:d},children:[{type:a,tag:b,props:{class:e},children:[{type:c,value:"HOST=example.com"}]}]},{type:a,tag:b,props:{class:d},children:[{type:a,tag:b,props:{class:e},children:[{type:c,value:"REMOTE_PATH=\u002Ftmp"}]}]},{type:a,tag:b,props:{class:d},children:[{type:a,tag:b,props:{class:e},children:[{type:c,value:"REMOTE_FILE=sample.text"}]}]},{type:a,tag:b,props:{class:d},children:[{type:a,tag:b,props:{class:e},children:[{type:c,value:"DEST_PATH=.\u002F"}]}]},{type:a,tag:b,props:{class:d},children:[]},{type:a,tag:b,props:{class:d},children:[{type:a,tag:b,props:{class:e},children:[{type:c,value:"rsync -a -e "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"\"ssh -p "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"PORT"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:e},children:[{type:c,value:" -P -v \\"}]}]},{type:a,tag:b,props:{class:d},children:[{type:a,tag:b,props:{class:e},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"USER"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"@"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"HOST"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:":"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"REMOTE_PATH"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"\u002F"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"REMOTE_FILE"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:e},children:[{type:c,value:" \\"}]}]},{type:a,tag:b,props:{class:d},children:[{type:a,tag:b,props:{class:e},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"DEST_PATH"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-7ae610{color:#C9D1D9}.ct-6e26d5{color:#C9D1D9}.ct-51c85e{color:#A5D6FF}.ct-ea4740{color:#C9D1D9}.ct-90ed2f{color:#8B949E}.light .ct-90ed2f{color:#93A1A1}.light .ct-ea4740{color:#657B83}.light .ct-51c85e{color:#2AA198}.light .ct-6e26d5{color:#859900}.light .ct-7ae610{color:#268BD2}"}]}],toc:{title:o,searchDepth:w,depth:w,links:[]}},_type:"markdown",_id:"content:Linux:Rsync file with SSH.md",_source:"content",_file:"Linux\u002FRsync file with SSH.md",_extension:"md"}},prerenderedAt:1711020227912}}("element","span","text","line","ct-ea4740","ct-51c85e","ct-6e26d5","$","ct-7ae610","\"","code",false,"Downloads file from #SSH with rsync and puts it in current folder.","#!\u002Fbin\u002Fbash\n\nPORT=22\nUSER=user\nHOST=example.com\nREMOTE_PATH=\u002Ftmp\nREMOTE_FILE=sample.text\nDEST_PATH=.\u002F\n\nrsync -a -e \"ssh -p $PORT\" -P -v \\\n \"$USER@$HOST:$REMOTE_PATH\u002F$REMOTE_FILE\" \\\n \"$DEST_PATH\"\n","","Rsync File With SSH","\u002Flinux\u002Frsync-file-with-ssh","root","p","bash","pre"," ",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:p,_path:q},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-3kXgAF354y":{_path:q,_dir:"linux",_draft:l,_partial:l,_locale:"en",_empty:l,title:p,description:m,excerpt:{type:r,children:[{type:a,tag:s,props:{},children:[{type:c,value:m}]},{type:a,tag:k,props:{code:n,language:t},children:[{type:a,tag:u,props:{},children:[{type:a,tag:k,props:{__ignoreMap:o},children:[{type:c,value:n}]}]}]}]},body:{type:r,children:[{type:a,tag:s,props:{},children:[{type:c,value:m}]},{type:a,tag:k,props:{code:n,language:t},children:[{type:a,tag:u,props:{},children:[{type:a,tag:k,props:{__ignoreMap:o},children:[{type:a,tag:b,props:{class:d},children:[{type:a,tag:b,props:{class:"ct-6bdabe"},children:[{type:c,value:"#!\u002Fbin\u002Fbash"}]}]},{type:a,tag:b,props:{class:d},children:[]},{type:a,tag:b,props:{class:d},children:[{type:a,tag:b,props:{class:e},children:[{type:c,value:"PORT=22"}]}]},{type:a,tag:b,props:{class:d},children:[{type:a,tag:b,props:{class:e},children:[{type:c,value:"USER=user"}]}]},{type:a,tag:b,props:{class:d},children:[{type:a,tag:b,props:{class:e},children:[{type:c,value:"HOST=example.com"}]}]},{type:a,tag:b,props:{class:d},children:[{type:a,tag:b,props:{class:e},children:[{type:c,value:"REMOTE_PATH=\u002Ftmp"}]}]},{type:a,tag:b,props:{class:d},children:[{type:a,tag:b,props:{class:e},children:[{type:c,value:"REMOTE_FILE=sample.text"}]}]},{type:a,tag:b,props:{class:d},children:[{type:a,tag:b,props:{class:e},children:[{type:c,value:"DEST_PATH=.\u002F"}]}]},{type:a,tag:b,props:{class:d},children:[]},{type:a,tag:b,props:{class:d},children:[{type:a,tag:b,props:{class:e},children:[{type:c,value:"rsync -a -e "}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"\"ssh -p "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"PORT"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:e},children:[{type:c,value:" -P -v \\"}]}]},{type:a,tag:b,props:{class:d},children:[{type:a,tag:b,props:{class:e},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"USER"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"@"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"HOST"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:":"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"REMOTE_PATH"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"\u002F"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"REMOTE_FILE"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:e},children:[{type:c,value:" \\"}]}]},{type:a,tag:b,props:{class:d},children:[{type:a,tag:b,props:{class:e},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:h}]},{type:a,tag:b,props:{class:i},children:[{type:c,value:"DEST_PATH"}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:j}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-43fe0d{color:#C9D1D9}.ct-1f63bb{color:#C9D1D9}.ct-e634ef{color:#A5D6FF}.ct-26e021{color:#C9D1D9}.ct-6bdabe{color:#8B949E}.light .ct-6bdabe{color:#93A1A1}.light .ct-26e021{color:#657B83}.light .ct-e634ef{color:#2AA198}.light .ct-1f63bb{color:#859900}.light .ct-43fe0d{color:#268BD2}"}]}],toc:{title:o,searchDepth:w,depth:w,links:[]}},_type:"markdown",_id:"content:Linux:Rsync file with SSH.md",_source:"content",_file:"Linux\u002FRsync file with SSH.md",_extension:"md"}},prerenderedAt:1711020862399}}("element","span","text","line","ct-26e021","ct-e634ef","ct-1f63bb","$","ct-43fe0d","\"","code",false,"Downloads file from #SSH with rsync and puts it in current folder.","#!\u002Fbin\u002Fbash\n\nPORT=22\nUSER=user\nHOST=example.com\nREMOTE_PATH=\u002Ftmp\nREMOTE_FILE=sample.text\nDEST_PATH=.\u002F\n\nrsync -a -e \"ssh -p $PORT\" -P -v \\\n \"$USER@$HOST:$REMOTE_PATH\u002F$REMOTE_FILE\" \\\n \"$DEST_PATH\"\n","","Rsync File With SSH","\u002Flinux\u002Frsync-file-with-ssh","root","p","bash","pre"," ",2)) \ No newline at end of file diff --git a/docs/linux/rsync-file-with-ssh/index.html b/docs/linux/rsync-file-with-ssh/index.html index c7cc193..371f559 100644 --- a/docs/linux/rsync-file-with-ssh/index.html +++ b/docs/linux/rsync-file-with-ssh/index.html @@ -1,6 +1,6 @@ -Rsync File With SSH • Obsidian Garden -

Rsync File With SSH

Downloads file from #SSH with rsync and puts it in current folder.

#!/bin/bashPORT=22USER=userHOST=example.comREMOTE_PATH=/tmpREMOTE_FILE=sample.textDEST_PATH=./rsync -a -e "ssh -p $PORT" -P -v \    "$USER@$HOST:$REMOTE_PATH/$REMOTE_FILE" \    "$DEST_PATH"
btw, have a nice day
(2018 - 2024) muerwre
+

Rsync File With SSH

Downloads file from #SSH with rsync and puts it in current folder.

#!/bin/bashPORT=22USER=userHOST=example.comREMOTE_PATH=/tmpREMOTE_FILE=sample.textDEST_PATH=./rsync -a -e "ssh -p $PORT" -P -v \    "$USER@$HOST:$REMOTE_PATH/$REMOTE_FILE" \    "$DEST_PATH"
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/linux/setting-up-nginx/_payload.js b/docs/linux/setting-up-nginx/_payload.js index e53a459..871319f 100644 --- a/docs/linux/setting-up-nginx/_payload.js +++ b/docs/linux/setting-up-nginx/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:P,_path:Q},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-jVEFIZPtgx":{_path:Q,_dir:"linux",_draft:C,_partial:C,_locale:"en",_empty:C,title:P,description:j,excerpt:{type:R,children:[{type:a,tag:l,props:{id:D},children:[{type:c,value:E}]},{type:a,tag:h,props:{code:F,language:m},children:[{type:a,tag:n,props:{},children:[{type:a,tag:h,props:{__ignoreMap:j},children:[{type:c,value:F}]}]}]},{type:a,tag:l,props:{id:G},children:[{type:c,value:H}]},{type:a,tag:h,props:{code:I,language:m},children:[{type:a,tag:n,props:{},children:[{type:a,tag:h,props:{__ignoreMap:j},children:[{type:c,value:I}]}]}]},{type:a,tag:l,props:{id:J},children:[{type:c,value:K}]},{type:a,tag:S,props:{},children:[{type:c,value:T},{type:a,tag:o,props:{},children:[{type:c,value:U}]},{type:c,value:V},{type:a,tag:o,props:{},children:[{type:c,value:W}]},{type:c,value:X},{type:a,tag:o,props:{},children:[{type:c,value:Y}]},{type:c,value:Z},{type:a,tag:_,props:{href:s,rel:[$]},children:[{type:c,value:s}]},{type:c,value:aa}]},{type:a,tag:h,props:{code:L,language:m},children:[{type:a,tag:n,props:{},children:[{type:a,tag:h,props:{__ignoreMap:j},children:[{type:c,value:L}]}]}]}]},body:{type:R,children:[{type:a,tag:l,props:{id:D},children:[{type:c,value:E}]},{type:a,tag:h,props:{code:F,language:m},children:[{type:a,tag:n,props:{},children:[{type:a,tag:h,props:{__ignoreMap:j},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:t},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:ab},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:ad},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:af}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"# First attempt to serve request as file, then"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"# as directory, then fall back to displaying a 404."}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:"ct-671b3f"},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ag}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]}]}]}]}]},{type:a,tag:l,props:{id:G},children:[{type:c,value:H}]},{type:a,tag:h,props:{code:I,language:m},children:[{type:a,tag:n,props:{},children:[{type:a,tag:h,props:{__ignoreMap:j},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:t},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:" client_max_body_size "}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"200M;"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]}]}]}]}]},{type:a,tag:l,props:{id:J},children:[{type:c,value:K}]},{type:a,tag:S,props:{},children:[{type:c,value:T},{type:a,tag:o,props:{},children:[{type:c,value:U}]},{type:c,value:V},{type:a,tag:o,props:{},children:[{type:c,value:W}]},{type:c,value:X},{type:a,tag:o,props:{},children:[{type:c,value:Y}]},{type:c,value:Z},{type:a,tag:_,props:{href:s,rel:[$]},children:[{type:c,value:s}]},{type:c,value:aa}]},{type:a,tag:h,props:{code:L,language:m},children:[{type:a,tag:n,props:{},children:[{type:a,tag:h,props:{__ignoreMap:j},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:t},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"80;"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ai}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"return"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:"ct-078709"},children:[{type:c,value:"301"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" https:\u002F\u002Fnext.vault48.org"}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:A},children:[{type:c,value:"request_uri"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:t},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"443 ssl http2;"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"[::]:443 ssl http2;"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"# managed by Certbot"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:" ssl_certificate "}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"\u002Fetc\u002Fletsencrypt\u002Flive\u002Fvault48.org\u002Ffullchain.pem; "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:" ssl_certificate_key "}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"\u002Fetc\u002Fletsencrypt\u002Flive\u002Fvault48.org\u002Fprivkey.pem; "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:" ssl_trusted_certificate "}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"\u002Fetc\u002Fletsencrypt\u002Flive\u002Fvault48.org\u002Fchain.pem;"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ai}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:ab},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:ad},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:af}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:" proxy_redirect "}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"off;"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"Host "}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:A},children:[{type:c,value:"host"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"X-Real-IP "}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:A},children:[{type:c,value:"remote_addr"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"X-Forwarded-For "}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:A},children:[{type:c,value:"proxy_add_x_forwarded_for"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:" proxy_pass "}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"http:\u002F\u002F127.0.0.1:8080;"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ag}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-e3a788{color:#C9D1D9}.ct-bc98b4{color:#C9D1D9}.ct-078709{color:#79C0FF}.ct-9982ad{color:#FF7B72}.ct-671b3f{color:#FF7B72}.ct-6f5638{color:#FFA657}.ct-f33879{color:#FF7B72}.ct-cdaa3d{color:#C9D1D9}.ct-ae28ca{color:#8B949E}.ct-ab6757{color:#C9D1D9}.ct-74d8c8{color:#FF7B72}.light .ct-74d8c8{color:#073642}.light .ct-ab6757{color:#657B83}.light .ct-ae28ca{color:#93A1A1}.light .ct-cdaa3d{color:#657B83}.light .ct-f33879{color:#073642}.light .ct-6f5638{color:#657B83}.light .ct-671b3f{color:#657B83}.light .ct-9982ad{color:#859900}.light .ct-078709{color:#D33682}.light .ct-bc98b4{color:#859900}.light .ct-e3a788{color:#268BD2}"}]}],toc:{title:j,searchDepth:r,depth:r,links:[{id:D,depth:r,text:E},{id:G,depth:r,text:H},{id:J,depth:r,text:K}]}},_type:"markdown",_id:"content:Linux:Setting up NGINX.md",_source:"content",_file:"Linux\u002FSetting up NGINX.md",_extension:"md"}},prerenderedAt:1711020227936}}("element","span","text","ct-ab6757","line","ct-9982ad"," ","code"," ","","ct-ae28ca","h2","nginx","pre","code-inline","ct-cdaa3d"," ",2,"https:\u002F\u002Fnext.vault48.org","ct-74d8c8","server"," {","# ...","}","ct-bc98b4","$","ct-e3a788",";",false,"fallback-url-for-spa-s","Fallback url for SPA-s","server {\n # ...\n location \u002F {\n # First attempt to serve request as file, then\n # as directory, then fall back to displaying a 404.\n try_files $uri $uri\u002F =404;\n }\n # ...\n}\n","set-up-for-uploads","Set up for uploads","server {\n # ...\n client_max_body_size 200M;\n # ...\n}\n","reverse-proxy-for-https","Reverse proxy for https","server {\n listen 80;\n server_name next.vault48.org;\n return 301 https:\u002F\u002Fnext.vault48.org$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n \n # managed by Certbot\n ssl_certificate \u002Fetc\u002Fletsencrypt\u002Flive\u002Fvault48.org\u002Ffullchain.pem; \n ssl_certificate_key \u002Fetc\u002Fletsencrypt\u002Flive\u002Fvault48.org\u002Fprivkey.pem; \n ssl_trusted_certificate \u002Fetc\u002Fletsencrypt\u002Flive\u002Fvault48.org\u002Fchain.pem;\n \n server_name next.vault48.org;\n \n location \u002F {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n \n proxy_pass http:\u002F\u002F127.0.0.1:8080;\n }\n}\n"," "," listen "," proxy_set_header ","Setting Up NGINX","\u002Flinux\u002Fsetting-up-nginx","root","p","Given config forwards ","https"," traffic to ","http"," on port ","8080"," for ","a","nofollow","\nwith http2 support if possible.","ct-f33879","location","ct-6f5638","\u002F ","{"," }"," server_name ","next.vault48.org;")) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:P,_path:Q},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-jVEFIZPtgx":{_path:Q,_dir:"linux",_draft:C,_partial:C,_locale:"en",_empty:C,title:P,description:j,excerpt:{type:R,children:[{type:a,tag:l,props:{id:D},children:[{type:c,value:E}]},{type:a,tag:h,props:{code:F,language:m},children:[{type:a,tag:n,props:{},children:[{type:a,tag:h,props:{__ignoreMap:j},children:[{type:c,value:F}]}]}]},{type:a,tag:l,props:{id:G},children:[{type:c,value:H}]},{type:a,tag:h,props:{code:I,language:m},children:[{type:a,tag:n,props:{},children:[{type:a,tag:h,props:{__ignoreMap:j},children:[{type:c,value:I}]}]}]},{type:a,tag:l,props:{id:J},children:[{type:c,value:K}]},{type:a,tag:S,props:{},children:[{type:c,value:T},{type:a,tag:o,props:{},children:[{type:c,value:U}]},{type:c,value:V},{type:a,tag:o,props:{},children:[{type:c,value:W}]},{type:c,value:X},{type:a,tag:o,props:{},children:[{type:c,value:Y}]},{type:c,value:Z},{type:a,tag:_,props:{href:s,rel:[$]},children:[{type:c,value:s}]},{type:c,value:aa}]},{type:a,tag:h,props:{code:L,language:m},children:[{type:a,tag:n,props:{},children:[{type:a,tag:h,props:{__ignoreMap:j},children:[{type:c,value:L}]}]}]}]},body:{type:R,children:[{type:a,tag:l,props:{id:D},children:[{type:c,value:E}]},{type:a,tag:h,props:{code:F,language:m},children:[{type:a,tag:n,props:{},children:[{type:a,tag:h,props:{__ignoreMap:j},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:t},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:ab},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:ad},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:af}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"# First attempt to serve request as file, then"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"# as directory, then fall back to displaying a 404."}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:"ct-e3cb66"},children:[{type:c,value:g}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ag}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]}]}]}]}]},{type:a,tag:l,props:{id:G},children:[{type:c,value:H}]},{type:a,tag:h,props:{code:I,language:m},children:[{type:a,tag:n,props:{},children:[{type:a,tag:h,props:{__ignoreMap:j},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:t},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:" client_max_body_size "}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"200M;"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:w}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]}]}]}]}]},{type:a,tag:l,props:{id:J},children:[{type:c,value:K}]},{type:a,tag:S,props:{},children:[{type:c,value:T},{type:a,tag:o,props:{},children:[{type:c,value:U}]},{type:c,value:V},{type:a,tag:o,props:{},children:[{type:c,value:W}]},{type:c,value:X},{type:a,tag:o,props:{},children:[{type:c,value:Y}]},{type:c,value:Z},{type:a,tag:_,props:{href:s,rel:[$]},children:[{type:c,value:s}]},{type:c,value:aa}]},{type:a,tag:h,props:{code:L,language:m},children:[{type:a,tag:n,props:{},children:[{type:a,tag:h,props:{__ignoreMap:j},children:[{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:t},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"80;"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ai}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"return"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:"ct-9a42cf"},children:[{type:c,value:"301"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" https:\u002F\u002Fnext.vault48.org"}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:A},children:[{type:c,value:"request_uri"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]}]},{type:a,tag:b,props:{class:e},children:[]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:t},children:[{type:c,value:u}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:v}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"443 ssl http2;"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:N}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"[::]:443 ssl http2;"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"# managed by Certbot"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:" ssl_certificate "}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"\u002Fetc\u002Fletsencrypt\u002Flive\u002Fvault48.org\u002Ffullchain.pem; "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:" ssl_certificate_key "}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"\u002Fetc\u002Fletsencrypt\u002Flive\u002Fvault48.org\u002Fprivkey.pem; "}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:" ssl_trusted_certificate "}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"\u002Fetc\u002Fletsencrypt\u002Flive\u002Fvault48.org\u002Fchain.pem;"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:ah}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ai}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:p},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:ab},children:[{type:c,value:ac}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:g}]},{type:a,tag:b,props:{class:ad},children:[{type:c,value:ae}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:af}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:" proxy_redirect "}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"off;"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"Host "}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:A},children:[{type:c,value:"host"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"X-Real-IP "}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:A},children:[{type:c,value:"remote_addr"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"X-Forwarded-For "}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:z}]},{type:a,tag:b,props:{class:A},children:[{type:c,value:"proxy_add_x_forwarded_for"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:B}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:M}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:" proxy_pass "}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"http:\u002F\u002F127.0.0.1:8080;"}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:ag}]}]},{type:a,tag:b,props:{class:e},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-4b2209{color:#C9D1D9}.ct-5daac2{color:#C9D1D9}.ct-9a42cf{color:#79C0FF}.ct-e8f801{color:#FF7B72}.ct-e3cb66{color:#FF7B72}.ct-b1fd04{color:#FFA657}.ct-042ac1{color:#FF7B72}.ct-bd6321{color:#C9D1D9}.ct-0fc236{color:#8B949E}.ct-1a3354{color:#C9D1D9}.ct-43630c{color:#FF7B72}.light .ct-43630c{color:#073642}.light .ct-1a3354{color:#657B83}.light .ct-0fc236{color:#93A1A1}.light .ct-bd6321{color:#657B83}.light .ct-042ac1{color:#073642}.light .ct-b1fd04{color:#657B83}.light .ct-e3cb66{color:#657B83}.light .ct-e8f801{color:#859900}.light .ct-9a42cf{color:#D33682}.light .ct-5daac2{color:#859900}.light .ct-4b2209{color:#268BD2}"}]}],toc:{title:j,searchDepth:r,depth:r,links:[{id:D,depth:r,text:E},{id:G,depth:r,text:H},{id:J,depth:r,text:K}]}},_type:"markdown",_id:"content:Linux:Setting up NGINX.md",_source:"content",_file:"Linux\u002FSetting up NGINX.md",_extension:"md"}},prerenderedAt:1711020862435}}("element","span","text","ct-1a3354","line","ct-e8f801"," ","code"," ","","ct-0fc236","h2","nginx","pre","code-inline","ct-bd6321"," ",2,"https:\u002F\u002Fnext.vault48.org","ct-43630c","server"," {","# ...","}","ct-5daac2","$","ct-4b2209",";",false,"fallback-url-for-spa-s","Fallback url for SPA-s","server {\n # ...\n location \u002F {\n # First attempt to serve request as file, then\n # as directory, then fall back to displaying a 404.\n try_files $uri $uri\u002F =404;\n }\n # ...\n}\n","set-up-for-uploads","Set up for uploads","server {\n # ...\n client_max_body_size 200M;\n # ...\n}\n","reverse-proxy-for-https","Reverse proxy for https","server {\n listen 80;\n server_name next.vault48.org;\n return 301 https:\u002F\u002Fnext.vault48.org$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n \n # managed by Certbot\n ssl_certificate \u002Fetc\u002Fletsencrypt\u002Flive\u002Fvault48.org\u002Ffullchain.pem; \n ssl_certificate_key \u002Fetc\u002Fletsencrypt\u002Flive\u002Fvault48.org\u002Fprivkey.pem; \n ssl_trusted_certificate \u002Fetc\u002Fletsencrypt\u002Flive\u002Fvault48.org\u002Fchain.pem;\n \n server_name next.vault48.org;\n \n location \u002F {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n \n proxy_pass http:\u002F\u002F127.0.0.1:8080;\n }\n}\n"," "," listen "," proxy_set_header ","Setting Up NGINX","\u002Flinux\u002Fsetting-up-nginx","root","p","Given config forwards ","https"," traffic to ","http"," on port ","8080"," for ","a","nofollow","\nwith http2 support if possible.","ct-042ac1","location","ct-b1fd04","\u002F ","{"," }"," server_name ","next.vault48.org;")) \ No newline at end of file diff --git a/docs/linux/setting-up-nginx/index.html b/docs/linux/setting-up-nginx/index.html index d01a4f9..33fae31 100644 --- a/docs/linux/setting-up-nginx/index.html +++ b/docs/linux/setting-up-nginx/index.html @@ -1,7 +1,7 @@ -Setting Up NGINX • Obsidian Garden -

Setting Up NGINX

Fallback url for SPA-s

server {  # ...  location / {    # First attempt to serve request as file, then    # as directory, then fall back to displaying a 404.      }  # ...}

Set up for uploads

server {  # ...  client_max_body_size 200M;  # ...}

Reverse proxy for https

Given config forwards https traffic to http on port 8080 for https://next.vault48.org -with http2 support if possible.

server {  listen 80;  server_name next.vault48.org;  return 301 https://next.vault48.org$request_uri;}server {  listen 443 ssl http2;  listen [::]:443 ssl http2;    # managed by Certbot  ssl_certificate /etc/letsencrypt/live/vault48.org/fullchain.pem;   ssl_certificate_key /etc/letsencrypt/live/vault48.org/privkey.pem;   ssl_trusted_certificate /etc/letsencrypt/live/vault48.org/chain.pem;    server_name next.vault48.org;    location / {    proxy_redirect off;    proxy_set_header Host $host;    proxy_set_header X-Real-IP $remote_addr;    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;        proxy_pass http://127.0.0.1:8080;  }}
btw, have a nice day
(2018 - 2024) muerwre
+

Setting Up NGINX

Fallback url for SPA-s

server {  # ...  location / {    # First attempt to serve request as file, then    # as directory, then fall back to displaying a 404.      }  # ...}

Set up for uploads

server {  # ...  client_max_body_size 200M;  # ...}

Reverse proxy for https

Given config forwards https traffic to http on port 8080 for https://next.vault48.org +with http2 support if possible.

server {  listen 80;  server_name next.vault48.org;  return 301 https://next.vault48.org$request_uri;}server {  listen 443 ssl http2;  listen [::]:443 ssl http2;    # managed by Certbot  ssl_certificate /etc/letsencrypt/live/vault48.org/fullchain.pem;   ssl_certificate_key /etc/letsencrypt/live/vault48.org/privkey.pem;   ssl_trusted_certificate /etc/letsencrypt/live/vault48.org/chain.pem;    server_name next.vault48.org;    location / {    proxy_redirect off;    proxy_set_header Host $host;    proxy_set_header X-Real-IP $remote_addr;    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;        proxy_pass http://127.0.0.1:8080;  }}
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/linux/ssh/_payload.js b/docs/linux/ssh/_payload.js index 6f36872..36a8198 100644 --- a/docs/linux/ssh/_payload.js +++ b/docs/linux/ssh/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:k,_path:l}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-501XFnutIe":{_path:l,_dir:"linux",_draft:f,_partial:f,_locale:"en",_empty:f,title:k,description:c,excerpt:{type:m,children:[{type:a,tag:n,props:{id:g},children:[{type:b,value:h}]},{type:a,tag:o,props:{},children:[{type:b,value:p},{type:a,tag:d,props:{},children:[{type:b,value:q}]},{type:b,value:r},{type:a,tag:d,props:{},children:[{type:b,value:s}]},{type:b,value:t}]},{type:a,tag:e,props:{code:i},children:[{type:a,tag:u,props:{},children:[{type:a,tag:e,props:{__ignoreMap:c},children:[{type:b,value:i}]}]}]}]},body:{type:m,children:[{type:a,tag:n,props:{id:g},children:[{type:b,value:h}]},{type:a,tag:o,props:{},children:[{type:b,value:p},{type:a,tag:d,props:{},children:[{type:b,value:q}]},{type:b,value:r},{type:a,tag:d,props:{},children:[{type:b,value:s}]},{type:b,value:t}]},{type:a,tag:e,props:{code:i},children:[{type:a,tag:u,props:{},children:[{type:a,tag:e,props:{__ignoreMap:c},children:[{type:a,tag:v,props:{class:"line"},children:[{type:a,tag:v,props:{},children:[{type:b,value:"Host router\n HostName 192.168.0.1\n IdentityFile ~\u002F.ssh\u002Fid_rsa\n User root\n Port 22522"}]}]}]}]}]}],toc:{title:c,searchDepth:j,depth:j,links:[{id:g,depth:j,text:h}]}},_type:"markdown",_id:"content:Linux:SSH.md",_source:"content",_file:"Linux\u002FSSH.md",_extension:"md"}},prerenderedAt:1711020227961}}("element","text","","code-inline","code",false,"config-aliases-for-ssh-hosts","Config aliases for #SSH hosts","Host router\n HostName 192.168.0.1\n IdentityFile ~\u002F.ssh\u002Fid_rsa\n User root\n Port 22522\n",2,"SSH","\u002Flinux\u002Fssh","root","h2","p","#SSH config can be used to made aliases for different hosts. Should be put at ","~\u002F.ssh\u002Fconfig",". To simply call ","ssh router"," without parameters, use this:","pre","span")) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:k,_path:l}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-501XFnutIe":{_path:l,_dir:"linux",_draft:f,_partial:f,_locale:"en",_empty:f,title:k,description:c,excerpt:{type:m,children:[{type:a,tag:n,props:{id:g},children:[{type:b,value:h}]},{type:a,tag:o,props:{},children:[{type:b,value:p},{type:a,tag:d,props:{},children:[{type:b,value:q}]},{type:b,value:r},{type:a,tag:d,props:{},children:[{type:b,value:s}]},{type:b,value:t}]},{type:a,tag:e,props:{code:i},children:[{type:a,tag:u,props:{},children:[{type:a,tag:e,props:{__ignoreMap:c},children:[{type:b,value:i}]}]}]}]},body:{type:m,children:[{type:a,tag:n,props:{id:g},children:[{type:b,value:h}]},{type:a,tag:o,props:{},children:[{type:b,value:p},{type:a,tag:d,props:{},children:[{type:b,value:q}]},{type:b,value:r},{type:a,tag:d,props:{},children:[{type:b,value:s}]},{type:b,value:t}]},{type:a,tag:e,props:{code:i},children:[{type:a,tag:u,props:{},children:[{type:a,tag:e,props:{__ignoreMap:c},children:[{type:a,tag:v,props:{class:"line"},children:[{type:a,tag:v,props:{},children:[{type:b,value:"Host router\n HostName 192.168.0.1\n IdentityFile ~\u002F.ssh\u002Fid_rsa\n User root\n Port 22522"}]}]}]}]}]}],toc:{title:c,searchDepth:j,depth:j,links:[{id:g,depth:j,text:h}]}},_type:"markdown",_id:"content:Linux:SSH.md",_source:"content",_file:"Linux\u002FSSH.md",_extension:"md"}},prerenderedAt:1711020862473}}("element","text","","code-inline","code",false,"config-aliases-for-ssh-hosts","Config aliases for #SSH hosts","Host router\n HostName 192.168.0.1\n IdentityFile ~\u002F.ssh\u002Fid_rsa\n User root\n Port 22522\n",2,"SSH","\u002Flinux\u002Fssh","root","h2","p","#SSH config can be used to made aliases for different hosts. Should be put at ","~\u002F.ssh\u002Fconfig",". To simply call ","ssh router"," without parameters, use this:","pre","span")) \ No newline at end of file diff --git a/docs/linux/ssh/index.html b/docs/linux/ssh/index.html index ff65c70..3cd1363 100644 --- a/docs/linux/ssh/index.html +++ b/docs/linux/ssh/index.html @@ -1,10 +1,10 @@ -SSH • Obsidian Garden

SSH

Config aliases for #SSH hosts

#SSH config can be used to made aliases for different hosts. Should be put at ~/.ssh/config. To simply call ssh router without parameters, use this:

Host router
     HostName 192.168.0.1
     IdentityFile ~/.ssh/id_rsa
     User root
-    Port 22522
btw, have a nice day
(2018 - 2024) muerwre
+ Port 22522
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/nuxt/ArrowRight.14964609.js b/docs/nuxt/ArrowRight.14964609.js new file mode 100644 index 0000000..6e544c8 --- /dev/null +++ b/docs/nuxt/ArrowRight.14964609.js @@ -0,0 +1 @@ +import{k as e,o as t,e as o,f as s}from"./entry.a1162545.js";const n={},_={xmlns:"http://www.w3.org/2000/svg",height:"48",width:"48",viewBox:"0 0 48 48"},c=s("path",{d:"m24 40-2.1-2.15L34.25 25.5H8v-3h26.25L21.9 10.15 24 8l16 16Z"},null,-1),r=[c];function a(h,d){return t(),o("svg",_,r)}const l=e(n,[["render",a]]);export{l as default}; diff --git a/docs/nuxt/BioCareer.56fc554f.js b/docs/nuxt/BioCareer.56fc554f.js new file mode 100644 index 0000000..1636311 --- /dev/null +++ b/docs/nuxt/BioCareer.56fc554f.js @@ -0,0 +1 @@ +import{k as e,o,e as r,f as t}from"./entry.a1162545.js";const c={},s=t("h2",null,"Career",-1),n=[s];function a(_,l){return o(),r("div",null,n)}const f=e(c,[["render",a]]);export{f as default}; diff --git a/docs/nuxt/BioHeading.1e2de442.js b/docs/nuxt/BioHeading.1e2de442.js new file mode 100644 index 0000000..27ffe8e --- /dev/null +++ b/docs/nuxt/BioHeading.1e2de442.js @@ -0,0 +1 @@ +import l from"./IconsSend.9f60ece7.js";import m from"./UiActionButton.dd6e6d76.js";import d from"./IconsGithub.c47cbd38.js";import p from"./UiButtonGroup.03df9d51.js";import{s as u}from"./BioSkills.vue_used_vue_type_style_index_0_lang.module.516c18c9.js";import{k as f,o as h,e as b,f as n,h as s,i as t,w as o,T as r,V as y}from"./entry.a1162545.js";const g=""+new URL("howdy.90a75ece.svg",import.meta.url).href,v={},w=n("img",{src:g},null,-1),x=[w],k=y("

Howdy!

My name is Fedor Katurov, I'm a fullstack developer from Siberia.

I develop frontend applications with React, Vue and numerous other frameworks as a job and a hobby. I'm also capable of doing Typescript and Golang backends, services, and integrations.

",3);function V(e,B){const c=l,a=m,i=d,_=p;return h(),b("div",{class:s(e.$style.grid)},[n("div",{class:s(e.$style.image)},x,2),n("div",{class:s(e.$style.text)},[k,t(_,{class:s(e.$style.buttons)},{default:o(()=>[t(a,{href:"/contacts",variant:"primary"},{suffix:o(()=>[t(c,{width:"22",height:"22",fill:"currentColor"})]),default:o(()=>[r(" Contact\xA0me ")]),_:1}),t(a,{href:"https://github.com/muerwre",target:"_blank",variant:"outline"},{suffix:o(()=>[t(i,{width:"22",height:"22",fill:"currentColor"})]),default:o(()=>[r(" Visit\xA0my\xA0Github ")]),_:1})]),_:1},8,["class"])],2)],2)}const $={$style:u},T=f(v,[["render",V],["__cssModules",$]]);export{T as default}; diff --git a/docs/nuxt/BioProjectCard.92964127.js b/docs/nuxt/BioProjectCard.92964127.js new file mode 100644 index 0000000..4e7e11f --- /dev/null +++ b/docs/nuxt/BioProjectCard.92964127.js @@ -0,0 +1 @@ +import{a as _,o as f,c as h,w as s,f as e,h as o,t as a,i as l,T as i,b as p,k as y}from"./entry.a1162545.js";import $ from"./IconsCode.f19221b0.js";import g from"./UiActionButton.dd6e6d76.js";import v from"./ArrowRight.14964609.js";import C from"./UiCard.30356a36.js";import{e as k}from"./BioSkills.vue_used_vue_type_style_index_0_lang.module.516c18c9.js";import"./UiCard.vue_used_vue_type_style_index_0_lang.module.a0027dfd.js";const b=["src","alt"],w=_({__name:"BioProjectCard",props:{name:null,description:null,url:null,source:null,image:null},setup(n){return(t,B)=>{const c=p,u=$,r=g,m=v,d=C;return f(),h(d,null,{default:s(()=>[e("div",{class:o(t.$style.card)},[e("div",{class:o(t.$style.thumbnail)},[e("img",{src:n.image,class:o(t.$style.image),alt:n.name},null,10,b)],2),e("div",{class:o(t.$style.content)},[e("div",{class:o(t.$style.head)},[e("h3",{class:o(t.$style.title)},a(n.name),3),e("div",{class:o(t.$style.url)},[l(c,{to:n.url},{default:s(()=>[i(a(n.url),1)]),_:1},8,["to"])],2)],2),e("div",{class:o(t.$style.description)},a(n.description),3)],2),e("div",{class:o(t.$style.buttons)},[l(r,{href:n.source,variant:"outline",_target:"blank"},{suffix:s(()=>[l(u,{width:"22",height:"22",fill:"currentColor"})]),default:s(()=>[i(" Code ")]),_:1},8,["href"]),l(r,{href:n.url,variant:"outline",_target:"blank"},{suffix:s(()=>[l(m,{width:"22",height:"22",fill:"currentColor"})]),default:s(()=>[i(" Visit ")]),_:1},8,["href"])],2)],2)]),_:1})}}}),x={$style:k},j=y(w,[["__cssModules",x]]);export{j as default}; diff --git a/docs/nuxt/BioProjects.59ee94c3.js b/docs/nuxt/BioProjects.59ee94c3.js new file mode 100644 index 0000000..66ebb4c --- /dev/null +++ b/docs/nuxt/BioProjects.59ee94c3.js @@ -0,0 +1 @@ +import c from"./BioProjectCard.92964127.js";import{p as i,c as m}from"./BioSkills.vue_used_vue_type_style_index_0_lang.module.516c18c9.js";import{a as l,o as s,e as t,f as n,R as _,S as p,c as u,u as d,h as r,k as f}from"./entry.a1162545.js";import"./IconsCode.f19221b0.js";import"./UiActionButton.dd6e6d76.js";import"./ArrowRight.14964609.js";import"./UiCard.30356a36.js";import"./UiCard.vue_used_vue_type_style_index_0_lang.module.a0027dfd.js";const g=n("h2",null,"Pet Projects",-1),B=l({__name:"BioProjects",setup(y){return(o,h)=>{const a=c;return s(),t("div",{class:r(o.$style.projects)},[g,n("div",{class:r(o.$style.grid)},[(s(!0),t(_,null,p(d(i),e=>(s(),u(a,{key:e.name,name:e.name,description:e.description,url:e.pageUrl,source:e.codeUrl,image:e.image},null,8,["name","description","url","source","image"]))),128))],2)],2)}}}),k={$style:m},E=f(B,[["__cssModules",k]]);export{E as default}; diff --git a/docs/nuxt/BioSkills.8a45295a.js b/docs/nuxt/BioSkills.8a45295a.js new file mode 100644 index 0000000..c30f996 --- /dev/null +++ b/docs/nuxt/BioSkills.8a45295a.js @@ -0,0 +1 @@ +import l from"./BioSkillsCard.9eb3a7e8.js";import{a,b as c}from"./BioSkills.vue_used_vue_type_style_index_0_lang.module.516c18c9.js";import{a as _,o as t,e as n,f as s,R as m,S as p,c as u,w as d,u as f,h,k as B}from"./entry.a1162545.js";import"./UiStars.f80344a8.js";import"./IconStar.856ef9b4.js";import"./UiCard.30356a36.js";import"./UiCard.vue_used_vue_type_style_index_0_lang.module.a0027dfd.js";const k=s("h2",null,"Skills",-1),v=["src"],x=_({__name:"BioSkills",setup(C){return(r,S)=>{const i=l;return t(),n("div",null,[k,s("div",{class:h(r.$style.list)},[(t(!0),n(m,null,p(f(a),e=>{var o;return t(),u(i,{title:e.title,level:e.level,description:(o=e.description)!=null?o:"",key:e.title},{default:d(()=>[s("img",{src:e.icon,width:"48",height:"48"},null,8,v)]),_:2},1032,["title","level","description"])}),128))],2)])}}}),y={$style:c},F=B(x,[["__cssModules",y]]);export{F as default}; diff --git a/docs/nuxt/BioSkillsCard.9eb3a7e8.js b/docs/nuxt/BioSkillsCard.9eb3a7e8.js new file mode 100644 index 0000000..3e21549 --- /dev/null +++ b/docs/nuxt/BioSkillsCard.9eb3a7e8.js @@ -0,0 +1 @@ +import i from"./UiStars.f80344a8.js";import r from"./UiCard.30356a36.js";import{a as c,o as d,c as m,w as p,f as s,h as e,r as u,t as l,i as _,k as f}from"./entry.a1162545.js";import{d as y}from"./BioSkills.vue_used_vue_type_style_index_0_lang.module.516c18c9.js";import"./IconStar.856ef9b4.js";import"./UiCard.vue_used_vue_type_style_index_0_lang.module.a0027dfd.js";const $=c({__name:"BioSkillsCard",props:{title:null,description:null,level:null},setup(o){return(t,C)=>{const n=i,a=r;return d(),m(a,null,{default:p(()=>[s("div",{class:e(t.$style.grid)},[s("div",{class:e(t.$style.icon)},[u(t.$slots,"default")],2),s("div",{class:e(t.$style.text)},[s("h3",{class:e(t.$style.title)},l(o.title),3),_(n,{count:o.level},null,8,["count"])],2)],2),s("div",{class:e(t.$style.description)},l(o.description),3)]),_:3})}}}),v={$style:y},x=f($,[["__cssModules",v]]);export{x as default}; diff --git a/docs/nuxt/ContactInformation.23c7ad7c.js b/docs/nuxt/ContactInformation.23c7ad7c.js new file mode 100644 index 0000000..d4f9f96 --- /dev/null +++ b/docs/nuxt/ContactInformation.23c7ad7c.js @@ -0,0 +1 @@ +import m from"./IconsTelegram.783c99b0.js";import u from"./ContactRow.c1c5e4b6.js";import h from"./IconsGithub.c47cbd38.js";import p from"./IconsLinkedin.125a3758.js";import f from"./IconsSend.9f60ece7.js";import{a as d,q as v,J as b,o as g,e as w,i as t,w as o,u as _,h as k,k as x}from"./entry.a1162545.js";import{s as C}from"./ContactInformation.vue_used_vue_type_style_index_0_lang.module.80c3b839.js";const n={telegram:"vv4000",email:"Z290aGFtNDhAZ21haWwuY29t",github:"muerwre",linkedin:"https://www.linkedin.com/in/fedor-katurov-811aa721b/",location:"Pavlodar, Rep. Kazakhstan"},I=d({__name:"ContactInformation",setup(M){const a=v("...loading");return b(()=>a.value=atob(n.email)),(l,z)=>{const s=m,e=u,r=h,i=p,c=f;return g(),w("div",{class:k(l.$style.grid)},[t(e,{value:"@vv4000",href:"https://t.me/vv4000",label:"Telegram"},{default:o(()=>[t(s,{width:24,height:24})]),_:1}),t(e,{value:`@${_(n).github}`,href:`https://github.com/${_(n).github}`,label:"Github"},{default:o(()=>[t(r,{width:24,height:24})]),_:1},8,["value","href"]),t(e,{value:"Fedor Katurov",href:_(n).linkedin,label:"LinkedIn"},{default:o(()=>[t(i,{width:24,height:24})]),_:1},8,["href"]),t(e,{value:a.value,href:`mailto:${a.value}`,label:"Mail"},{default:o(()=>[t(c,{width:24,height:24})]),_:1},8,["value","href"])],2)}}}),$={$style:C},y=x(I,[["__cssModules",$]]),L=Object.freeze(Object.defineProperty({__proto__:null,default:y},Symbol.toStringTag,{value:"Module"}));export{L as C,y as _,n as c}; diff --git a/docs/nuxt/ContactRow.c1c5e4b6.js b/docs/nuxt/ContactRow.c1c5e4b6.js new file mode 100644 index 0000000..e61a9b2 --- /dev/null +++ b/docs/nuxt/ContactRow.c1c5e4b6.js @@ -0,0 +1 @@ +import{a as d,o as u,c as m,w as a,f as o,h as e,r as _,t as l,i as p,T as f,b as y,k as $}from"./entry.a1162545.js";import k from"./UiCard.30356a36.js";import{a as w}from"./ContactInformation.vue_used_vue_type_style_index_0_lang.module.80c3b839.js";import"./UiCard.vue_used_vue_type_style_index_0_lang.module.a0027dfd.js";const h=d({__name:"ContactRow",props:{value:null,href:null,label:null},setup(t){const n=t,c=()=>window.open(n.href);return(s,C)=>{const r=y,i=k;return u(),m(i,{class:e(s.$style.row),onClick:c},{default:a(()=>[o("div",{class:e(s.$style.grid)},[o("div",{class:e(s.$style.icon)},[_(s.$slots,"default")],2),o("div",{class:e(s.$style.text)},[o("div",{class:e(s.$style.label)},l(t.label),3),p(r,{to:t.href,target:"_blank",class:e(s.$style.link)},{default:a(()=>[f(l(t.value),1)]),_:1},8,["to","class"])],2)],2)]),_:3},8,["class"])}}}),v={$style:w},B=$(h,[["__cssModules",v]]);export{B as default}; diff --git a/docs/nuxt/ContentList.aa5fabfc.js b/docs/nuxt/ContentList.aa5fabfc.js new file mode 100644 index 0000000..80fc5ca --- /dev/null +++ b/docs/nuxt/ContentList.aa5fabfc.js @@ -0,0 +1 @@ +import{a as i,l as m,m as f,p as c}from"./entry.a1162545.js";const l=i({name:"ContentList",props:{path:{type:String,required:!1,default:void 0},query:{type:Object,required:!1,default:void 0}},render(o){const e=m(),{path:p,query:a}=o,r={...a||{},path:p||(a==null?void 0:a.path)||"/"},u=(t,n)=>f("pre",null,JSON.stringify({message:"You should use slots with ",slot:t,data:n},null,2));return f(c,r,{default:e!=null&&e.default?({data:t,refresh:n,isPartial:d})=>e==null?void 0:e.default({list:t,refresh:n,isPartial:d,...this.$attrs}):({data:t})=>u("default",t),empty:t=>e!=null&&e.empty?e.empty(t):({data:n})=>u("default",n),"not-found":t=>{var n;return e!=null&&e["not-found"]?(n=e==null?void 0:e["not-found"])==null?void 0:n.call(e,t):({data:d})=>u("not-found",d)}})}});export{l as default}; diff --git a/docs/nuxt/ContentNavigation.3663b4c1.js b/docs/nuxt/ContentNavigation.3663b4c1.js new file mode 100644 index 0000000..454d802 --- /dev/null +++ b/docs/nuxt/ContentNavigation.3663b4c1.js @@ -0,0 +1 @@ +import{a as l,q as f,s as g,v as L,e as S,x as I,m as h,y as P,z as D,d as e,_ as r,A as R,B as V,C as y,D as c,E as b,l as B,b as x}from"./entry.a1162545.js";import{f as N}from"./navigation.c88a11e6.js";import"./ProseCode.vue_used_vue_type_style_index_1_lang.module.230a312a.js";import"./BioSkills.vue_used_vue_type_style_index_0_lang.module.516c18c9.js";import"./UiCard.vue_used_vue_type_style_index_0_lang.module.a0027dfd.js";import"./ContactInformation.vue_used_vue_type_style_index_0_lang.module.80c3b839.js";import"./LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.module.5f1b7ee4.js";import"./LayoutHeader.vue_used_vue_type_style_index_0_lang.module.57d4f89f.js";import"./LayoutMainMenuToggle.vue_used_vue_type_style_index_0_lang.module.fbcd3219.js";import"./ContentList.aa5fabfc.js";import"./ContentSlot.017eac9c.js";import"./DocumentDrivenEmpty.901ae14d.js";import"./DocumentDrivenNotFound.ac941741.js";import"./Markdown.ca979d4c.js";const j=l({emits:{error(t){return!0}},setup(t,{slots:i,emit:o}){const n=f(null),_=g();return L(a=>{if(!_.isHydrating)return o("error",a),n.value=a,!1}),()=>{var a,u;return n.value?(a=i.error)==null?void 0:a.call(i,{error:n}):(u=i.default)==null?void 0:u.call(i)}}}),C=Object.freeze(Object.defineProperty({__proto__:null,default:j},Symbol.toStringTag,{value:"Module"})),k=l({name:"ServerPlaceholder",render(){return S("div")}}),q=Object.freeze(Object.defineProperty({__proto__:null,default:k},Symbol.toStringTag,{value:"Module"})),z=l({name:"NuxtLoadingIndicator",props:{throttle:{type:Number,default:200},duration:{type:Number,default:2e3},height:{type:Number,default:3},color:{type:String,default:"repeating-linear-gradient(to right,#00dc82 0%,#34cdfe 50%,#0047e1 100%)"}},setup(t,{slots:i}){const o=M({duration:t.duration,throttle:t.throttle}),n=g();return n.hook("page:start",o.start),n.hook("page:finish",o.finish),I(()=>o.clear),()=>h("div",{class:"nuxt-loading-indicator",style:{position:"fixed",top:0,right:0,left:0,pointerEvents:"none",width:`${o.progress.value}%`,height:`${t.height}px`,opacity:o.isLoading.value?1:0,background:t.color,backgroundSize:`${100/o.progress.value*100}% auto`,transition:"width 0.1s, height 0.4s, opacity 0.4s",zIndex:999999}},i)}});function M(t){const i=f(0),o=f(!1),n=P(()=>1e4/t.duration);let _=null,a=null;function u(){p(),i.value=0,o.value=!0,t.throttle?a=setTimeout(v,t.throttle):v()}function E(){i.value=100,O()}function p(){clearInterval(_),clearTimeout(a),_=null,a=null}function A(T){i.value=Math.min(100,i.value+T)}function O(){p(),setTimeout(()=>{o.value=!1,setTimeout(()=>{i.value=0},400)},500)}function v(){_=setInterval(()=>{A(n.value)},100)}return{progress:i,isLoading:o,start:u,finish:E,clear:p}}const H=Object.freeze(Object.defineProperty({__proto__:null,default:z},Symbol.toStringTag,{value:"Module"})),$=t=>Object.fromEntries(Object.entries(t).filter(([,i])=>i!==void 0)),d=(t,i)=>(o,n)=>(D(()=>t({...$(o),...n.attrs},n)),()=>{var _,a;return i?(a=(_=n.slots).default)==null?void 0:a.call(_):null}),s={accesskey:String,autocapitalize:String,autofocus:{type:Boolean,default:void 0},class:String,contenteditable:{type:Boolean,default:void 0},contextmenu:String,dir:String,draggable:{type:Boolean,default:void 0},enterkeyhint:String,exportparts:String,hidden:{type:Boolean,default:void 0},id:String,inputmode:String,is:String,itemid:String,itemprop:String,itemref:String,itemscope:String,itemtype:String,lang:String,nonce:String,part:String,slot:String,spellcheck:{type:Boolean,default:void 0},style:String,tabindex:String,title:String,translate:String},w=l({name:"Script",inheritAttrs:!1,props:{...s,async:Boolean,crossorigin:{type:[Boolean,String],default:void 0},defer:Boolean,fetchpriority:String,integrity:String,nomodule:Boolean,nonce:String,referrerpolicy:String,src:String,type:String,charset:String,language:String,body:Boolean,renderPriority:[String,Number]},setup:d((t,{slots:i})=>{var _;const o={...t},n=(((_=i.default)==null?void 0:_.call(i))||[]).filter(({children:a})=>a).map(({children:a})=>a).join("");return n&&(o.children=n),{script:[o]}})}),U=l({name:"NoScript",inheritAttrs:!1,props:{...s,title:String,body:Boolean,renderPriority:[String,Number]},setup:d((t,{slots:i})=>{var _;const o={...t},n=(((_=i.default)==null?void 0:_.call(i))||[]).filter(({children:a})=>a).map(({children:a})=>a).join("");return n&&(o.children=n),{noscript:[o]}})}),F=l({name:"Link",inheritAttrs:!1,props:{...s,as:String,crossorigin:String,disabled:Boolean,fetchpriority:String,href:String,hreflang:String,imagesizes:String,imagesrcset:String,integrity:String,media:String,prefetch:{type:Boolean,default:void 0},referrerpolicy:String,rel:String,sizes:String,title:String,type:String,methods:String,target:String,body:Boolean,renderPriority:[String,Number]},setup:d(t=>({link:[t]}))}),G=l({name:"Base",inheritAttrs:!1,props:{...s,href:String,target:String},setup:d(t=>({base:t}))}),J=l({name:"Title",inheritAttrs:!1,setup:d((t,{slots:i})=>{var n,_,a;return{title:((a=(_=(n=i.default)==null?void 0:n.call(i))==null?void 0:_[0])==null?void 0:a.children)||null}})}),K=l({name:"Meta",inheritAttrs:!1,props:{...s,charset:String,content:String,httpEquiv:String,name:String,body:Boolean,renderPriority:[String,Number]},setup:d(t=>{const i={...t};return i.httpEquiv&&(i["http-equiv"]=i.httpEquiv,delete i.httpEquiv),{meta:[i]}})}),Q=l({name:"Style",inheritAttrs:!1,props:{...s,type:String,media:String,nonce:String,title:String,scoped:{type:Boolean,default:void 0},body:Boolean,renderPriority:[String,Number]},setup:d((t,{slots:i})=>{var _,a,u;const o={...t},n=(u=(a=(_=i.default)==null?void 0:_.call(i))==null?void 0:a[0])==null?void 0:u.children;return n&&(o.children=n),{style:[o]}})}),W=l({name:"Head",inheritAttrs:!1,setup:(t,i)=>()=>{var o,n;return(n=(o=i.slots).default)==null?void 0:n.call(o)}}),X=l({name:"Html",inheritAttrs:!1,props:{...s,manifest:String,version:String,xmlns:String,renderPriority:[String,Number]},setup:d(t=>({htmlAttrs:t}),!0)}),Y=l({name:"Body",inheritAttrs:!1,props:{...s,renderPriority:[String,Number]},setup:d(t=>({bodyAttrs:t}),!0)}),m=Object.freeze(Object.defineProperty({__proto__:null,Script:w,NoScript:U,Link:F,Base:G,Title:J,Meta:K,Style:Q,Head:W,Html:X,Body:Y},Symbol.toStringTag,{value:"Module"}));e(()=>r(()=>import("./ProseA.125f5d24.js"),["ProseA.125f5d24.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseCode.6beb51eb.js"),["ProseCode.6beb51eb.js","UiIconCopy.bfce4552.js","entry.a1162545.js","entry.10eae4ea.css","ProseCode.vue_used_vue_type_style_index_1_lang.module.230a312a.js","ProseCode.vue_used_vue_type_style_index_1_lang.24930a5d.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./BioCareer.56fc554f.js"),["BioCareer.56fc554f.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./BioHeading.1e2de442.js"),["BioHeading.1e2de442.js","IconsSend.9f60ece7.js","entry.a1162545.js","entry.10eae4ea.css","UiActionButton.dd6e6d76.js","IconsGithub.c47cbd38.js","UiButtonGroup.03df9d51.js","BioSkills.vue_used_vue_type_style_index_0_lang.module.516c18c9.js","BioSkills.vue_used_vue_type_style_index_0_lang.4d0cadf8.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./BioProjectCard.92964127.js"),["BioProjectCard.92964127.js","entry.a1162545.js","entry.10eae4ea.css","IconsCode.f19221b0.js","UiActionButton.dd6e6d76.js","ArrowRight.14964609.js","UiCard.30356a36.js","UiCard.vue_used_vue_type_style_index_0_lang.module.a0027dfd.js","UiCard.vue_used_vue_type_style_index_0_lang.7760099e.css","BioSkills.vue_used_vue_type_style_index_0_lang.module.516c18c9.js","BioSkills.vue_used_vue_type_style_index_0_lang.4d0cadf8.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./BioProjects.59ee94c3.js"),["BioProjects.59ee94c3.js","BioProjectCard.92964127.js","entry.a1162545.js","entry.10eae4ea.css","IconsCode.f19221b0.js","UiActionButton.dd6e6d76.js","ArrowRight.14964609.js","UiCard.30356a36.js","UiCard.vue_used_vue_type_style_index_0_lang.module.a0027dfd.js","UiCard.vue_used_vue_type_style_index_0_lang.7760099e.css","BioSkills.vue_used_vue_type_style_index_0_lang.module.516c18c9.js","BioSkills.vue_used_vue_type_style_index_0_lang.4d0cadf8.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./BioSkills.8a45295a.js"),["BioSkills.8a45295a.js","BioSkillsCard.9eb3a7e8.js","UiStars.f80344a8.js","IconStar.856ef9b4.js","entry.a1162545.js","entry.10eae4ea.css","BioSkills.vue_used_vue_type_style_index_0_lang.module.516c18c9.js","BioSkills.vue_used_vue_type_style_index_0_lang.4d0cadf8.css","UiCard.30356a36.js","UiCard.vue_used_vue_type_style_index_0_lang.module.a0027dfd.js","UiCard.vue_used_vue_type_style_index_0_lang.7760099e.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./BioSkillsCard.9eb3a7e8.js"),["BioSkillsCard.9eb3a7e8.js","UiStars.f80344a8.js","IconStar.856ef9b4.js","entry.a1162545.js","entry.10eae4ea.css","BioSkills.vue_used_vue_type_style_index_0_lang.module.516c18c9.js","BioSkills.vue_used_vue_type_style_index_0_lang.4d0cadf8.css","UiCard.30356a36.js","UiCard.vue_used_vue_type_style_index_0_lang.module.a0027dfd.js","UiCard.vue_used_vue_type_style_index_0_lang.7760099e.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ContactInformation.23c7ad7c.js").then(t=>t.C),["ContactInformation.23c7ad7c.js","IconsTelegram.783c99b0.js","entry.a1162545.js","entry.10eae4ea.css","ContactRow.c1c5e4b6.js","UiCard.30356a36.js","UiCard.vue_used_vue_type_style_index_0_lang.module.a0027dfd.js","UiCard.vue_used_vue_type_style_index_0_lang.7760099e.css","ContactInformation.vue_used_vue_type_style_index_0_lang.module.80c3b839.js","ContactInformation.vue_used_vue_type_style_index_0_lang.826cd7fe.css","IconsGithub.c47cbd38.js","IconsLinkedin.125a3758.js","IconsSend.9f60ece7.js"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ContactRow.c1c5e4b6.js"),["ContactRow.c1c5e4b6.js","entry.a1162545.js","entry.10eae4ea.css","UiCard.30356a36.js","UiCard.vue_used_vue_type_style_index_0_lang.module.a0027dfd.js","UiCard.vue_used_vue_type_style_index_0_lang.7760099e.css","ContactInformation.vue_used_vue_type_style_index_0_lang.module.80c3b839.js","ContactInformation.vue_used_vue_type_style_index_0_lang.826cd7fe.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./HomeContentList.46e326e2.js"),["HomeContentList.46e326e2.js","entry.a1162545.js","entry.10eae4ea.css","navigation.c88a11e6.js"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./HomeHeader.27ad4cc1.js"),["HomeHeader.27ad4cc1.js","entry.a1162545.js","entry.10eae4ea.css","IconsSend.9f60ece7.js","UiActionButton.dd6e6d76.js","IconsBook.a1725b46.js","UiButtonGroup.03df9d51.js"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./HomeReference.bf6fb900.js"),["HomeReference.bf6fb900.js","entry.a1162545.js","entry.10eae4ea.css","navigation.c88a11e6.js"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ArrowRight.14964609.js"),["ArrowRight.14964609.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./IconStar.856ef9b4.js"),["IconStar.856ef9b4.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./IconsBook.a1725b46.js"),["IconsBook.a1725b46.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./IconsCode.f19221b0.js"),["IconsCode.f19221b0.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./IconsGithub.c47cbd38.js"),["IconsGithub.c47cbd38.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./IconsLinkedin.125a3758.js"),["IconsLinkedin.125a3758.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./IconsSend.9f60ece7.js"),["IconsSend.9f60ece7.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./IconsTelegram.783c99b0.js"),["IconsTelegram.783c99b0.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.module.5f1b7ee4.js").then(t=>t.M),["LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.module.5f1b7ee4.js","LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.cfa40af4.css","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.module.5f1b7ee4.js").then(t=>t.S),["LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.module.5f1b7ee4.js","LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.cfa40af4.css","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./LayoutFooter.92ed5906.js"),["LayoutFooter.92ed5906.js","entry.a1162545.js","entry.10eae4ea.css","LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.module.5f1b7ee4.js","LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.cfa40af4.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./LayoutHeader.85946555.js"),["LayoutHeader.85946555.js","entry.a1162545.js","entry.10eae4ea.css","LayoutHeader.vue_used_vue_type_style_index_0_lang.module.57d4f89f.js","LayoutHeader.vue_used_vue_type_style_index_0_lang.b2295632.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./LayoutMainMenu.8e9bb43b.js"),["LayoutMainMenu.8e9bb43b.js","entry.a1162545.js","entry.10eae4ea.css","navigation.c88a11e6.js","LayoutMainMenuToggle.vue_used_vue_type_style_index_0_lang.module.fbcd3219.js","LayoutMainMenuToggle.vue_used_vue_type_style_index_0_lang.17e7aae7.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./entry.a1162545.js").then(t=>t.ap),["entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./LayoutMainMenuToggle.62cc3970.js"),["LayoutMainMenuToggle.62cc3970.js","entry.a1162545.js","entry.10eae4ea.css","LayoutMainMenuToggle.vue_used_vue_type_style_index_0_lang.module.fbcd3219.js","LayoutMainMenuToggle.vue_used_vue_type_style_index_0_lang.17e7aae7.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./LayoutThemeToggle.0b8ad036.js"),["LayoutThemeToggle.0b8ad036.js","LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.module.5f1b7ee4.js","LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.cfa40af4.css","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./UiActionButton.dd6e6d76.js"),["UiActionButton.dd6e6d76.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./UiButtonGroup.03df9d51.js"),["UiButtonGroup.03df9d51.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./UiCard.30356a36.js"),["UiCard.30356a36.js","UiCard.vue_used_vue_type_style_index_0_lang.module.a0027dfd.js","UiCard.vue_used_vue_type_style_index_0_lang.7760099e.css","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./UiIconCopy.bfce4552.js"),["UiIconCopy.bfce4552.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./UiStars.f80344a8.js"),["UiStars.f80344a8.js","IconStar.856ef9b4.js","entry.a1162545.js","entry.10eae4ea.css","BioSkills.vue_used_vue_type_style_index_0_lang.module.516c18c9.js","BioSkills.vue_used_vue_type_style_index_0_lang.4d0cadf8.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./entry.a1162545.js").then(t=>t.ao),["entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ContentList.aa5fabfc.js"),["ContentList.aa5fabfc.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>Promise.resolve().then(()=>tt),void 0,import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./entry.a1162545.js").then(t=>t.an),["entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./entry.a1162545.js").then(t=>t.am),["entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./entry.a1162545.js").then(t=>t.al),["entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ContentSlot.017eac9c.js"),["ContentSlot.017eac9c.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./DocumentDrivenEmpty.901ae14d.js"),["DocumentDrivenEmpty.901ae14d.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./DocumentDrivenNotFound.ac941741.js"),["DocumentDrivenNotFound.ac941741.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./Markdown.ca979d4c.js"),["Markdown.ca979d4c.js","ContentSlot.017eac9c.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseBlockquote.cf38769b.js"),["ProseBlockquote.cf38769b.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseCodeInline.4d9c4a74.js"),["ProseCodeInline.4d9c4a74.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseEm.f76a6875.js"),["ProseEm.f76a6875.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseH1.84254f6d.js"),["ProseH1.84254f6d.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseH2.7bcea41b.js"),["ProseH2.7bcea41b.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseH3.a0130b89.js"),["ProseH3.a0130b89.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseH4.f11e985d.js"),["ProseH4.f11e985d.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseH5.9093445b.js"),["ProseH5.9093445b.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseH6.b0d8f665.js"),["ProseH6.b0d8f665.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseHr.96616888.js"),["ProseHr.96616888.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseImg.092ce6d9.js"),["ProseImg.092ce6d9.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseLi.03d0a4b8.js"),["ProseLi.03d0a4b8.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseOl.abb4941e.js"),["ProseOl.abb4941e.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseP.b6cc34ce.js"),["ProseP.b6cc34ce.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseStrong.157fed42.js"),["ProseStrong.157fed42.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseTable.71457587.js"),["ProseTable.71457587.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseTbody.fe1f05e0.js"),["ProseTbody.fe1f05e0.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseTd.63f8da62.js"),["ProseTd.63f8da62.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseTh.1dca9060.js"),["ProseTh.1dca9060.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseThead.c70e04b7.js"),["ProseThead.c70e04b7.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseTr.fcd995d6.js"),["ProseTr.fcd995d6.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./ProseUl.a662ccb8.js"),["ProseUl.a662ccb8.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./welcome.02c4460f.js"),["welcome.02c4460f.js","entry.a1162545.js","entry.10eae4ea.css","navigation.c88a11e6.js","ProseCode.vue_used_vue_type_style_index_1_lang.module.230a312a.js","ProseCode.vue_used_vue_type_style_index_1_lang.24930a5d.css","BioSkills.vue_used_vue_type_style_index_0_lang.module.516c18c9.js","BioSkills.vue_used_vue_type_style_index_0_lang.4d0cadf8.css","UiCard.vue_used_vue_type_style_index_0_lang.module.a0027dfd.js","UiCard.vue_used_vue_type_style_index_0_lang.7760099e.css","ContactInformation.vue_used_vue_type_style_index_0_lang.module.80c3b839.js","ContactInformation.vue_used_vue_type_style_index_0_lang.826cd7fe.css","LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.module.5f1b7ee4.js","LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.cfa40af4.css","LayoutHeader.vue_used_vue_type_style_index_0_lang.module.57d4f89f.js","LayoutHeader.vue_used_vue_type_style_index_0_lang.b2295632.css","LayoutMainMenuToggle.vue_used_vue_type_style_index_0_lang.module.fbcd3219.js","LayoutMainMenuToggle.vue_used_vue_type_style_index_0_lang.17e7aae7.css","ContentList.aa5fabfc.js","ContentSlot.017eac9c.js","DocumentDrivenEmpty.901ae14d.js","DocumentDrivenNotFound.ac941741.js","Markdown.ca979d4c.js"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./entry.a1162545.js").then(t=>t.ar),["entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>Promise.resolve().then(()=>C),void 0,import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.module.5f1b7ee4.js").then(t=>t.c),["LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.module.5f1b7ee4.js","LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.cfa40af4.css","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>Promise.resolve().then(()=>q),void 0,import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./entry.a1162545.js").then(t=>t.ak),["entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>Promise.resolve().then(()=>H),void 0,import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./component.vue3.979a266c.js"),["component.vue3.979a266c.js","LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.module.5f1b7ee4.js","LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.cfa40af4.css","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>import("./entry.a1162545.js").then(t=>t.aq),["entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(t=>t.default||t));e(()=>r(()=>Promise.resolve().then(()=>m),void 0,import.meta.url).then(t=>t.Script));e(()=>r(()=>Promise.resolve().then(()=>m),void 0,import.meta.url).then(t=>t.NoScript));e(()=>r(()=>Promise.resolve().then(()=>m),void 0,import.meta.url).then(t=>t.Link));e(()=>r(()=>Promise.resolve().then(()=>m),void 0,import.meta.url).then(t=>t.Base));e(()=>r(()=>Promise.resolve().then(()=>m),void 0,import.meta.url).then(t=>t.Title));e(()=>r(()=>Promise.resolve().then(()=>m),void 0,import.meta.url).then(t=>t.Meta));e(()=>r(()=>Promise.resolve().then(()=>m),void 0,import.meta.url).then(t=>t.Style));e(()=>r(()=>Promise.resolve().then(()=>m),void 0,import.meta.url).then(t=>t.Head));e(()=>r(()=>Promise.resolve().then(()=>m),void 0,import.meta.url).then(t=>t.Html));e(()=>r(()=>Promise.resolve().then(()=>m),void 0,import.meta.url).then(t=>t.Body));const Z=l({name:"ContentNavigation",props:{query:{type:Object,required:!1,default:void 0}},async setup(t){const{query:i}=R(t),o=P(()=>{var _;return typeof((_=i.value)==null?void 0:_.params)=="function"?i.value.params():i.value});if(!o.value&&V("dd-navigation").value){const{navigation:_}=y();return{navigation:_}}const{data:n}=await c(`content-navigation-${b(o.value)}`,()=>N(o.value));return{navigation:n}},render(t){const i=B(),{navigation:o}=t,n=u=>h(x,{to:u._path},()=>u.title),_=(u,E)=>h("ul",E?{"data-level":E}:null,u.map(p=>p.children?h("li",null,[n(p),_(p.children,E+1)]):h("li",null,n(p)))),a=u=>_(u,0);return i!=null&&i.default?i.default({navigation:o,...this.$attrs}):a(o)}}),tt=Object.freeze(Object.defineProperty({__proto__:null,default:Z},Symbol.toStringTag,{value:"Module"}));export{Z as default}; diff --git a/docs/nuxt/ContentSlot.017eac9c.js b/docs/nuxt/ContentSlot.017eac9c.js new file mode 100644 index 0000000..0b9bed9 --- /dev/null +++ b/docs/nuxt/ContentSlot.017eac9c.js @@ -0,0 +1 @@ +import{a as g,l as h,y,m as p,K as c,L as w}from"./entry.a1162545.js";const C=g({name:"ContentSlot",functional:!0,props:{use:{type:Function,default:void 0},unwrap:{type:[Boolean,String],default:!1}},setup(e){const{parent:u}=w(),{between:o,default:l}=h(),i=y(()=>typeof e.unwrap=="string"?e.unwrap.split(" "):["*"]);return{fallbackSlot:l,tags:i,between:o,parent:u}},render({use:e,unwrap:u,fallbackSlot:o,between:l,tags:i,parent:n}){var f;try{let r=e;if(typeof e=="string"&&(r=(n==null?void 0:n.slots[e])||((f=n==null?void 0:n.parent)==null?void 0:f.slots[e]),console.warn(`Please set :use="$slots.${e}" in component to enable reactivity`)),!r)return o?o():p("div");if(!u)return[r()];const{flatUnwrap:d}=c(),a=d(r(),i);return l?a.flatMap((t,s)=>s===0?[t]:[l(),t]):a.reduce((t,s)=>(typeof s.children=="string"?typeof t[t.length-1]=="string"?t[t.length-1]+=s.children:t.push(s.children):t.push(s),t),[])}catch{return p("div")}}});export{C as default}; diff --git a/docs/nuxt/DocumentDrivenEmpty.901ae14d.js b/docs/nuxt/DocumentDrivenEmpty.901ae14d.js new file mode 100644 index 0000000..fd4a13d --- /dev/null +++ b/docs/nuxt/DocumentDrivenEmpty.901ae14d.js @@ -0,0 +1 @@ +import{a as n,m as e}from"./entry.a1162545.js";const r=n({name:"DocumentDrivenEmpty",props:{value:{type:Object,required:!0}},render({value:t}){return e("div",void 0,[e("p","Document is empty"),e("p",`Add content to it by opening ${t._source}/${t._file} file.`)])}});export{r as default}; diff --git a/docs/nuxt/DocumentDrivenNotFound.ac941741.js b/docs/nuxt/DocumentDrivenNotFound.ac941741.js new file mode 100644 index 0000000..daf76d7 --- /dev/null +++ b/docs/nuxt/DocumentDrivenNotFound.ac941741.js @@ -0,0 +1 @@ +import{a as n,m as e}from"./entry.a1162545.js";const t=n({name:"DocumentDrivenNotFound",render(){return e("div","Document not found")}});export{t as default}; diff --git a/docs/nuxt/HomeContentList.46e326e2.js b/docs/nuxt/HomeContentList.46e326e2.js new file mode 100644 index 0000000..25d1604 --- /dev/null +++ b/docs/nuxt/HomeContentList.46e326e2.js @@ -0,0 +1 @@ +import{k as c,Q as _,D as i,$ as u,o as m,c as p,w as d,f as h,h as f,i as y,u as w,a0 as v,a1 as x}from"./entry.a1162545.js";import{f as C}from"./navigation.c88a11e6.js";const g={__name:"HomeContentList",async setup(M){let e,n;const{data:a}=([e,n]=_(()=>i("navigation",()=>C())),e=await e,n(),e),o=a.value.filter(t=>t.children&&Array.isArray(t.children)&&t.children.length>0);return(t,$)=>{const r=x,l=u("masonry-wall");return m(),p(l,{items:w(o),"ssr-columns":1,"column-width":300,gap:10},{default:d(({item:s})=>[h("div",{class:f(t.$style.row)},[y(r,{title:s.title,url:s.url,children:s.children},null,8,["title","url","children"])],2)]),_:1},8,["items"])}}},A={$style:v},N=c(g,[["__cssModules",A]]);export{N as default}; diff --git a/docs/nuxt/HomeHeader.27ad4cc1.js b/docs/nuxt/HomeHeader.27ad4cc1.js new file mode 100644 index 0000000..338653d --- /dev/null +++ b/docs/nuxt/HomeHeader.27ad4cc1.js @@ -0,0 +1 @@ +import{k as m,o as u,e as d,f as t,h as e,i as n,w as s,T as a,Z as f,b as p}from"./entry.a1162545.js";import h from"./IconsSend.9f60ece7.js";import b from"./UiActionButton.dd6e6d76.js";import y from"./IconsBook.a1725b46.js";import g from"./UiButtonGroup.03df9d51.js";const k=""+new URL("obsidian.8dc2a844.svg",import.meta.url).href,$=""+new URL("desk.91eb5d74.svg",import.meta.url).href,w={},v=t("img",{src:k,alt:"",width:"14",height:"14"},null,-1),x=t("b",null,"chunks of code",-1),B=t("b",null,"technical documentation",-1),C=t("p",null,"There's also my Curriculum Vitae and contact info here.",-1);function V(o,N){const c=p,l=h,i=b,r=y,_=g;return u(),d("section",null,[t("div",{class:e(o.$style.grid)},[t("div",{class:e(o.$style.text)},[t("h1",{class:e(o.$style.title)},"Welcome to\xA0my Obsidian\xA0Garden",2),t("div",{class:e(o.$style.subtitle)},[t("p",null,[v,n(c,{to:"https://obsidian.md",target:"_blank"},{default:s(()=>[a("Obsidian")]),_:1}),a(" is a note-taking app, that I use to store "),x,a(" and "),B,a(". Here's the frontend for my notebook. ")]),C],2),n(_,{class:e(o.$style.buttons)},{default:s(()=>[n(i,{href:"/contacts",variant:"primary"},{suffix:s(()=>[n(l,{width:"22",height:"22",fill:"currentColor"})]),default:s(()=>[a(" Contact\xA0me ")]),_:1}),n(i,{href:"/about",variant:"outline"},{suffix:s(()=>[n(r,{width:"22",height:"22",fill:"currentColor"})]),default:s(()=>[a(" View\xA0Portfolio ")]),_:1})]),_:1},8,["class"])],2),t("div",{class:e(o.$style.image)},[t("img",{src:$,class:e(o.$style.desk),alt:"It's me, muerwre"},null,2)],2)],2)])}const I={$style:f},O=m(w,[["render",V],["__cssModules",I]]);export{O as default}; diff --git a/docs/nuxt/HomeReference.bf6fb900.js b/docs/nuxt/HomeReference.bf6fb900.js new file mode 100644 index 0000000..2516a56 --- /dev/null +++ b/docs/nuxt/HomeReference.bf6fb900.js @@ -0,0 +1 @@ +import{a as x,Q as k,o as r,e as c,f as C,t as f,u as i,h as N,R as v,S as w,i as D,w as V,T as B,j as A,D as L,b as M,k as R,U as S}from"./entry.a1162545.js";import{f as T}from"./navigation.c88a11e6.js";const $=x({__name:"HomeReference",props:{url:null},async setup(p){let a,u;const h=p,_=(n,e)=>{var s;const t=n.find(l=>l._path.endsWith(e[0]));return!t||e.length>1&&!((s=t.children)!=null&&s.length)?null:e.length===1?t:_(t.children,e.slice(1,e.length))},{data:g}=([a,u]=k(()=>L("navigation",()=>T())),a=await a,u(),a),y=h.url.split("/").filter(n=>n),o=_(g.value,y);return(n,e)=>{var s,l,m;const t=M;return r(),c("article",null,[C("h1",null,f((s=i(o))==null?void 0:s.title),1),(m=(l=i(o))==null?void 0:l.children)!=null&&m.length?(r(),c("ul",{key:0,class:N(n.$style.list)},[(r(!0),c(v,null,w(i(o).children,d=>(r(),c("li",{key:i(o)._id},[D(t,{to:d._path},{default:V(()=>[B(f(d.title),1)]),_:2},1032,["to"])]))),128))],2)):A("",!0)])}}}),b={$style:S},E=R($,[["__cssModules",b]]);export{E as default}; diff --git a/docs/nuxt/IconStar.856ef9b4.js b/docs/nuxt/IconStar.856ef9b4.js new file mode 100644 index 0000000..73b812c --- /dev/null +++ b/docs/nuxt/IconStar.856ef9b4.js @@ -0,0 +1 @@ +import{k as e,o as t,e as o,f as s}from"./entry.a1162545.js";const n={},_={xmlns:"http://www.w3.org/2000/svg",height:"48",width:"48",viewBox:"0 0 48 48"},c=s("path",{d:"m11.65 44 3.25-14.05L4 20.5l14.4-1.25L24 6l5.6 13.25L44 20.5l-10.9 9.45L36.35 44 24 36.55Z"},null,-1),r=[c];function a(l,d){return t(),o("svg",_,r)}const i=e(n,[["render",a]]);export{i as default}; diff --git a/docs/nuxt/IconsBook.a1725b46.js b/docs/nuxt/IconsBook.a1725b46.js new file mode 100644 index 0000000..1570625 --- /dev/null +++ b/docs/nuxt/IconsBook.a1725b46.js @@ -0,0 +1 @@ +import{k as t,o as e,e as o,f as s}from"./entry.a1162545.js";const n={},_={xmlns:"http://www.w3.org/2000/svg",height:"48",width:"48",viewBox:"1 -2 50 50"},c=s("path",{xmlns:"http://www.w3.org/2000/svg",d:"M12.4 33q2.7 0 5.225.625 2.525.625 4.975 1.875V14.15q-2.25-1.5-4.875-2.325Q15.1 11 12.4 11q-1.9 0-3.725.475Q6.85 11.95 5 12.65v21.7q1.55-.7 3.525-1.025Q10.5 33 12.4 33Zm13.2 2.5q2.5-1.25 4.9-1.875Q32.9 33 35.6 33q1.9 0 3.925.3t3.475.8V12.65q-1.7-.85-3.6-1.25-1.9-.4-3.8-.4-2.7 0-5.225.825-2.525.825-4.775 2.325ZM24.1 40q-2.55-1.9-5.55-2.925T12.4 36.05q-1.85 0-3.6.45t-3.5 1.1q-1.15.55-2.225-.15Q2 36.75 2 35.45V12.3q0-.75.35-1.375T3.4 9.95q2.1-1 4.375-1.475Q10.05 8 12.4 8q3.15 0 6.125.85t5.575 2.6q2.55-1.75 5.475-2.6Q32.5 8 35.6 8q2.35 0 4.6.475 2.25.475 4.35 1.475.7.35 1.075.975T46 12.3v23.15q0 1.4-1.125 2.125-1.125.725-2.225.025-1.7-.7-3.45-1.125-1.75-.425-3.6-.425-3.15 0-6.05 1.05T24.1 40ZM13.8 23.55Z"},null,-1),q=[c];function r(a,h){return e(),o("svg",_,q)}const d=t(n,[["render",r]]);export{d as default}; diff --git a/docs/nuxt/IconsCode.f19221b0.js b/docs/nuxt/IconsCode.f19221b0.js new file mode 100644 index 0000000..8ea0148 --- /dev/null +++ b/docs/nuxt/IconsCode.f19221b0.js @@ -0,0 +1 @@ +import{k as t,o as e,e as o,f as s}from"./entry.a1162545.js";const n={},_={xmlns:"http://www.w3.org/2000/svg",height:"48",width:"48",viewBox:"0 0 48 48"},c=s("path",{xmlns:"http://www.w3.org/2000/svg",d:"m16 35.9-12-12 12.1-12.1 2.15 2.15L8.3 23.9l9.85 9.85Zm15.9.1-2.15-2.15 9.95-9.95-9.85-9.85L32 11.9l12 12Z"},null,-1),r=[c];function a(h,l){return e(),o("svg",_,r)}const d=t(n,[["render",a]]);export{d as default}; diff --git a/docs/nuxt/IconsGithub.c47cbd38.js b/docs/nuxt/IconsGithub.c47cbd38.js new file mode 100644 index 0000000..a3037cb --- /dev/null +++ b/docs/nuxt/IconsGithub.c47cbd38.js @@ -0,0 +1 @@ +import{k as e,o as t,e as o,f as C}from"./entry.a1162545.js";const s={},n={xmlns:"http://www.w3.org/2000/svg",height:"48",width:"48",viewBox:"0 0 1024 1024",fill:"currentColor"},r=C("path",{xmlns:"http://www.w3.org/2000/svg","fill-rule":"evenodd","clip-rule":"evenodd",d:"M8 0C3.58 0 0 3.58 0 8C0 11.54 2.29 14.53 5.47 15.59C5.87 15.66 6.02 15.42 6.02 15.21C6.02 15.02 6.01 14.39 6.01 13.72C4 14.09 3.48 13.23 3.32 12.78C3.23 12.55 2.84 11.84 2.5 11.65C2.22 11.5 1.82 11.13 2.49 11.12C3.12 11.11 3.57 11.7 3.72 11.94C4.44 13.15 5.59 12.81 6.05 12.6C6.12 12.08 6.33 11.73 6.56 11.53C4.78 11.33 2.92 10.64 2.92 7.58C2.92 6.71 3.23 5.99 3.74 5.43C3.66 5.23 3.38 4.41 3.82 3.31C3.82 3.31 4.49 3.1 6.02 4.13C6.66 3.95 7.34 3.86 8.02 3.86C8.7 3.86 9.38 3.95 10.02 4.13C11.55 3.09 12.22 3.31 12.22 3.31C12.66 4.41 12.38 5.23 12.3 5.43C12.81 5.99 13.12 6.7 13.12 7.58C13.12 10.65 11.25 11.33 9.47 11.53C9.76 11.78 10.01 12.26 10.01 13.01C10.01 14.08 10 14.94 10 15.21C10 15.42 10.15 15.67 10.55 15.59C13.71 14.53 16 11.53 16 8C16 3.58 12.42 0 8 0Z",transform:"scale(64)"},null,-1),c=[r];function _(l,a){return t(),o("svg",n,c)}const i=e(s,[["render",_]]);export{i as default}; diff --git a/docs/nuxt/IconsLinkedin.125a3758.js b/docs/nuxt/IconsLinkedin.125a3758.js new file mode 100644 index 0000000..aa38d15 --- /dev/null +++ b/docs/nuxt/IconsLinkedin.125a3758.js @@ -0,0 +1 @@ +import{k as t,o,e as s,f as e}from"./entry.a1162545.js";const n={},c={height:"72",viewBox:"0 0 72 72",width:"72",xmlns:"http://www.w3.org/2000/svg",fill:"currentColor"},_=e("g",{"fill-rule":"evenodd"},[e("path",{d:"M8,72 L64,72 C68.418278,72 72,68.418278 72,64 L72,8 C72,3.581722 68.418278,-8.11624501e-16 64,0 L8,0 C3.581722,8.11624501e-16 -5.41083001e-16,3.581722 0,8 L0,64 C5.41083001e-16,68.418278 3.581722,72 8,72 ZM62,62 L51.315625,62 L51.315625,43.8021149 C51.315625,38.8127542 49.4197917,36.0245323 45.4707031,36.0245323 C41.1746094,36.0245323 38.9300781,38.9261103 38.9300781,43.8021149 L38.9300781,62 L28.6333333,62 L28.6333333,27.3333333 L38.9300781,27.3333333 L38.9300781,32.0029283 C38.9300781,32.0029283 42.0260417,26.2742151 49.3825521,26.2742151 C56.7356771,26.2742151 62,30.7644705 62,40.051212 L62,62 Z M16.349349,22.7940133 C12.8420573,22.7940133 10,19.9296567 10,16.3970067 C10,12.8643566 12.8420573,10 16.349349,10 C19.8566406,10 22.6970052,12.8643566 22.6970052,16.3970067 C22.6970052,19.9296567 19.8566406,22.7940133 16.349349,22.7940133 Z M11.0325521,62 L21.769401,62 L21.769401,27.3333333 L11.0325521,27.3333333 L11.0325521,62 Z"})],-1),r=[_];function L(C,a){return o(),s("svg",c,r)}const i=t(n,[["render",L]]);export{i as default}; diff --git a/docs/nuxt/IconsSend.9f60ece7.js b/docs/nuxt/IconsSend.9f60ece7.js new file mode 100644 index 0000000..05da856 --- /dev/null +++ b/docs/nuxt/IconsSend.9f60ece7.js @@ -0,0 +1 @@ +import{k as t,o as e,e as o,f as s}from"./entry.a1162545.js";const n={},c={xmlns:"http://www.w3.org/2000/svg",height:"48",width:"48",viewBox:"0 0 48 48",fill:"currentColor"},_=s("path",{xmlns:"http://www.w3.org/2000/svg",d:"M7 34.05Q5.85 33.8 4.925 33 4 32.2 4 31.05V13.9q0-.6.25-1.125t.95-.875l16-7.9 15.35 7.9q.45.35.9 1.025.45.675.6 1.225h-3.7L21.2 7.35 7 14.4ZM11.5 42q-1.2 0-2.1-.925-.9-.925-.9-2.075V18.65q0-1.15.9-2.075.9-.925 2.1-.925H41q1.15 0 2.075.925Q44 17.5 44 18.65V39q0 1.15-.925 2.075Q42.15 42 41 42Zm14.75-12.9L11.5 21.85V39H41V21.85Zm0-3.35 14.45-7.1H11.8ZM41 18.65H11.5 41Z"},null,-1),r=[_];function a(l,h){return e(),o("svg",c,r)}const w=t(n,[["render",a]]);export{w as default}; diff --git a/docs/nuxt/IconsTelegram.783c99b0.js b/docs/nuxt/IconsTelegram.783c99b0.js new file mode 100644 index 0000000..5364a8e --- /dev/null +++ b/docs/nuxt/IconsTelegram.783c99b0.js @@ -0,0 +1 @@ +import{k as c,o as e,e as t,f as o}from"./entry.a1162545.js";const s={},n={xmlns:"http://www.w3.org/2000/svg",height:"48",width:"48",viewBox:"0 0 240 240",fill:"currentColor"},_=o("path",{d:"M222.51 19.53c-2.674.083-5.354.78-7.783 1.872-4.433 1.702-51.103 19.78-97.79 37.834C93.576 68.27 70.25 77.28 52.292 84.2 34.333 91.12 21.27 96.114 19.98 96.565c-4.28 1.502-10.448 3.905-14.582 8.76-2.066 2.428-3.617 6.794-1.804 10.53 1.812 3.74 5.303 5.804 10.244 7.69l.152.058.156.048c17.998 5.55 45.162 14.065 48.823 15.213.95 3.134 12.412 40.865 18.65 61.285 1.602 4.226 6.357 7.058 10.773 6.46.794.027 2.264.014 3.898-.378 2.383-.57 5.454-1.924 8.374-4.667l.002-.002c4.153-3.9 18.925-18.373 23.332-22.693l48.27 35.643.18.11s4.368 2.894 10.134 3.284c2.883.195 6.406-.33 9.455-2.556 3.05-2.228 5.25-5.91 6.352-10.71 3.764-16.395 29.428-138.487 33.83-158.837 2.742-10.348 1.442-18.38-3.7-22.872-2.59-2.26-5.675-3.275-8.827-3.395-.394-.015-.788-.016-1.183-.004zm.545 10.02c1.254.02 2.26.365 2.886.91 1.252 1.093 2.878 4.386.574 12.944-12.437 55.246-23.276 111.71-33.87 158.994-.73 3.168-1.752 4.323-2.505 4.873-.754.552-1.613.744-2.884.658-2.487-.17-5.36-1.72-5.488-1.79l-78.207-57.745c7.685-7.266 59.17-55.912 87.352-81.63 3.064-2.95.584-8.278-3.53-8.214-5.294 1.07-9.64 4.85-14.437 7.212-34.79 20.36-100.58 60.213-106.402 63.742-3.04-.954-30.89-9.686-49.197-15.332-2.925-1.128-3.962-2.02-4.344-2.36.007-.01.002.004.01-.005 1.362-1.6 6.97-4.646 10.277-5.807 2.503-.878 14.633-5.544 32.6-12.467 17.965-6.922 41.294-15.938 64.653-24.97 32.706-12.647 65.46-25.32 98.137-37.98 1.617-.75 3.12-1.052 4.375-1.032zM100.293 158.41l19.555 14.44c-5.433 5.32-18.327 17.937-21.924 21.322l2.37-35.762z"},null,-1),l=[_];function r(a,i){return e(),t("svg",n,l)}const h=c(s,[["render",r]]);export{h as default}; diff --git a/docs/nuxt/LayoutFooter.92ed5906.js b/docs/nuxt/LayoutFooter.92ed5906.js new file mode 100644 index 0000000..160a2ce --- /dev/null +++ b/docs/nuxt/LayoutFooter.92ed5906.js @@ -0,0 +1 @@ +import{k as n,o as l,e as r,f as t,h as s,T as a,t as c,i as _,w as i,b as u}from"./entry.a1162545.js";import{a as d}from"./LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.module.5f1b7ee4.js";const m={},f=t("div",null,"btw, have a nice day",-1);function p(e,w){const o=u;return l(),r("footer",{class:s([e.$style.footer,e.$attrs.class])},[f,t("div",{class:s(e.$style.filler)},null,2),t("div",null,[a(" (2018 - "+c(new Date().getFullYear())+") ",1),_(o,{to:"https://github.com/muerwre/",target:"_blank"},{default:i(()=>[a("muerwre")]),_:1})])],2)}const h={$style:d},x=n(m,[["render",p],["__cssModules",h]]);export{x as default}; diff --git a/docs/nuxt/LayoutHeader.85946555.js b/docs/nuxt/LayoutHeader.85946555.js new file mode 100644 index 0000000..5c46912 --- /dev/null +++ b/docs/nuxt/LayoutHeader.85946555.js @@ -0,0 +1 @@ +import{k as c,o as l,e as n,i as t,w as a,T as o,h as _,b as r}from"./entry.a1162545.js";import{s as i}from"./LayoutHeader.vue_used_vue_type_style_index_0_lang.module.57d4f89f.js";const u={};function d(e,f){const s=r;return l(),n("header",{class:_(e.$style.header)},[t(s,{to:"/",activeClass:e.$style.active},{default:a(()=>[o("Home")]),_:1},8,["activeClass"]),t(s,{to:"/about",activeClass:e.$style.active},{default:a(()=>[o("About")]),_:1},8,["activeClass"]),t(s,{to:"/contacts",activeClass:e.$style.active},{default:a(()=>[o("Contacts")]),_:1},8,["activeClass"])],2)}const m={$style:i},p=c(u,[["render",d],["__cssModules",m]]);export{p as default}; diff --git a/docs/nuxt/LayoutMainMenu.8e9bb43b.js b/docs/nuxt/LayoutMainMenu.8e9bb43b.js new file mode 100644 index 0000000..286d150 --- /dev/null +++ b/docs/nuxt/LayoutMainMenu.8e9bb43b.js @@ -0,0 +1 @@ +import{k as m,Q as p,D as h,o,e as l,f as a,i,w as y,h as t,R as f,S as v,u as w,b as $,a1 as g}from"./entry.a1162545.js";import{f as M}from"./navigation.c88a11e6.js";import{a as k}from"./LayoutMainMenuToggle.vue_used_vue_type_style_index_0_lang.module.fbcd3219.js";const C={__name:"LayoutMainMenu",async setup(x){let s,r;const{data:c}=([s,r]=p(()=>h("navigation",()=>M())),s=await s,r(),s),_=c.value.filter(e=>e.children&&Array.isArray(e.children)&&e.children.length>0);return(e,A)=>{const u=$,d=g;return o(),l("nav",null,[a("div",{class:t(e.$style.logo)},[i(u,{to:"/"},{default:y(()=>[a("div",{class:t(e.$style.title)},"Obsidian Garden",2),a("div",{class:t(e.$style.subtitle)},"by muerwre",2)]),_:1})],2),a("div",{class:t(e.$style.section_title)},"Cheatsheet",2),(o(!0),l(f,null,v(w(_),n=>(o(),l("div",{key:"item._path",class:t(e.$style.row)},[i(d,{title:n.title,url:n._path,children:n.children},null,8,["title","url","children"])],2))),128))])}}},b={$style:k},D=m(C,[["__cssModules",b]]);export{D as default}; diff --git a/docs/nuxt/LayoutMainMenuToggle.62cc3970.js b/docs/nuxt/LayoutMainMenuToggle.62cc3970.js new file mode 100644 index 0000000..abc83dd --- /dev/null +++ b/docs/nuxt/LayoutMainMenuToggle.62cc3970.js @@ -0,0 +1 @@ +import{a as l,o as s,e as o,h as a,f as e,k as c}from"./entry.a1162545.js";import{s as i}from"./LayoutMainMenuToggle.vue_used_vue_type_style_index_0_lang.module.fbcd3219.js";const r=e("rect",{x:"0",y:"3",width:"24",height:"2"},null,-1),h=e("rect",{x:"0",y:"11",width:"24",height:"2"},null,-1),_=e("rect",{x:"0",y:"19",width:"24",height:"2"},null,-1),u=[r,h,_],f=l({__name:"LayoutMainMenuToggle",props:{active:{type:Boolean}},setup(n){return(t,m)=>(s(),o("button",{class:a([t.$attrs.class,t.$style.button])},[(s(),o("svg",{xmlns:"http://www.w3.org/2000/svg",height:"24",viewBox:"0 0 24 24",width:"24",fill:"#ffffff",class:a([t.$style.hamburger,{[t.$style.active]:n.active}])},u,2))],2))}}),d={$style:i},y=c(f,[["__cssModules",d]]);export{y as default}; diff --git a/docs/nuxt/LayoutThemeToggle.0b8ad036.js b/docs/nuxt/LayoutThemeToggle.0b8ad036.js new file mode 100644 index 0000000..3634cf8 --- /dev/null +++ b/docs/nuxt/LayoutThemeToggle.0b8ad036.js @@ -0,0 +1 @@ +import{_ as s,s as o}from"./LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.module.5f1b7ee4.js";import{k as t}from"./entry.a1162545.js";const _={$style:o},a=t(s,[["__cssModules",_]]);export{a as default}; diff --git a/docs/nuxt/LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.module.5f1b7ee4.js b/docs/nuxt/LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.module.5f1b7ee4.js new file mode 100644 index 0000000..d12e818 --- /dev/null +++ b/docs/nuxt/LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.module.5f1b7ee4.js @@ -0,0 +1,4 @@ +import{k as v,o as i,e as d,f as u,a as h,q as p,J as q,m as _,i as M,w as T,c as g,j as m,h as $}from"./entry.a1162545.js";const w={},Q={xmlns:"http://www.w3.org/2000/svg",height:"48",width:"48",viewBox:"0 0 48 48"},Z=u("path",{d:"M17.85 7.55q-.7 0-1.45.075t-1.3.125q3.05 3.45 4.675 7.6Q21.4 19.5 21.4 24t-1.625 8.65Q18.15 36.8 15.15 40.2q.5.1 1.225.175.725.075 1.525.075 6.8 0 11.6-4.775T34.3 24q0-6.9-4.825-11.675T17.85 7.55Zm.25-1.5q3.6 0 6.85 1.375 3.25 1.375 5.65 3.8 2.4 2.425 3.8 5.7 1.4 3.275 1.4 7.025 0 3.75-1.425 7.05t-3.8 5.75Q28.2 39.2 24.95 40.575t-6.9 1.375q-1.65 0-3.125-.275t-2.675-.725q3.65-3.35 5.65-7.725 2-4.375 2-9.225 0-4.75-2-9.175-2-4.425-5.65-7.775 1.15-.45 2.675-.725Q16.45 6.05 18.1 6.05ZM21.4 24Z"},null,-1),C=[Z];function O(l,e){return i(),d("svg",Q,C)}const b=v(w,[["render",O]]),E=Object.freeze(Object.defineProperty({__proto__:null,default:b},Symbol.toStringTag,{value:"Module"})),j={},S={xmlns:"http://www.w3.org/2000/svg",height:"48",width:"48",viewBox:"0 0 48 48"},z=u("path",{d:"M24 30.45q2.65 0 4.55-1.875T30.45 24q0-2.65-1.875-4.55T24 17.55q-2.65 0-4.55 1.875T17.55 24q0 2.65 1.875 4.55T24 30.45ZM24 32q-3.35 0-5.675-2.325Q16 27.35 16 24q0-3.35 2.325-5.675Q20.65 16 24 16q3.35 0 5.675 2.325Q32 20.65 32 24q0 3.35-2.325 5.675Q27.35 32 24 32ZM3.75 24.75q-.3 0-.525-.225Q3 24.3 3 24q0-.35.225-.55.225-.2.525-.2h5.5q.3 0 .525.225Q10 23.7 10 24q0 .35-.225.55-.225.2-.525.2Zm35 0q-.3 0-.525-.225Q38 24.3 38 24q0-.35.225-.55.225-.2.525-.2h5.5q.3 0 .525.225Q45 23.7 45 24q0 .35-.225.55-.225.2-.525.2ZM24 10q-.35 0-.55-.225-.2-.225-.2-.525v-5.5q0-.3.225-.525Q23.7 3 24 3q.35 0 .55.225.2.225.2.525v5.5q0 .3-.225.525Q24.3 10 24 10Zm0 35q-.35 0-.55-.225-.2-.225-.2-.525v-5.5q0-.3.225-.525Q23.7 38 24 38q.35 0 .55.225.2.225.2.525v5.5q0 .3-.225.525Q24.3 45 24 45ZM13.05 14.05l-3.2-3.1q-.25-.2-.225-.525.025-.325.225-.575.25-.25.55-.25.3 0 .55.25L14.1 13q.25.25.25.55 0 .3-.25.55-.2.2-.5.2t-.55-.25Zm24 24.1L33.9 35q-.25-.25-.25-.55 0-.3.3-.55.15-.25.45-.225.3.025.55.275l3.2 3.1q.25.2.225.525-.025.325-.225.575-.25.25-.55.25-.3 0-.55-.25ZM33.9 14.1q-.25-.2-.225-.5.025-.3.275-.55l3.1-3.2q.2-.25.525-.225.325.025.575.225.25.25.25.55 0 .3-.25.55L35 14.1q-.25.25-.55.25-.3 0-.55-.25ZM9.85 38.15q-.25-.25-.25-.55 0-.3.25-.55L13 33.9q.25-.25.55-.25.3 0 .55.25.2.2.2.5t-.25.55l-3.1 3.2q-.25.25-.55.25-.3 0-.55-.25ZM24 24Z"},null,-1),B=[z];function P(l,e){return i(),d("svg",S,B)}const y=v(j,[["render",P]]),J=Object.freeze(Object.defineProperty({__proto__:null,default:y},Symbol.toStringTag,{value:"Module"})),L="_footer_ogxvf_1",x="_filler_ogxvf_9",W={footer:L,filler:x},k=h({name:"ClientOnly",props:["fallback","placeholder","placeholderTag","fallbackTag"],setup(l,{slots:e}){const t=p(!1);return q(()=>{t.value=!0}),r=>{var c;if(t.value)return(c=e.default)==null?void 0:c.call(e);const o=e.fallback||e.placeholder;if(o)return o();const n=r.fallback||r.placeholder||"",s=r.fallbackTag||r.placeholderTag||"span";return d(s,null,n)}}}),f=new WeakMap;function F(l){if(f.has(l))return f.get(l);const e={...l};return e.render?e.render=(t,...r)=>{var o;if(t.mounted$){const n=l.render(t,...r);return n.children===null||typeof n.children=="string"?u(n.type,n.props,n.children,n.patchFlag,n.dynamicProps,n.shapeFlag):_(n)}else return _("div",(o=t.$attrs)!=null?o:t._.attrs)}:e.template&&(e.template=` + + + `),e.setup=(t,r)=>{var n;const o=p(!1);return q(()=>{o.value=!0}),Promise.resolve(((n=l.setup)==null?void 0:n.call(l,t,r))||{}).then(s=>typeof s!="function"?{...s,mounted$:o}:(...c)=>{if(o.value){const a=s(...c);return a.children===null||typeof a.children=="string"?u(a.type,a.props,a.children,a.patchFlag,a.dynamicProps,a.shapeFlag):_(a)}else return _("div",r.attrs)})},f.set(l,e),e}const A=Object.freeze(Object.defineProperty({__proto__:null,default:k,createClientOnly:F},Symbol.toStringTag,{value:"Module"})),D=h({methods:{toggleTheme(){this.$colorMode.preference=this.$colorMode.preference==="dark"?"light":"dark"}},computed:{isDark(){return this.$colorMode.preference==="dark"}}}),G=h({...D,__name:"LayoutThemeToggle",setup(l){const e=p(!1);return q(()=>{e.value=!0}),(t,r)=>{const o=b,n=y,s=k;return i(),d("button",{onClick:r[0]||(r[0]=(...c)=>t.toggleTheme&&t.toggleTheme(...c)),class:$([t.$attrs.class,t.$style.button,{[t.$style.visible]:e.value}])},[M(s,null,{default:T(()=>[t.isDark?(i(),g(o,{key:0,fill:"currentColor",width:"32",height:"32"})):m("",!0),t.isDark?m("",!0):(i(),g(n,{key:1,fill:"currentColor",width:"32",height:"32"}))]),_:1})],2)}}}),N="_button_jz7in_1",V="_visible_jz7in_7",H={button:N,visible:V};export{E as M,J as S,G as _,W as a,k as b,A as c,H as s}; diff --git a/docs/nuxt/Markdown.ca979d4c.js b/docs/nuxt/Markdown.ca979d4c.js new file mode 100644 index 0000000..d42a558 --- /dev/null +++ b/docs/nuxt/Markdown.ca979d4c.js @@ -0,0 +1 @@ +import r from"./ContentSlot.017eac9c.js";import{a as o,l as u,y as f,L as c}from"./entry.a1162545.js";const i=o({name:"Markdown",extends:r,setup(t){const{parent:e}=c(),{between:n,default:a}=u(),s=f(()=>typeof t.unwrap=="string"?t.unwrap.split(" "):["*"]);return{fallbackSlot:a,tags:s,between:n,parent:e}}});export{i as default}; diff --git a/docs/nuxt/ProseA.125f5d24.js b/docs/nuxt/ProseA.125f5d24.js new file mode 100644 index 0000000..b75d290 --- /dev/null +++ b/docs/nuxt/ProseA.125f5d24.js @@ -0,0 +1 @@ +import{a as o,o as l,c as s,w as c,r as f,b as u}from"./entry.a1162545.js";const i=o({__name:"ProseA",props:{href:{default:""},blank:{type:Boolean,default:!1}},setup(t){const a=e=>!e.match(/^\w+\:\/\//),n=e=>a(e)?e.toLowerCase().replaceAll("%20"," ").replace(/\d+/g,"").trim().replaceAll(" ","-"):e;return(e,p)=>{const r=u;return l(),s(r,{href:n(t.href),target:a(t.href)?"":"_blank"},{default:c(()=>[f(e.$slots,"default")]),_:3},8,["href","target"])}}});export{i as default}; diff --git a/docs/nuxt/ProseBlockquote.cf38769b.js b/docs/nuxt/ProseBlockquote.cf38769b.js new file mode 100644 index 0000000..19a45a6 --- /dev/null +++ b/docs/nuxt/ProseBlockquote.cf38769b.js @@ -0,0 +1 @@ +import{k as o,o as r,e as t,r as c}from"./entry.a1162545.js";const s={};function n(e,l){return r(),t("blockquote",null,[c(e.$slots,"default")])}const f=o(s,[["render",n]]);export{f as default}; diff --git a/docs/nuxt/ProseCode.6beb51eb.js b/docs/nuxt/ProseCode.6beb51eb.js new file mode 100644 index 0000000..618292f --- /dev/null +++ b/docs/nuxt/ProseCode.6beb51eb.js @@ -0,0 +1 @@ +import i from"./UiIconCopy.bfce4552.js";import{a as u,o as t,e as a,f as n,h as s,i as d,t as p,j as m,r as f,k as g}from"./entry.a1162545.js";import{s as _}from"./ProseCode.vue_used_vue_type_style_index_1_lang.module.230a312a.js";const h={key:0},y=u({__name:"ProseCode",props:{code:null,language:{default:null},filename:{default:null},highlights:{default:()=>[]}},setup(o){const l=o,r=()=>{navigator.clipboard.writeText(l.code)};return(e,k)=>{const c=i;return t(),a("div",{class:s(e.$style.wrapper)},[n("button",{class:s(e.$style.language),onClick:r},[n("span",{class:s(e.$style.icon)},[d(c,{width:"12",height:"12",fill:"currentColor"})],2),o.language?(t(),a("span",h,p(o.language),1)):m("",!0)],2),f(e.$slots,"default")],2)}}}),C={$style:_},N=g(y,[["__cssModules",C]]);export{N as default}; diff --git a/docs/nuxt/ProseCodeInline.4d9c4a74.js b/docs/nuxt/ProseCodeInline.4d9c4a74.js new file mode 100644 index 0000000..75332ac --- /dev/null +++ b/docs/nuxt/ProseCodeInline.4d9c4a74.js @@ -0,0 +1 @@ +import{k as o,o as r,e as n,r as s}from"./entry.a1162545.js";const t={};function c(e,a){return r(),n("code",null,[s(e.$slots,"default")])}const d=o(t,[["render",c]]);export{d as default}; diff --git a/docs/nuxt/ProseEm.f76a6875.js b/docs/nuxt/ProseEm.f76a6875.js new file mode 100644 index 0000000..cf44cb2 --- /dev/null +++ b/docs/nuxt/ProseEm.f76a6875.js @@ -0,0 +1 @@ +import{k as r,o,e as s,r as t}from"./entry.a1162545.js";const n={};function c(e,a){return o(),s("em",null,[t(e.$slots,"default")])}const f=r(n,[["render",c]]);export{f as default}; diff --git a/docs/nuxt/ProseH1.84254f6d.js b/docs/nuxt/ProseH1.84254f6d.js new file mode 100644 index 0000000..d973f08 --- /dev/null +++ b/docs/nuxt/ProseH1.84254f6d.js @@ -0,0 +1 @@ +import{a as i,M as l,o as s,e as o,u,r as d}from"./entry.a1162545.js";const r=["id"],c=["href"],p=i({__name:"ProseH1",props:{id:null},setup(t){const{anchorLinks:e}=l().public.content,a=(e==null?void 0:e.depth)>=1&&!(e!=null&&e.exclude.includes(1));return(n,h)=>(s(),o("h1",{id:t.id},[u(a)?(s(),o("a",{key:0,href:`#${t.id}`},[d(n.$slots,"default")],8,c)):d(n.$slots,"default",{key:1})],8,r))}});export{p as default}; diff --git a/docs/nuxt/ProseH2.7bcea41b.js b/docs/nuxt/ProseH2.7bcea41b.js new file mode 100644 index 0000000..4e299fd --- /dev/null +++ b/docs/nuxt/ProseH2.7bcea41b.js @@ -0,0 +1 @@ +import{a as i,M as l,o as s,e as o,u,r as d}from"./entry.a1162545.js";const r=["id"],c=["href"],p=i({__name:"ProseH2",props:{id:null},setup(t){const{anchorLinks:e}=l().public.content,a=(e==null?void 0:e.depth)>=2&&!(e!=null&&e.exclude.includes(2));return(n,h)=>(s(),o("h2",{id:t.id},[u(a)?(s(),o("a",{key:0,href:`#${t.id}`},[d(n.$slots,"default")],8,c)):d(n.$slots,"default",{key:1})],8,r))}});export{p as default}; diff --git a/docs/nuxt/ProseH3.a0130b89.js b/docs/nuxt/ProseH3.a0130b89.js new file mode 100644 index 0000000..8ef9e1f --- /dev/null +++ b/docs/nuxt/ProseH3.a0130b89.js @@ -0,0 +1 @@ +import{a as i,M as l,o as s,e as o,u,r as d}from"./entry.a1162545.js";const r=["id"],c=["href"],p=i({__name:"ProseH3",props:{id:null},setup(t){const{anchorLinks:e}=l().public.content,a=(e==null?void 0:e.depth)>=3&&!(e!=null&&e.exclude.includes(3));return(n,h)=>(s(),o("h3",{id:t.id},[u(a)?(s(),o("a",{key:0,href:`#${t.id}`},[d(n.$slots,"default")],8,c)):d(n.$slots,"default",{key:1})],8,r))}});export{p as default}; diff --git a/docs/nuxt/ProseH4.f11e985d.js b/docs/nuxt/ProseH4.f11e985d.js new file mode 100644 index 0000000..74439f3 --- /dev/null +++ b/docs/nuxt/ProseH4.f11e985d.js @@ -0,0 +1 @@ +import{a as i,M as l,o as s,e as o,u,r as d}from"./entry.a1162545.js";const r=["id"],c=["href"],p=i({__name:"ProseH4",props:{id:null},setup(t){const{anchorLinks:e}=l().public.content,a=(e==null?void 0:e.depth)>=4&&!(e!=null&&e.exclude.includes(4));return(n,h)=>(s(),o("h4",{id:t.id},[u(a)?(s(),o("a",{key:0,href:`#${t.id}`},[d(n.$slots,"default")],8,c)):d(n.$slots,"default",{key:1})],8,r))}});export{p as default}; diff --git a/docs/nuxt/ProseH5.9093445b.js b/docs/nuxt/ProseH5.9093445b.js new file mode 100644 index 0000000..70e89a4 --- /dev/null +++ b/docs/nuxt/ProseH5.9093445b.js @@ -0,0 +1 @@ +import{a as i,M as l,o as s,e as o,u,r as d}from"./entry.a1162545.js";const r=["id"],c=["href"],p=i({__name:"ProseH5",props:{id:null},setup(t){const{anchorLinks:e}=l().public.content,a=(e==null?void 0:e.depth)>=5&&!(e!=null&&e.exclude.includes(5));return(n,h)=>(s(),o("h5",{id:t.id},[u(a)?(s(),o("a",{key:0,href:`#${t.id}`},[d(n.$slots,"default")],8,c)):d(n.$slots,"default",{key:1})],8,r))}});export{p as default}; diff --git a/docs/nuxt/ProseH6.b0d8f665.js b/docs/nuxt/ProseH6.b0d8f665.js new file mode 100644 index 0000000..dc4029e --- /dev/null +++ b/docs/nuxt/ProseH6.b0d8f665.js @@ -0,0 +1 @@ +import{a as i,M as l,o as s,e as o,u,r as d}from"./entry.a1162545.js";const r=["id"],c=["href"],p=i({__name:"ProseH6",props:{id:null},setup(t){const{anchorLinks:e}=l().public.content,a=(e==null?void 0:e.depth)>=6&&!(e!=null&&e.exclude.includes(6));return(n,h)=>(s(),o("h6",{id:t.id},[u(a)?(s(),o("a",{key:0,href:`#${t.id}`},[d(n.$slots,"default")],8,c)):d(n.$slots,"default",{key:1})],8,r))}});export{p as default}; diff --git a/docs/nuxt/ProseHr.96616888.js b/docs/nuxt/ProseHr.96616888.js new file mode 100644 index 0000000..42cbef5 --- /dev/null +++ b/docs/nuxt/ProseHr.96616888.js @@ -0,0 +1 @@ +import{k as e,o as r,e as c}from"./entry.a1162545.js";const o={};function t(n,s){return r(),c("hr")}const _=e(o,[["render",t]]);export{_ as default}; diff --git a/docs/nuxt/ProseImg.092ce6d9.js b/docs/nuxt/ProseImg.092ce6d9.js new file mode 100644 index 0000000..61a5d58 --- /dev/null +++ b/docs/nuxt/ProseImg.092ce6d9.js @@ -0,0 +1 @@ +import{a as e,o as i,e as a}from"./entry.a1162545.js";const r=["src","alt","width","height"],c=e({__name:"ProseImg",props:{src:{type:String,default:""},alt:{type:String,default:""},width:{type:[String,Number],default:void 0},height:{type:[String,Number],default:void 0}},setup(t){return(n,h)=>(i(),a("img",{src:t.src,alt:t.alt,width:t.width,height:t.height},null,8,r))}});export{c as default}; diff --git a/docs/nuxt/ProseLi.03d0a4b8.js b/docs/nuxt/ProseLi.03d0a4b8.js new file mode 100644 index 0000000..4688175 --- /dev/null +++ b/docs/nuxt/ProseLi.03d0a4b8.js @@ -0,0 +1 @@ +import{k as r,o,e as s,r as t}from"./entry.a1162545.js";const n={};function c(e,a){return o(),s("li",null,[t(e.$slots,"default")])}const f=r(n,[["render",c]]);export{f as default}; diff --git a/docs/nuxt/ProseOl.abb4941e.js b/docs/nuxt/ProseOl.abb4941e.js new file mode 100644 index 0000000..894f553 --- /dev/null +++ b/docs/nuxt/ProseOl.abb4941e.js @@ -0,0 +1 @@ +import{k as o,o as r,e as s,r as t}from"./entry.a1162545.js";const n={};function c(e,l){return r(),s("ol",null,[t(e.$slots,"default")])}const f=o(n,[["render",c]]);export{f as default}; diff --git a/docs/nuxt/ProseP.b6cc34ce.js b/docs/nuxt/ProseP.b6cc34ce.js new file mode 100644 index 0000000..502a043 --- /dev/null +++ b/docs/nuxt/ProseP.b6cc34ce.js @@ -0,0 +1 @@ +import{k as r,o,e as s,r as t}from"./entry.a1162545.js";const n={};function c(e,a){return o(),s("p",null,[t(e.$slots,"default")])}const f=r(n,[["render",c]]);export{f as default}; diff --git a/docs/nuxt/ProseStrong.157fed42.js b/docs/nuxt/ProseStrong.157fed42.js new file mode 100644 index 0000000..e250639 --- /dev/null +++ b/docs/nuxt/ProseStrong.157fed42.js @@ -0,0 +1 @@ +import{k as r,o,e as t,r as n}from"./entry.a1162545.js";const s={};function c(e,a){return o(),t("strong",null,[n(e.$slots,"default")])}const f=r(s,[["render",c]]);export{f as default}; diff --git a/docs/nuxt/ProseTable.71457587.js b/docs/nuxt/ProseTable.71457587.js new file mode 100644 index 0000000..e815c45 --- /dev/null +++ b/docs/nuxt/ProseTable.71457587.js @@ -0,0 +1 @@ +import{k as r,o,e as t,r as s}from"./entry.a1162545.js";const a={};function n(e,c){return o(),t("table",null,[s(e.$slots,"default")])}const f=r(a,[["render",n]]);export{f as default}; diff --git a/docs/nuxt/ProseTbody.fe1f05e0.js b/docs/nuxt/ProseTbody.fe1f05e0.js new file mode 100644 index 0000000..c748a2f --- /dev/null +++ b/docs/nuxt/ProseTbody.fe1f05e0.js @@ -0,0 +1 @@ +import{k as o,o as r,e as t,r as s}from"./entry.a1162545.js";const n={};function c(e,a){return r(),t("tbody",null,[s(e.$slots,"default")])}const d=o(n,[["render",c]]);export{d as default}; diff --git a/docs/nuxt/ProseTd.63f8da62.js b/docs/nuxt/ProseTd.63f8da62.js new file mode 100644 index 0000000..53c57bc --- /dev/null +++ b/docs/nuxt/ProseTd.63f8da62.js @@ -0,0 +1 @@ +import{k as r,o,e as t,r as s}from"./entry.a1162545.js";const n={};function c(e,a){return o(),t("td",null,[s(e.$slots,"default")])}const d=r(n,[["render",c]]);export{d as default}; diff --git a/docs/nuxt/ProseTh.1dca9060.js b/docs/nuxt/ProseTh.1dca9060.js new file mode 100644 index 0000000..dc67c83 --- /dev/null +++ b/docs/nuxt/ProseTh.1dca9060.js @@ -0,0 +1 @@ +import{k as r,o,e as t,r as s}from"./entry.a1162545.js";const n={};function c(e,a){return o(),t("th",null,[s(e.$slots,"default")])}const f=r(n,[["render",c]]);export{f as default}; diff --git a/docs/nuxt/ProseThead.c70e04b7.js b/docs/nuxt/ProseThead.c70e04b7.js new file mode 100644 index 0000000..0a8ebb3 --- /dev/null +++ b/docs/nuxt/ProseThead.c70e04b7.js @@ -0,0 +1 @@ +import{k as r,o,e as t,r as s}from"./entry.a1162545.js";const a={};function n(e,c){return o(),t("thead",null,[s(e.$slots,"default")])}const d=r(a,[["render",n]]);export{d as default}; diff --git a/docs/nuxt/ProseTr.fcd995d6.js b/docs/nuxt/ProseTr.fcd995d6.js new file mode 100644 index 0000000..3c224cb --- /dev/null +++ b/docs/nuxt/ProseTr.fcd995d6.js @@ -0,0 +1 @@ +import{k as r,o,e as t,r as s}from"./entry.a1162545.js";const n={};function c(e,a){return o(),t("tr",null,[s(e.$slots,"default")])}const f=r(n,[["render",c]]);export{f as default}; diff --git a/docs/nuxt/ProseUl.a662ccb8.js b/docs/nuxt/ProseUl.a662ccb8.js new file mode 100644 index 0000000..2849e4a --- /dev/null +++ b/docs/nuxt/ProseUl.a662ccb8.js @@ -0,0 +1 @@ +import{k as r,o,e as s,r as t}from"./entry.a1162545.js";const n={};function c(e,l){return o(),s("ul",null,[t(e.$slots,"default")])}const f=r(n,[["render",c]]);export{f as default}; diff --git a/docs/nuxt/UiActionButton.dd6e6d76.js b/docs/nuxt/UiActionButton.dd6e6d76.js new file mode 100644 index 0000000..8871be8 --- /dev/null +++ b/docs/nuxt/UiActionButton.dd6e6d76.js @@ -0,0 +1 @@ +import{a as f,o as a,c as i,w as u,e as o,r as l,h as e,j as n,f as $,b as p,k as d,W as m}from"./entry.a1162545.js";const y=f({__name:"UiActionButton",props:{href:null,size:{default:"md"},variant:{default:"outline"}},setup(t){return(s,k)=>{const r=p;return a(),i(r,{class:e([s.$style.button,s.$attrs.style,s.$style[`variant-${t.variant}`],s.$style[`size-${t.size}`],{[s.$style.prefixed]:s.$slots.prefix,[s.$style.suffixed]:s.$slots.suffix}]),to:t.href},{default:u(()=>[s.$slots.prefix?(a(),o("span",{key:0,class:e(s.$style.prefix)},[l(s.$slots,"prefix")],2)):n("",!0),$("span",{class:e(s.$style.title)},[l(s.$slots,"default")],2),s.$slots.suffix?(a(),o("span",{key:1,class:e(s.$style.suffix)},[l(s.$slots,"suffix")],2)):n("",!0)]),_:3},8,["class","to"])}}}),c={$style:m},B=d(y,[["__cssModules",c]]);export{B as default}; diff --git a/docs/nuxt/UiButtonGroup.03df9d51.js b/docs/nuxt/UiButtonGroup.03df9d51.js new file mode 100644 index 0000000..567b255 --- /dev/null +++ b/docs/nuxt/UiButtonGroup.03df9d51.js @@ -0,0 +1 @@ +import{k as e,o as t,e as o,r as a,h as n,X as l}from"./entry.a1162545.js";const r={};function c(s,d){return t(),o("div",{class:n([s.$attrs.class,s.$style.buttons])},[a(s.$slots,"default")],2)}const _={$style:l},f=e(r,[["render",c],["__cssModules",_]]);export{f as default}; diff --git a/docs/nuxt/UiCard.30356a36.js b/docs/nuxt/UiCard.30356a36.js new file mode 100644 index 0000000..63ac787 --- /dev/null +++ b/docs/nuxt/UiCard.30356a36.js @@ -0,0 +1 @@ +import{s as e}from"./UiCard.vue_used_vue_type_style_index_0_lang.module.a0027dfd.js";import{k as o,o as t,e as r,r as a,h as c}from"./entry.a1162545.js";const l={};function n(s,d){return t(),r("div",{class:c([s.$style.card,s.$attrs.class])},[a(s.$slots,"default")],2)}const _={$style:e},u=o(l,[["render",n],["__cssModules",_]]);export{u as default}; diff --git a/docs/nuxt/UiIconCopy.bfce4552.js b/docs/nuxt/UiIconCopy.bfce4552.js new file mode 100644 index 0000000..be4dde6 --- /dev/null +++ b/docs/nuxt/UiIconCopy.bfce4552.js @@ -0,0 +1 @@ +import{k as e,o,e as c,f as t}from"./entry.a1162545.js";const n={},s={xmlns:"http://www.w3.org/2000/svg",height:"24px",viewBox:"0 0 24 24",width:"24px",fill:"#ffffff"},_=t("path",{d:"M0 0h24v24H0z",fill:"none"},null,-1),h=t("path",{d:"M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z"},null,-1),f=[_,h];function a(l,r){return o(),c("svg",s,f)}const d=e(n,[["render",a]]);export{d as default}; diff --git a/docs/nuxt/UiStars.f80344a8.js b/docs/nuxt/UiStars.f80344a8.js new file mode 100644 index 0000000..9ca4147 --- /dev/null +++ b/docs/nuxt/UiStars.f80344a8.js @@ -0,0 +1 @@ +import l from"./IconStar.856ef9b4.js";import{a as c,o as e,e as t,R as _,S as m,i,h as n,k as u}from"./entry.a1162545.js";import{f as p}from"./BioSkills.vue_used_vue_type_style_index_0_lang.module.516c18c9.js";const d=c({__name:"UiStars",props:{count:null},setup(o){return(s,h)=>{const a=l;return e(),t("div",{class:n(s.$style.rating)},[(e(),t(_,null,m(5,r=>i(a,{width:22,height:"22",class:n([s.$style.star,{[s.$style.filled]:r>o.count}])},null,8,["class"])),64))],2)}}}),f={$style:p},k=u(d,[["__cssModules",f]]);export{k as default}; diff --git a/docs/nuxt/_...slug_.63d24149.js b/docs/nuxt/_...slug_.63d24149.js new file mode 100644 index 0000000..f4c32ef --- /dev/null +++ b/docs/nuxt/_...slug_.63d24149.js @@ -0,0 +1 @@ +import{a as c,z as r,o as u,e as i,i as t,w as o,h as m,O as p,f as s,t as d,P as f,k as $}from"./entry.a1162545.js";import g from"./HomeReference.bf6fb900.js";import"./navigation.c88a11e6.js";const x={scrollToTop:!0},y=c({...x,__name:"[...slug]",setup(B){return r({titleTemplate:e=>e?`${e} \u2022 Obsidian Garden`:"Obsidian Garden"}),(e,O)=>{const a=f,_=g,l=p;return u(),i("main",{class:m(e.$style.content)},[t(l,null,{default:o(({doc:n})=>[s("h1",null,d(n.title),1),s("article",null,[t(a,{value:n},null,8,["value"])])]),"not-found":o(({props:{path:n}})=>[t(_,{url:n},null,8,["url"])]),_:1})],2)}}}),C="_content_1gz79_1",h={content:C},z={$style:h},v=$(y,[["__cssModules",z]]);export{v as default}; diff --git a/docs/nuxt/about.8a9181bf.js b/docs/nuxt/about.8a9181bf.js new file mode 100644 index 0000000..bbb8467 --- /dev/null +++ b/docs/nuxt/about.8a9181bf.js @@ -0,0 +1 @@ +import r from"./BioHeading.1e2de442.js";import _ from"./BioSkills.8a45295a.js";import p from"./BioProjects.59ee94c3.js";import{k as a,o as m,e as l,f as e,i as s,h as t}from"./entry.a1162545.js";import"./IconsSend.9f60ece7.js";import"./UiActionButton.dd6e6d76.js";import"./IconsGithub.c47cbd38.js";import"./UiButtonGroup.03df9d51.js";import"./BioSkills.vue_used_vue_type_style_index_0_lang.module.516c18c9.js";import"./BioSkillsCard.9eb3a7e8.js";import"./UiStars.f80344a8.js";import"./IconStar.856ef9b4.js";import"./UiCard.30356a36.js";import"./UiCard.vue_used_vue_type_style_index_0_lang.module.a0027dfd.js";import"./BioProjectCard.92964127.js";import"./IconsCode.f19221b0.js";import"./ArrowRight.14964609.js";const d={scrollToTop:!0,head(){return{title:"About Me"}}},u="_content_1jhz3_1",f="_section_1jhz3_17",h="_heading_1jhz3_20",$={content:u,section:f,heading:h};function y(o,g,j,k,z,M){const n=r,c=_,i=p;return m(),l("article",{class:t(o.$style.content)},[e("section",{class:t([o.$style.section,o.$style.heading])},[s(n)],2),e("section",{class:t(o.$style.section)},[s(c)],2),e("section",{class:t(o.$style.section)},[s(i)],2)],2)}const B={$style:$},I=a(d,[["render",y],["__cssModules",B]]);export{I as default}; diff --git a/docs/nuxt/client-db.ba528d0d.js b/docs/nuxt/client-db.ba528d0d.js new file mode 100644 index 0000000..df92293 --- /dev/null +++ b/docs/nuxt/client-db.ba528d0d.js @@ -0,0 +1 @@ +import{a5 as S,a6 as M,a7 as E,a8 as A,a9 as U,aa as j,ab as z,ac as N,ad as W,ae as T,M as K,I as H,af as J,s as R,ag as q}from"./entry.a1162545.js";const B=()=>{const n=new Map;return{hasItem(t){return n.has(t)},getItem(t){return n.get(t)||null},setItem(t,e){n.set(t,e)},removeItem(t){n.delete(t)},getKeys(){return Array.from(n.keys())},clear(){n.clear()},dispose(){n.clear()}}};function G(n){return!n||typeof n.then!="function"?Promise.resolve(n):n}function p(n,...t){try{return G(n(...t))}catch(e){return Promise.reject(e)}}function Z(n){const t=typeof n;return n===null||t!=="object"&&t!=="function"}function k(n){return Z(n)?n+"":JSON.stringify(n)}const b=()=>{const n=new Map;return{hasItem(t){return n.has(t)},getItem(t){return n.get(t)||null},setItem(t,e){n.set(t,e)},removeItem(t){n.delete(t)},getKeys(){return Array.from(n.keys())},clear(){n.clear()},dispose(){n.clear()}}},F=["hasItem","getItem","setItem","removeItem","getMeta","setMeta","removeMeta","getKeys","clear","mount","unmount"];function Q(n,t){if(t=I(t),!t)return n;const e={...n};for(const a of F)e[a]=(i="",...s)=>n[a](t+i,...s);return e.getKeys=(a="",...i)=>n.getKeys(t+a,...i).then(s=>s.map(o=>o.substr(t.length))),e}function g(n){return n?n.replace(/[/\\]/g,":").replace(/:+/g,":").replace(/^:|:$/g,""):""}function I(n){return n=g(n),n?n+":":""}function V(n={}){const t={mounts:{"":n.driver||b()},mountpoints:[""],watching:!1,watchListeners:[],unwatch:{}},e=r=>{for(const u of t.mountpoints)if(r.startsWith(u))return{relativeKey:r.substring(u.length),driver:t.mounts[u]};return{relativeKey:r,driver:t.mounts[""]}},a=(r,u)=>t.mountpoints.filter(c=>c.startsWith(r)||u&&r.startsWith(c)).map(c=>({relativeBase:r.length>c.length?r.substring(c.length):void 0,mountpoint:c,driver:t.mounts[c]})),i=(r,u)=>{if(!!t.watching){u=g(u);for(const c of t.watchListeners)c(r,u)}},s=async()=>{if(!t.watching){t.watching=!0;for(const r in t.mounts)t.unwatch[r]=await C(t.mounts[r],i,r)}},o=async()=>{if(!!t.watching){for(const r in t.unwatch)await t.unwatch[r]();t.unwatch={},t.watching=!1}},h={hasItem(r){r=g(r);const{relativeKey:u,driver:c}=e(r);return p(c.hasItem,u)},getItem(r){r=g(r);const{relativeKey:u,driver:c}=e(r);return p(c.getItem,u).then(l=>S(l))},async setItem(r,u){if(u===void 0)return h.removeItem(r);r=g(r);const{relativeKey:c,driver:l}=e(r);!l.setItem||(await p(l.setItem,c,k(u)),l.watch||i("update",r))},async removeItem(r,u=!0){r=g(r);const{relativeKey:c,driver:l}=e(r);!l.removeItem||(await p(l.removeItem,c),u&&await p(l.removeItem,c+"$"),l.watch||i("remove",r))},async getMeta(r,u){r=g(r);const{relativeKey:c,driver:l}=e(r),m=Object.create(null);if(l.getMeta&&Object.assign(m,await p(l.getMeta,c)),!u){const f=await p(l.getItem,c+"$").then(d=>S(d));f&&typeof f=="object"&&(typeof f.atime=="string"&&(f.atime=new Date(f.atime)),typeof f.mtime=="string"&&(f.mtime=new Date(f.mtime)),Object.assign(m,f))}return m},setMeta(r,u){return this.setItem(r+"$",u)},removeMeta(r){return this.removeItem(r+"$")},async getKeys(r){r=I(r);const u=a(r,!0);let c=[];const l=[];for(const m of u){const d=(await p(m.driver.getKeys,m.relativeBase)).map(y=>m.mountpoint+g(y)).filter(y=>!c.find(w=>y.startsWith(w)));l.push(...d),c=[m.mountpoint].concat(c.filter(y=>!y.startsWith(m.mountpoint)))}return r?l.filter(m=>m.startsWith(r)&&!m.endsWith("$")):l.filter(m=>!m.endsWith("$"))},async clear(r){r=I(r),await Promise.all(a(r,!1).map(async u=>{if(u.driver.clear)return p(u.driver.clear);if(u.driver.removeItem){const c=await u.driver.getKeys();return Promise.all(c.map(l=>u.driver.removeItem(l)))}}))},async dispose(){await Promise.all(Object.values(t.mounts).map(r=>x(r)))},async watch(r){return await s(),t.watchListeners.push(r),async()=>{t.watchListeners=t.watchListeners.filter(u=>u!==r),t.watchListeners.length===0&&await o()}},async unwatch(){t.watchListeners=[],await o()},mount(r,u){if(r=I(r),r&&t.mounts[r])throw new Error(`already mounted at ${r}`);return r&&(t.mountpoints.push(r),t.mountpoints.sort((c,l)=>l.length-c.length)),t.mounts[r]=u,t.watching&&Promise.resolve(C(u,i,r)).then(c=>{t.unwatch[r]=c}).catch(console.error),h},async unmount(r,u=!0){r=I(r),!(!r||!t.mounts[r])&&(t.watching&&r in t.unwatch&&(t.unwatch[r](),delete t.unwatch[r]),u&&await x(t.mounts[r]),t.mountpoints=t.mountpoints.filter(c=>c!==r),delete t.mounts[r])}};return h}function C(n,t,e){return n.watch?n.watch((a,i)=>t(a,e+i)):()=>{}}async function x(n){typeof n.dispose=="function"&&await p(n.dispose)}function X(n={}){const t=ee(e,n.operators);function e(a,i){return typeof i!="object"||i instanceof RegExp?t.$eq(a,i):Object.keys(i||{}).every(s=>{const o=i[s];if(s.startsWith("$")&&t[s]){const h=t[s];return typeof h=="function"?h(a,o):!1}return e(M(a,s),o)})}return e}function ee(n,t={}){return{$match:(e,a)=>n(e,a),$eq:(e,a)=>a instanceof RegExp?a.test(e):e===a,$ne:(e,a)=>a instanceof RegExp?!a.test(e):e!==a,$not:(e,a)=>!n(e,a),$and:(e,a)=>(E(a,"$and requires an array as condition"),a.every(i=>n(e,i))),$or:(e,a)=>(E(a,"$or requires an array as condition"),a.some(i=>n(e,i))),$in:(e,a)=>A(a).some(i=>Array.isArray(e)?n(e,{$contains:i}):n(e,i)),$contains:(e,a)=>(e=Array.isArray(e)?e:String(e),A(a).every(i=>e.includes(i))),$icontains:(e,a)=>{if(typeof a!="string")throw new TypeError("$icontains requires a string, use $contains instead");return e=String(e).toLocaleLowerCase(),A(a).every(i=>e.includes(i.toLocaleLowerCase()))},$containsAny:(e,a)=>(E(a,"$containsAny requires an array as condition"),e=Array.isArray(e)?e:String(e),a.some(i=>e.includes(i))),$exists:(e,a)=>a?typeof e<"u":typeof e>"u",$type:(e,a)=>typeof e===String(a),$regex:(e,a)=>{if(!(a instanceof RegExp)){const i=String(a).match(/\/(.*)\/([dgimsuy]*)$/);a=i?new RegExp(i[1],i[2]||""):new RegExp(a)}return a.test(String(e||""))},$lt:(e,a)=>ee<=a,$gt:(e,a)=>e>a,$gte:(e,a)=>e>=a,...t||{}}}function P(n){const t=X(),e=(i,{query:s,before:o,after:h})=>{const r=typeof s=="string"?{_path:s}:s,u=i.findIndex(l=>t(l,r));o=o||1,h=h||1;const c=new Array(o+h).fill(null,0);return u===-1?c:c.map((l,m)=>i[u-o+m+Number(m>=o)]||null)},a=[(i,s)=>i.filter(o=>A(s.where).every(h=>t(o,h))),(i,s)=>A(s.sort).forEach(o=>U(i,o)),(i,s)=>s.surround?e(i,s.surround):i,(i,s)=>s.skip?i.slice(s.skip):i,(i,s)=>s.limit?i.slice(0,s.limit):i,(i,s)=>j(z(s.without))(i),(i,s)=>j(N(s.only))(i),(i,s)=>s.first?i[0]:i];return async i=>{const s=await n();return a.reduce((o,h)=>h(o,i.params())||o,s)}}var te={exports:{}};(function(n,t){(function(e,a,i){n.exports=i(),n.exports.default=i()})("slugify",W,function(){var e=JSON.parse(`{"$":"dollar","%":"percent","&":"and","<":"less",">":"greater","|":"or","\xA2":"cent","\xA3":"pound","\xA4":"currency","\xA5":"yen","\xA9":"(c)","\xAA":"a","\xAE":"(r)","\xBA":"o","\xC0":"A","\xC1":"A","\xC2":"A","\xC3":"A","\xC4":"A","\xC5":"A","\xC6":"AE","\xC7":"C","\xC8":"E","\xC9":"E","\xCA":"E","\xCB":"E","\xCC":"I","\xCD":"I","\xCE":"I","\xCF":"I","\xD0":"D","\xD1":"N","\xD2":"O","\xD3":"O","\xD4":"O","\xD5":"O","\xD6":"O","\xD8":"O","\xD9":"U","\xDA":"U","\xDB":"U","\xDC":"U","\xDD":"Y","\xDE":"TH","\xDF":"ss","\xE0":"a","\xE1":"a","\xE2":"a","\xE3":"a","\xE4":"a","\xE5":"a","\xE6":"ae","\xE7":"c","\xE8":"e","\xE9":"e","\xEA":"e","\xEB":"e","\xEC":"i","\xED":"i","\xEE":"i","\xEF":"i","\xF0":"d","\xF1":"n","\xF2":"o","\xF3":"o","\xF4":"o","\xF5":"o","\xF6":"o","\xF8":"o","\xF9":"u","\xFA":"u","\xFB":"u","\xFC":"u","\xFD":"y","\xFE":"th","\xFF":"y","\u0100":"A","\u0101":"a","\u0102":"A","\u0103":"a","\u0104":"A","\u0105":"a","\u0106":"C","\u0107":"c","\u010C":"C","\u010D":"c","\u010E":"D","\u010F":"d","\u0110":"DJ","\u0111":"dj","\u0112":"E","\u0113":"e","\u0116":"E","\u0117":"e","\u0118":"e","\u0119":"e","\u011A":"E","\u011B":"e","\u011E":"G","\u011F":"g","\u0122":"G","\u0123":"g","\u0128":"I","\u0129":"i","\u012A":"i","\u012B":"i","\u012E":"I","\u012F":"i","\u0130":"I","\u0131":"i","\u0136":"k","\u0137":"k","\u013B":"L","\u013C":"l","\u013D":"L","\u013E":"l","\u0141":"L","\u0142":"l","\u0143":"N","\u0144":"n","\u0145":"N","\u0146":"n","\u0147":"N","\u0148":"n","\u014C":"O","\u014D":"o","\u0150":"O","\u0151":"o","\u0152":"OE","\u0153":"oe","\u0154":"R","\u0155":"r","\u0158":"R","\u0159":"r","\u015A":"S","\u015B":"s","\u015E":"S","\u015F":"s","\u0160":"S","\u0161":"s","\u0162":"T","\u0163":"t","\u0164":"T","\u0165":"t","\u0168":"U","\u0169":"u","\u016A":"u","\u016B":"u","\u016E":"U","\u016F":"u","\u0170":"U","\u0171":"u","\u0172":"U","\u0173":"u","\u0174":"W","\u0175":"w","\u0176":"Y","\u0177":"y","\u0178":"Y","\u0179":"Z","\u017A":"z","\u017B":"Z","\u017C":"z","\u017D":"Z","\u017E":"z","\u018F":"E","\u0192":"f","\u01A0":"O","\u01A1":"o","\u01AF":"U","\u01B0":"u","\u01C8":"LJ","\u01C9":"lj","\u01CB":"NJ","\u01CC":"nj","\u0218":"S","\u0219":"s","\u021A":"T","\u021B":"t","\u0259":"e","\u02DA":"o","\u0386":"A","\u0388":"E","\u0389":"H","\u038A":"I","\u038C":"O","\u038E":"Y","\u038F":"W","\u0390":"i","\u0391":"A","\u0392":"B","\u0393":"G","\u0394":"D","\u0395":"E","\u0396":"Z","\u0397":"H","\u0398":"8","\u0399":"I","\u039A":"K","\u039B":"L","\u039C":"M","\u039D":"N","\u039E":"3","\u039F":"O","\u03A0":"P","\u03A1":"R","\u03A3":"S","\u03A4":"T","\u03A5":"Y","\u03A6":"F","\u03A7":"X","\u03A8":"PS","\u03A9":"W","\u03AA":"I","\u03AB":"Y","\u03AC":"a","\u03AD":"e","\u03AE":"h","\u03AF":"i","\u03B0":"y","\u03B1":"a","\u03B2":"b","\u03B3":"g","\u03B4":"d","\u03B5":"e","\u03B6":"z","\u03B7":"h","\u03B8":"8","\u03B9":"i","\u03BA":"k","\u03BB":"l","\u03BC":"m","\u03BD":"n","\u03BE":"3","\u03BF":"o","\u03C0":"p","\u03C1":"r","\u03C2":"s","\u03C3":"s","\u03C4":"t","\u03C5":"y","\u03C6":"f","\u03C7":"x","\u03C8":"ps","\u03C9":"w","\u03CA":"i","\u03CB":"y","\u03CC":"o","\u03CD":"y","\u03CE":"w","\u0401":"Yo","\u0402":"DJ","\u0404":"Ye","\u0406":"I","\u0407":"Yi","\u0408":"J","\u0409":"LJ","\u040A":"NJ","\u040B":"C","\u040F":"DZ","\u0410":"A","\u0411":"B","\u0412":"V","\u0413":"G","\u0414":"D","\u0415":"E","\u0416":"Zh","\u0417":"Z","\u0418":"I","\u0419":"J","\u041A":"K","\u041B":"L","\u041C":"M","\u041D":"N","\u041E":"O","\u041F":"P","\u0420":"R","\u0421":"S","\u0422":"T","\u0423":"U","\u0424":"F","\u0425":"H","\u0426":"C","\u0427":"Ch","\u0428":"Sh","\u0429":"Sh","\u042A":"U","\u042B":"Y","\u042C":"","\u042D":"E","\u042E":"Yu","\u042F":"Ya","\u0430":"a","\u0431":"b","\u0432":"v","\u0433":"g","\u0434":"d","\u0435":"e","\u0436":"zh","\u0437":"z","\u0438":"i","\u0439":"j","\u043A":"k","\u043B":"l","\u043C":"m","\u043D":"n","\u043E":"o","\u043F":"p","\u0440":"r","\u0441":"s","\u0442":"t","\u0443":"u","\u0444":"f","\u0445":"h","\u0446":"c","\u0447":"ch","\u0448":"sh","\u0449":"sh","\u044A":"u","\u044B":"y","\u044C":"","\u044D":"e","\u044E":"yu","\u044F":"ya","\u0451":"yo","\u0452":"dj","\u0454":"ye","\u0456":"i","\u0457":"yi","\u0458":"j","\u0459":"lj","\u045A":"nj","\u045B":"c","\u045D":"u","\u045F":"dz","\u0490":"G","\u0491":"g","\u0492":"GH","\u0493":"gh","\u049A":"KH","\u049B":"kh","\u04A2":"NG","\u04A3":"ng","\u04AE":"UE","\u04AF":"ue","\u04B0":"U","\u04B1":"u","\u04BA":"H","\u04BB":"h","\u04D8":"AE","\u04D9":"ae","\u04E8":"OE","\u04E9":"oe","\u0531":"A","\u0532":"B","\u0533":"G","\u0534":"D","\u0535":"E","\u0536":"Z","\u0537":"E'","\u0538":"Y'","\u0539":"T'","\u053A":"JH","\u053B":"I","\u053C":"L","\u053D":"X","\u053E":"C'","\u053F":"K","\u0540":"H","\u0541":"D'","\u0542":"GH","\u0543":"TW","\u0544":"M","\u0545":"Y","\u0546":"N","\u0547":"SH","\u0549":"CH","\u054A":"P","\u054B":"J","\u054C":"R'","\u054D":"S","\u054E":"V","\u054F":"T","\u0550":"R","\u0551":"C","\u0553":"P'","\u0554":"Q'","\u0555":"O''","\u0556":"F","\u0587":"EV","\u0621":"a","\u0622":"aa","\u0623":"a","\u0624":"u","\u0625":"i","\u0626":"e","\u0627":"a","\u0628":"b","\u0629":"h","\u062A":"t","\u062B":"th","\u062C":"j","\u062D":"h","\u062E":"kh","\u062F":"d","\u0630":"th","\u0631":"r","\u0632":"z","\u0633":"s","\u0634":"sh","\u0635":"s","\u0636":"dh","\u0637":"t","\u0638":"z","\u0639":"a","\u063A":"gh","\u0641":"f","\u0642":"q","\u0643":"k","\u0644":"l","\u0645":"m","\u0646":"n","\u0647":"h","\u0648":"w","\u0649":"a","\u064A":"y","\u064B":"an","\u064C":"on","\u064D":"en","\u064E":"a","\u064F":"u","\u0650":"e","\u0652":"","\u0660":"0","\u0661":"1","\u0662":"2","\u0663":"3","\u0664":"4","\u0665":"5","\u0666":"6","\u0667":"7","\u0668":"8","\u0669":"9","\u067E":"p","\u0686":"ch","\u0698":"zh","\u06A9":"k","\u06AF":"g","\u06CC":"y","\u06F0":"0","\u06F1":"1","\u06F2":"2","\u06F3":"3","\u06F4":"4","\u06F5":"5","\u06F6":"6","\u06F7":"7","\u06F8":"8","\u06F9":"9","\u0E3F":"baht","\u10D0":"a","\u10D1":"b","\u10D2":"g","\u10D3":"d","\u10D4":"e","\u10D5":"v","\u10D6":"z","\u10D7":"t","\u10D8":"i","\u10D9":"k","\u10DA":"l","\u10DB":"m","\u10DC":"n","\u10DD":"o","\u10DE":"p","\u10DF":"zh","\u10E0":"r","\u10E1":"s","\u10E2":"t","\u10E3":"u","\u10E4":"f","\u10E5":"k","\u10E6":"gh","\u10E7":"q","\u10E8":"sh","\u10E9":"ch","\u10EA":"ts","\u10EB":"dz","\u10EC":"ts","\u10ED":"ch","\u10EE":"kh","\u10EF":"j","\u10F0":"h","\u1E62":"S","\u1E63":"s","\u1E80":"W","\u1E81":"w","\u1E82":"W","\u1E83":"w","\u1E84":"W","\u1E85":"w","\u1E9E":"SS","\u1EA0":"A","\u1EA1":"a","\u1EA2":"A","\u1EA3":"a","\u1EA4":"A","\u1EA5":"a","\u1EA6":"A","\u1EA7":"a","\u1EA8":"A","\u1EA9":"a","\u1EAA":"A","\u1EAB":"a","\u1EAC":"A","\u1EAD":"a","\u1EAE":"A","\u1EAF":"a","\u1EB0":"A","\u1EB1":"a","\u1EB2":"A","\u1EB3":"a","\u1EB4":"A","\u1EB5":"a","\u1EB6":"A","\u1EB7":"a","\u1EB8":"E","\u1EB9":"e","\u1EBA":"E","\u1EBB":"e","\u1EBC":"E","\u1EBD":"e","\u1EBE":"E","\u1EBF":"e","\u1EC0":"E","\u1EC1":"e","\u1EC2":"E","\u1EC3":"e","\u1EC4":"E","\u1EC5":"e","\u1EC6":"E","\u1EC7":"e","\u1EC8":"I","\u1EC9":"i","\u1ECA":"I","\u1ECB":"i","\u1ECC":"O","\u1ECD":"o","\u1ECE":"O","\u1ECF":"o","\u1ED0":"O","\u1ED1":"o","\u1ED2":"O","\u1ED3":"o","\u1ED4":"O","\u1ED5":"o","\u1ED6":"O","\u1ED7":"o","\u1ED8":"O","\u1ED9":"o","\u1EDA":"O","\u1EDB":"o","\u1EDC":"O","\u1EDD":"o","\u1EDE":"O","\u1EDF":"o","\u1EE0":"O","\u1EE1":"o","\u1EE2":"O","\u1EE3":"o","\u1EE4":"U","\u1EE5":"u","\u1EE6":"U","\u1EE7":"u","\u1EE8":"U","\u1EE9":"u","\u1EEA":"U","\u1EEB":"u","\u1EEC":"U","\u1EED":"u","\u1EEE":"U","\u1EEF":"u","\u1EF0":"U","\u1EF1":"u","\u1EF2":"Y","\u1EF3":"y","\u1EF4":"Y","\u1EF5":"y","\u1EF6":"Y","\u1EF7":"y","\u1EF8":"Y","\u1EF9":"y","\u2013":"-","\u2018":"'","\u2019":"'","\u201C":"\\"","\u201D":"\\"","\u201E":"\\"","\u2020":"+","\u2022":"*","\u2026":"...","\u20A0":"ecu","\u20A2":"cruzeiro","\u20A3":"french franc","\u20A4":"lira","\u20A5":"mill","\u20A6":"naira","\u20A7":"peseta","\u20A8":"rupee","\u20A9":"won","\u20AA":"new shequel","\u20AB":"dong","\u20AC":"euro","\u20AD":"kip","\u20AE":"tugrik","\u20AF":"drachma","\u20B0":"penny","\u20B1":"peso","\u20B2":"guarani","\u20B3":"austral","\u20B4":"hryvnia","\u20B5":"cedi","\u20B8":"kazakhstani tenge","\u20B9":"indian rupee","\u20BA":"turkish lira","\u20BD":"russian ruble","\u20BF":"bitcoin","\u2120":"sm","\u2122":"tm","\u2202":"d","\u2206":"delta","\u2211":"sum","\u221E":"infinity","\u2665":"love","\u5143":"yuan","\u5186":"yen","\uFDFC":"rial","\uFEF5":"laa","\uFEF7":"laa","\uFEF9":"lai","\uFEFB":"la"}`),a=JSON.parse('{"bg":{"\u0419":"Y","\u0426":"Ts","\u0429":"Sht","\u042A":"A","\u042C":"Y","\u0439":"y","\u0446":"ts","\u0449":"sht","\u044A":"a","\u044C":"y"},"de":{"\xC4":"AE","\xE4":"ae","\xD6":"OE","\xF6":"oe","\xDC":"UE","\xFC":"ue","\xDF":"ss","%":"prozent","&":"und","|":"oder","\u2211":"summe","\u221E":"unendlich","\u2665":"liebe"},"es":{"%":"por ciento","&":"y","<":"menor que",">":"mayor que","|":"o","\xA2":"centavos","\xA3":"libras","\xA4":"moneda","\u20A3":"francos","\u2211":"suma","\u221E":"infinito","\u2665":"amor"},"fr":{"%":"pourcent","&":"et","<":"plus petit",">":"plus grand","|":"ou","\xA2":"centime","\xA3":"livre","\xA4":"devise","\u20A3":"franc","\u2211":"somme","\u221E":"infini","\u2665":"amour"},"pt":{"%":"porcento","&":"e","<":"menor",">":"maior","|":"ou","\xA2":"centavo","\u2211":"soma","\xA3":"libra","\u221E":"infinito","\u2665":"amor"},"uk":{"\u0418":"Y","\u0438":"y","\u0419":"Y","\u0439":"y","\u0426":"Ts","\u0446":"ts","\u0425":"Kh","\u0445":"kh","\u0429":"Shch","\u0449":"shch","\u0413":"H","\u0433":"h"},"vi":{"\u0110":"D","\u0111":"d"},"da":{"\xD8":"OE","\xF8":"oe","\xC5":"AA","\xE5":"aa","%":"procent","&":"og","|":"eller","$":"dollar","<":"mindre end",">":"st\xF8rre end"},"nb":{"&":"og","\xC5":"AA","\xC6":"AE","\xD8":"OE","\xE5":"aa","\xE6":"ae","\xF8":"oe"},"it":{"&":"e"},"nl":{"&":"en"},"sv":{"&":"och","\xC5":"AA","\xC4":"AE","\xD6":"OE","\xE5":"aa","\xE4":"ae","\xF6":"oe"}}');function i(s,o){if(typeof s!="string")throw new Error("slugify: string argument expected");o=typeof o=="string"?{replacement:o}:o||{};var h=a[o.locale]||{},r=o.replacement===void 0?"-":o.replacement,u=o.trim===void 0?!0:o.trim,c=s.normalize().split("").reduce(function(l,m){var f=h[m]||e[m]||m;return f===r&&(f=" "),l+f.replace(o.remove||/[^\w\s$*_+~.()'"!\-:@]+/g,"")},"");return o.strict&&(c=c.replace(/[^A-Za-z0-9\s]/g,"")),u&&(c=c.trim()),c=c.replace(/\s+/g,r),o.lower&&(c=c.toLowerCase()),c}return i.extend=function(s){Object.assign(e,s)},i})})(te);const re=n=>n.split(/[\s-]/g).map(T).join(" ");function ne(n,t){const{navigation:e}=K().content,a=s=>({...ie(["title",...e.fields])(s),...se(s==null?void 0:s.navigation)?s.navigation:{}}),i=n.sort((s,o)=>s._path.localeCompare(o._path)).reduce((s,o)=>{const h=o._path.substring(1).split("/"),r=o._id.split(":").slice(1),u=!!r[r.length-1].match(/([1-9][0-9]*\.)?index.md/g),c=f=>({title:f.title,_path:f._path,_file:f._file,children:[],...a(f),...f._draft?{_draft:!0}:{}}),l=c(o);if(u){const f=t[l._path];if(typeof(f==null?void 0:f.navigation)<"u"&&!(f!=null&&f.navigation))return s;if(o._path!=="/"){const d=c(o);l.children.push(d)}Object.assign(l,a(f))}return h.length===1?(s.push(l),s):(h.slice(0,-1).reduce((f,d,y)=>{const w="/"+h.slice(0,y+1).join("/"),v=t[w];if(typeof(v==null?void 0:v.navigation)<"u"&&!v.navigation)return[];let O=f.find(Y=>Y._path===w);return O||(O={title:re(d),_path:w,_file:o._file,children:[],...a(v)},f.push(O)),O.children},s).push(l),s)},[]);return D(i)}const ae=new Intl.Collator(void 0,{numeric:!0,sensitivity:"base"});function D(n){const t=n.sort((e,a)=>ae.compare(e._file,a._file));for(const e of t)e.children.length?D(e.children):delete e.children,delete e._file;return n}function ie(n){return t=>(t=t||{},n&&n.length?n.filter(e=>typeof t[e]<"u").reduce((e,a)=>Object.assign(e,{[a]:t[a]}),{}):t)}function se(n){return Object.prototype.toString.call(n)==="[object Object]"}const oe=n=>q(n,"/api/"+K().public.content.base),ce=Q(V({driver:B()}),"@content"),L=()=>H("previewToken").value;function ue(n){async function t(){const e=new Set(await n.getKeys("cache:")),a=L();if(a){(await n.getItem(`${a}$`).then(r=>r||{})).ignoreBuiltContents&&e.clear();const o=await n.getKeys(`${a}:`),h=await Promise.all(o.map(r=>n.getItem(r)));for(const r of h)e.delete(`cache:${r._id}`),r.__deleted||e.add(`${a}:${r._id}`)}return await Promise.all(Array.from(e).map(s=>n.getItem(s)))}return{storage:n,fetch:P(t),query:e=>J(P(t),e)}}let _,$;async function le(){return $?await $:_||($=fe(),_=await $),_}async function fe(){const n=R(),{clientDB:t}=K().public.content,e=ue(ce),a=await e.storage.getItem("integrity");if(t.integrity!==+a){const{contents:i,navigation:s}=await $fetch(oe("cache.json"));await Promise.all(i.map(o=>e.storage.setItem(`cache:${o._id}`,o))),await e.storage.setItem("navigation",s),await e.storage.setItem("integrity",t.integrity)}return await n.callHook("content:storage",e.storage),e}async function me(n){const t=await le();if(!L()&&Object.keys(n||{}).length===0)return t.storage.getItem("navigation");const e=await t.query(n).where({_partial:!1,navigation:{$ne:!1}}).find(),i=(await t.query().where({_path:/\/_dir$/i,_partial:!0}).find()).reduce((s,o)=>{o.title.toLowerCase()==="dir"&&(o.title=void 0);const h=o._path.split("/").slice(0,-1).join("/")||"/";return s[h]={...o,...o.body},s},{});return ne(e,i)}export{ce as contentStorage,ue as createDB,me as generateNavigation,L as getPreview,le as useContentDatabase}; diff --git a/docs/nuxt/component.vue3.979a266c.js b/docs/nuxt/component.vue3.979a266c.js new file mode 100644 index 0000000..7ea2959 --- /dev/null +++ b/docs/nuxt/component.vue3.979a266c.js @@ -0,0 +1 @@ +import{b as a}from"./LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.module.5f1b7ee4.js";import{k as n,aj as r,o as c,c as l,w as p,r as s}from"./entry.a1162545.js";const _={name:r,props:{placeholder:String,tag:{type:String,default:"span"}}};function d(t,m,e,f,i,u){const o=a;return c(),l(o,{placeholder:e.placeholder,"placeholder-tag":e.tag},{default:p(()=>[s(t.$slots,"default")]),_:3},8,["placeholder","placeholder-tag"])}const x=n(_,[["render",d]]);export{x as default}; diff --git a/docs/nuxt/contacts.72cb390a.js b/docs/nuxt/contacts.72cb390a.js new file mode 100644 index 0000000..f8fd8da --- /dev/null +++ b/docs/nuxt/contacts.72cb390a.js @@ -0,0 +1 @@ +import{c as n,_ as a}from"./ContactInformation.23c7ad7c.js";import{k as i,o as r,e as l,f as t,h as o,T as _,t as m,i as p}from"./entry.a1162545.js";import"./IconsTelegram.783c99b0.js";import"./ContactRow.c1c5e4b6.js";import"./UiCard.30356a36.js";import"./UiCard.vue_used_vue_type_style_index_0_lang.module.a0027dfd.js";import"./ContactInformation.vue_used_vue_type_style_index_0_lang.module.80c3b839.js";import"./IconsGithub.c47cbd38.js";import"./IconsLinkedin.125a3758.js";import"./IconsSend.9f60ece7.js";const d={data(){return{contacts:n}},scrollToTop:!0,head(){return{title:"Contacts"}}},f=""+new URL("writing.6bbe30c3.svg",import.meta.url).href,u="_text_f0wic_1",$="_content_f0wic_10",g="_grid_f0wic_26",y="_contacts_f0wic_51",w="_title_f0wic_61",h="_image_f0wic_65",v={text:u,content:$,grid:g,contacts:y,title:w,image:h},C=t("b",null,"Current Location:",-1);function T(s,k,B,N,e,V){const c=a;return r(),l("article",{class:o(s.$style.content)},[t("div",{class:o(s.$style.grid)},[t("div",{class:o(s.$style.text)},[t("h1",{class:o(s.$style.title)},"Write me a letter!",2),t("div",{class:o(s.$style.location)},[C,_(" "+m(e.contacts.location),1)],2),t("div",{class:o(s.$style.contacts)},[p(c)],2)],2),t("div",null,[t("img",{src:f,alt:"",class:o(s.$style.image)},null,2)])],2)],2)}const b={$style:v},W=i(d,[["render",T],["__cssModules",b]]);export{W as default}; diff --git a/docs/nuxt/content.24233a04.js b/docs/nuxt/content.24233a04.js new file mode 100644 index 0000000..8ea68af --- /dev/null +++ b/docs/nuxt/content.24233a04.js @@ -0,0 +1 @@ +import a from"./LayoutThemeToggle.0b8ad036.js";import r from"./LayoutFooter.92ed5906.js";import{k as c,o as l,e as _,f as p,i as o,h as t,r as m}from"./entry.a1162545.js";import"./LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.module.5f1b7ee4.js";const d="_wrapper_vom09_1",f="_content_vom09_14",u="_footer_vom09_18",i="_theme_toggle_vom09_24",g={wrapper:d,content:f,footer:u,theme_toggle:i},$={head(){return{script:[{src:"https://anal.vault48.org/script.js","data-website-id":"7d587423-ffda-4732-a99d-6cf60d5c9a8a",async:!0}]}}};function h(e,v,w,k,B,L){const s=a,n=r;return l(),_("div",{class:t(e.$style.wrapper)},[p("div",{class:t(e.$style.content)},[o(s,{class:t(e.$style.theme_toggle)},null,8,["class"]),m(e.$slots,"default")],2),o(n,{class:t(e.$style.footer)},null,8,["class"])],2)}const y={$style:g},b=c($,[["render",h],["__cssModules",y]]);export{b as default}; diff --git a/docs/nuxt/default.291a94d3.js b/docs/nuxt/default.291a94d3.js new file mode 100644 index 0000000..71d8d06 --- /dev/null +++ b/docs/nuxt/default.291a94d3.js @@ -0,0 +1 @@ +import $ from"./LayoutMainMenuToggle.62cc3970.js";import T from"./LayoutMainMenu.8e9bb43b.js";import{k as M,a as B,q as P,J as L,a2 as V,y as A,a3 as k,o as C,e as E,i as p,h as r,f as u,w as H,r as I,a4 as D}from"./entry.a1162545.js";import"./LayoutMainMenuToggle.vue_used_vue_type_style_index_0_lang.module.fbcd3219.js";import"./navigation.c88a11e6.js";function O(t){if(Array.isArray(t)){for(var e=0,o=Array(t.length);e1),l=[],f=!1,g=-1,d=void 0,s=void 0,a=void 0,h=function(e){return l.some(function(o){return!!(o.options.allowTouchMove&&o.options.allowTouchMove(e))})},m=function(e){var o=e||window.event;return h(o.target)||o.touches.length>1?!0:(o.preventDefault&&o.preventDefault(),!1)},F=function(e){if(a===void 0){var o=!!e&&e.reserveScrollBarGap===!0,i=window.innerWidth-document.documentElement.clientWidth;if(o&&i>0){var n=parseInt(window.getComputedStyle(document.body).getPropertyValue("padding-right"),10);a=document.body.style.paddingRight,document.body.style.paddingRight=n+i+"px"}}d===void 0&&(d=document.body.style.overflow,document.body.style.overflow="hidden")},R=function(){a!==void 0&&(document.body.style.paddingRight=a,a=void 0),d!==void 0&&(document.body.style.overflow=d,d=void 0)},Y=function(){return window.requestAnimationFrame(function(){if(s===void 0){s={position:document.body.style.position,top:document.body.style.top,left:document.body.style.left};var e=window,o=e.scrollY,i=e.scrollX,n=e.innerHeight;document.body.style.position="fixed",document.body.style.top=-o,document.body.style.left=-i,setTimeout(function(){return window.requestAnimationFrame(function(){var v=n-window.innerHeight;v&&o>=n&&(document.body.style.top=-(o+v))})},300)}})},q=function(){if(s!==void 0){var e=-parseInt(document.body.style.top,10),o=-parseInt(document.body.style.left,10);document.body.style.position=s.position,document.body.style.top=s.top,document.body.style.left=s.left,window.scrollTo(o,e),s=void 0}},N=function(e){return e?e.scrollHeight-e.scrollTop<=e.clientHeight:!1},W=function(e,o){var i=e.targetTouches[0].clientY-g;return h(e.target)?!1:o&&o.scrollTop===0&&i>0||N(o)&&i<0?m(e):(e.stopPropagation(),!0)},z=function(e,o){if(!e){console.error("disableBodyScroll unsuccessful - targetElement must be provided when calling disableBodyScroll on IOS devices.");return}if(!l.some(function(n){return n.targetElement===e})){var i={targetElement:e,options:o||{}};l=[].concat(O(l),[i]),c?Y():F(o),c&&(e.ontouchstart=function(n){n.targetTouches.length===1&&(g=n.targetTouches[0].clientY)},e.ontouchmove=function(n){n.targetTouches.length===1&&W(n,e)},f||(document.addEventListener("touchmove",m,y?{passive:!1}:void 0),f=!0))}},J=function(){c&&(l.forEach(function(e){e.targetElement.ontouchstart=null,e.targetElement.ontouchmove=null}),f&&(document.removeEventListener("touchmove",m,y?{passive:!1}:void 0),f=!1),g=-1),c?q():R(),l=[]};const U="_grid_1ipws_1",X="_main_1ipws_17",j="_sidebar_1ipws_26",G="_active_1ipws_39",K="_menu_1ipws_45",Q="_menu_toggle_1ipws_65",Z="_shifted_1ipws_82",x="_footer_1ipws_89",ee="_content_1ipws_93",te={grid:U,main:X,sidebar:j,active:G,menu:K,menu_toggle:Q,shifted:Z,footer:x,content:ee},oe=B({setup(){const t=P(0),e=()=>{t.value=window.scrollY};return L(()=>addEventListener("scroll",e)),V(()=>removeEventListener("scroll",e)),{menuShifted:A(()=>t.value>60),scrollTop:t}},data(){return{menuVisible:!1}},methods:{toggleMenu(){this.$data.menuVisible=!this.$data.menuVisible}},watch:{$route(){!this.menuVisible||k(()=>this.toggleMenu())},menuVisible(t){t&&z(this.$refs.sidebar),J()}}});function ne(t,e,o,i,n,v){const _=$,b=T,S=D;return C(),E("div",{class:r(t.$style.grid)},[p(_,{active:t.menuVisible,class:r([t.$style.menu_toggle,{[t.$style.shifted]:t.menuShifted,[t.$style.active]:t.menuVisible}]),onClick:t.toggleMenu},null,8,["active","class","onClick"]),u("div",{class:r([t.$style.sidebar,{[t.$style.active]:t.menuVisible}]),ref:"sidebar"},[u("div",{class:r(t.$style.menu)},[p(b)],2)],2),u("div",{class:r(t.$style.main)},[u("div",{class:r(t.$style.content)},[p(S,{name:"content"},{default:H(()=>[I(t.$slots,"default")]),_:3})],2)],2)],2)}const ie={$style:te},ue=M(oe,[["render",ne],["__cssModules",ie]]);export{ue as default}; diff --git a/docs/nuxt/entry.10eae4ea.css b/docs/nuxt/entry.10eae4ea.css new file mode 100644 index 0000000..735965d --- /dev/null +++ b/docs/nuxt/entry.10eae4ea.css @@ -0,0 +1 @@ +@import"https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@600&family=Roboto:wght@400;700&display=swap";.page-enter-active,.page-leave-active{transition:all .4s}.page-enter-from,.page-leave-to{opacity:0;transform:translateY(50px)}.highlight{background-color:var(--color-highlight-background);border-radius:3px;color:var(--color-highlight-color);padding:0 1px}:root.light{--color-primary:#e84a72;--color-primary-contrast:#fff;--color-background:#fce9e4;--color-menu-background:#fbe2db;--color-line:#d9c5c5;--color-menu-overlay-background:rgba(22,22,28,.9);--color-code-background:#fbe2db;--color-code-language-background:#23252f;--color-code-language-name:#1eaeae;--color-text:#5a5d68;--color-text-secondary:#7b7d86;--color-link:#e84a72;--color-code-inline:#8931b9;--color-heading-primary:#4c5161;--color-heading-secondary:#6bb8b4;--color-heading-tertiary:#6bb8b4;--color-menu-title:#6bb8b4;--color-menu-link:#eb6481;--color-menu-link-active:#e84a72;--color-menu-line:#f9cbbe;--color-table-head:#f8ccc8;--color-rating-0:#cecece;--color-rating-1:#e4b882;--color-rating-2:#e4a882;--color-rating-3:#e49782;--color-rating-4:#e48782;--color-rating-5:#e4828d;--color-highlight-color:var(--color-text);--color-highlight-background:#fab795;--top-gradient:linear-gradient(90deg,#ee7a94,#94ee7a,#7a94ee);color-scheme:light}._list_1w161_1{margin:0;padding:0 20px}._list_1w161_1 li a{text-decoration:none}._button_15t7y_1{align-items:center;border-radius:8px;color:#fff;display:inline-flex;justify-content:center;text-decoration:none}._button_15t7y_1._variant-primary_15t7y_9{background-color:var(--color-primary)}._button_15t7y_1._variant-outline_15t7y_12{box-shadow:var(--color-text) 0 0 0 1px;color:var(--color-text);overflow:hidden;position:relative;transition:all .25s}._button_15t7y_1._variant-outline_15t7y_12:after{background:var(--color-primary);border-radius:8px;content:" ";inset:0;opacity:0;position:absolute;transform:scale(0);transition:all .25s;z-index:0}._button_15t7y_1._variant-outline_15t7y_12:hover{box-shadow:var(--color-background) 0 0 0 1px;color:var(--color-primary-contrast)}._button_15t7y_1._variant-outline_15t7y_12:hover:after{opacity:1;transform:scale(1)}._button_15t7y_1._size-md_15t7y_38{height:40px;padding:0 30px}._button_15t7y_1._size-md_15t7y_38._prefixed_15t7y_42,._button_15t7y_1._size-md_15t7y_38._suffixed_15t7y_42{padding:0 10px 0 20px}._button_15t7y_1._size-md_15t7y_38._suffixed_15t7y_42{padding-right:0 20px 0 10px}._title_15t7y_49{flex:1;position:relative;text-align:center;z-index:1}._size-md_15t7y_38._prefixed_15t7y_42 ._title_15t7y_49{padding-left:10px}._size-md_15t7y_38._suffixed_15t7y_42 ._title_15t7y_49{padding-right:10px}._prefix_15t7y_42,._suffix_15t7y_42{display:inline-flex;position:relative;z-index:2}._page-enter-active_9h226_2,._page-leave-active_9h226_3{transition:all .4s}._page-enter-from_9h226_7,._page-leave-to_9h226_8{opacity:0;transform:translateY(50px)}body,html{background:var(--color-background);color:var(--color-text);font-family:var(--family-texts);margin:0;padding:0}*{box-sizing:border-box;transition:color .25s}a{color:var(--color-link)}h1>a,h2>a,h3>a,h4>a,h5>a{color:var(--color-header);text-decoration:none}pre{border-radius:10px;line-height:1.5em;overflow:scroll;overflow:auto;padding:10px;width:100%}:not(pre)>code,pre{background-color:var(--color-code-background)}:not(pre)>code{border-radius:4px;color:var(--color-code-inline);padding:0 5px}h1,h2,h3,h4,h5{color:var(--color-header);font-family:var(--family-headings);font-weight:700}h1{color:var(--color-heading-primary);font-size:2.6rem;margin-bottom:1.5rem}h1:not(:first-child){margin-top:3rem}@media (max-width:560px){h1{font-size:2rem;line-height:2.4rem}}h2{color:var(--color-heading-secondary);font-size:2rem}h2:not(:first-child){margin-top:2rem}h3,h4,h5{color:var(--color-heading-tertiary)}li,p{line-height:1.5em}li img,p img{max-inline-size:100%}li:not(:last-child){margin-bottom:.25em}button{background:none;padding:0}button,button:focus{border:none}table{border:2px solid var(--color-line);border-collapse:collapse}table td,table th{border:1px solid var(--color-line);padding:5px 10px;text-align:left}table thead{background:var(--color-table-head);border-bottom:2px solid var(--color-line)}blockquote{border-left:3px solid var(--color-primary);color:var(--color-text);margin:0 10px;padding:0 20px}blockquote ol,blockquote ul{padding-left:15px}._highlight_9h226_139{background-color:var(--color-highlight-background);border-radius:3px;color:var(--color-highlight-color);padding:0 1px}:root{--family-headings:"Roboto Slab","Segoe UI",Tahoma,Geneva,Verdana,sans-serif;--family-texts:"Roboto","Segoe UI",Tahoma,Geneva,Verdana,sans-serif;--size-phone:$phone;--size-tablet:$size-tablet;--size-desktop:$size-desktop;--color-primary:#e84a72;--color-primary-contrast:#fff;--color-background:#16161c;--color-menu-background:#1a1c23;--color-line:#2d2f36;--color-menu-overlay-background:rgba(22,22,28,.9);--color-code-background:#1a1c23;--color-code-language-background:#23252f;--color-code-language-name:#1eaeae;--color-text:#fdf0ed;--color-text-secondary:#a3a4a7;--color-link:#e84a72;--color-code-inline:#1eb980;--color-heading-primary:#fff;--color-heading-secondary:#f9cbbe;--color-heading-tertiary:#f9cec3;--color-menu-title:#fadad1;--color-menu-link:#fab28e;--color-menu-link-active:#e84a72;--color-menu-line:#2e303e;--color-table-head:#2f212b;--color-rating-0:#333;--color-rating-1:#ded187;--color-rating-2:#dbde87;--color-rating-3:#bade87;--color-rating-4:#9cde87;--color-rating-5:#87deaa;--color-highlight-color:var(--color-text);--color-highlight-background:#254e50;--top-gradient:linear-gradient(90deg,#a93a58,#58a93a,#3a58a9);color-scheme:dark}:root._light_9h226_194{--color-primary:#e84a72;--color-primary-contrast:#fff;--color-background:#fce9e4;--color-menu-background:#fbe2db;--color-line:#d9c5c5;--color-menu-overlay-background:rgba(22,22,28,.9);--color-code-background:#fbe2db;--color-code-language-background:#23252f;--color-code-language-name:#1eaeae;--color-text:#5a5d68;--color-text-secondary:#7b7d86;--color-link:#e84a72;--color-code-inline:#8931b9;--color-heading-primary:#4c5161;--color-heading-secondary:#6bb8b4;--color-heading-tertiary:#6bb8b4;--color-menu-title:#6bb8b4;--color-menu-link:#eb6481;--color-menu-link-active:#e84a72;--color-menu-line:#f9cbbe;--color-table-head:#f8ccc8;--color-rating-0:#cecece;--color-rating-1:#e4b882;--color-rating-2:#e4a882;--color-rating-3:#e49782;--color-rating-4:#e48782;--color-rating-5:#e4828d;--color-highlight-color:var(--color-text);--color-highlight-background:#fab795;--top-gradient:linear-gradient(90deg,#ee7a94,#94ee7a,#7a94ee);color-scheme:light}._buttons_9h226_233{align-items:flex-start;display:flex;gap:16px;grid-template-columns:repeat(auto-fit,minmax(180px,auto));justify-content:flex-start}._grid_1s2ro_1{border-bottom:2px solid var(--color-line);-moz-column-gap:50px;column-gap:50px;display:grid;grid-template-columns:17fr 10fr}@media (max-width:1024px){._grid_1s2ro_1{border-bottom:none;-moz-column-gap:20px;column-gap:20px;grid-template-columns:1fr;grid-template-rows:auto auto}}._image_1s2ro_16{align-items:flex-end;display:flex}@media (max-width:1024px){._image_1s2ro_16{border-bottom:2px solid var(--color-line);justify-content:center}}._title_1s2ro_27{margin:.8rem 0}._subtitle_1s2ro_31{color:var(--color-text-secondary);max-width:600px}@media (max-width:1024px){._subtitle_1s2ro_31{max-width:100%}}._text_1s2ro_41{display:flex;flex-direction:column;justify-content:center;padding-bottom:60px}._text_1s2ro_41 b{color:var(--color-text)}@media (max-width:768px){._text_1s2ro_41{max-width:100%;padding-bottom:40px;padding-top:0;text-align:center;width:100%}}._desk_1s2ro_60{max-width:80vw}@media (max-width:1024px){._desk_1s2ro_60{max-height:50vh}}._buttons_1s2ro_69{margin-top:40px}@media (max-width:768px){._buttons_1s2ro_69{justify-content:center;margin-top:20px}}._container_192pu_1{position:relative}._container_192pu_1._secondary_192pu_4{padding:7px 2px 0}._container_192pu_1._secondary_192pu_4:before{background-color:var(--color-menu-line);bottom:13px;content:" ";left:-16px;position:absolute;top:-22px;width:1px}._container_192pu_1._secondary_192pu_4:first-child:before{top:-4px}._container_192pu_1._secondary_192pu_4:last-child:before{bottom:auto;height:40px}._row_192pu_24{padding:3px 2px;position:relative}._row_192pu_24:before{background-color:var(--color-menu-line);bottom:13px;content:" ";left:-16px;position:absolute;top:-14px;width:1px}._row_192pu_24:first-child:before{top:-4px}._row_192pu_24:last-child:before{bottom:auto;height:30px}._row_192pu_24:only-child:before{height:19px}._heading_192pu_48{align-items:center;color:var(--color-menu-title);display:flex;font-weight:600;position:relative;text-transform:uppercase}._secondary_192pu_4 ._heading_192pu_48:before{background-color:var(--color-menu-line);content:" ";height:1px;left:-17px;position:absolute;top:.6em;width:10px}._link_192pu_66{color:var(--color-menu-link);line-height:1.4em;position:relative;text-decoration:none}._link_192pu_66:before{background-color:var(--color-menu-line);content:" ";height:1px;left:-17px;position:absolute;top:.6em;width:10px}._link_192pu_66._active_192pu_81{color:var(--color-menu-link-active);font-weight:700}._children_192pu_86{margin:10px 3px;padding:0 0 0 16px;position:relative}._row_1ufrv_1{margin-bottom:10px}._main_su98q_1{margin:auto;max-width:min(1280px,100vw);padding:0 40px}@media (max-width:1024px){._main_su98q_1{padding:0 40px}}@media (max-width:768px){._main_su98q_1{padding:0 20px}}._reference_su98q_22{padding-top:20px}._grid_su98q_26{margin:40px 5px 0} diff --git a/docs/nuxt/entry.a1162545.js b/docs/nuxt/entry.a1162545.js new file mode 100644 index 0000000..b25aaed --- /dev/null +++ b/docs/nuxt/entry.a1162545.js @@ -0,0 +1,7 @@ +function No(e,t){const n=Object.create(null),r=e.split(",");for(let o=0;o!!n[o.toLowerCase()]:o=>!!n[o]}const nu="itemscope,allowfullscreen,formnovalidate,ismap,nomodule,novalidate,readonly",ru=No(nu);function jl(e){return!!e||e===""}function cn(e){if(Y(e)){const t={};for(let n=0;n{if(n){const r=n.split(su);r.length>1&&(t[r[0].trim()]=r[1].trim())}}),t}function dt(e){let t="";if(we(e))t=e;else if(Y(e))for(let n=0;nwe(e)?e:e==null?"":Y(e)||he(e)&&(e.toString===ql||!X(e.toString))?JSON.stringify(e,Fl,2):String(e),Fl=(e,t)=>t&&t.__v_isRef?Fl(e,t.value):rn(t)?{[`Map(${t.size})`]:[...t.entries()].reduce((n,[r,o])=>(n[`${r} =>`]=o,n),{})}:Ul(t)?{[`Set(${t.size})`]:[...t.values()]}:he(t)&&!Y(t)&&!Kl(t)?String(t):t,de={},nn=[],Ze=()=>{},iu=()=>!1,au=/^on[^a-z]/,Wn=e=>au.test(e),jo=e=>e.startsWith("onUpdate:"),Se=Object.assign,Fo=(e,t)=>{const n=e.indexOf(t);n>-1&&e.splice(n,1)},uu=Object.prototype.hasOwnProperty,re=(e,t)=>uu.call(e,t),Y=Array.isArray,rn=e=>xr(e)==="[object Map]",Ul=e=>xr(e)==="[object Set]",X=e=>typeof e=="function",we=e=>typeof e=="string",Uo=e=>typeof e=="symbol",he=e=>e!==null&&typeof e=="object",qo=e=>he(e)&&X(e.then)&&X(e.catch),ql=Object.prototype.toString,xr=e=>ql.call(e),cu=e=>xr(e).slice(8,-1),Kl=e=>xr(e)==="[object Object]",Ko=e=>we(e)&&e!=="NaN"&&e[0]!=="-"&&""+parseInt(e,10)===e,Mn=No(",key,ref,ref_for,ref_key,onVnodeBeforeMount,onVnodeMounted,onVnodeBeforeUpdate,onVnodeUpdated,onVnodeBeforeUnmount,onVnodeUnmounted"),Rr=e=>{const t=Object.create(null);return n=>t[n]||(t[n]=e(n))},fu=/-(\w)/g,it=Rr(e=>e.replace(fu,(t,n)=>n?n.toUpperCase():"")),du=/\B([A-Z])/g,_n=Rr(e=>e.replace(du,"-$1").toLowerCase()),Pr=Rr(e=>e.charAt(0).toUpperCase()+e.slice(1)),Ur=Rr(e=>e?`on${Pr(e)}`:""),Fn=(e,t)=>!Object.is(e,t),Dn=(e,t)=>{for(let n=0;n{Object.defineProperty(e,t,{configurable:!0,enumerable:!1,value:n})},Vo=e=>{const t=parseFloat(e);return isNaN(t)?e:t};let bs;const pu=()=>bs||(bs=typeof globalThis<"u"?globalThis:typeof self<"u"?self:typeof window<"u"?window:typeof global<"u"?global:{});let rt;class hu{constructor(t=!1){this.detached=t,this.active=!0,this.effects=[],this.cleanups=[],this.parent=rt,!t&&rt&&(this.index=(rt.scopes||(rt.scopes=[])).push(this)-1)}run(t){if(this.active){const n=rt;try{return rt=this,t()}finally{rt=n}}}on(){rt=this}off(){rt=this.parent}stop(t){if(this.active){let n,r;for(n=0,r=this.effects.length;n{const t=new Set(e);return t.w=0,t.n=0,t},Vl=e=>(e.w&Tt)>0,zl=e=>(e.n&Tt)>0,mu=({deps:e})=>{if(e.length)for(let t=0;t{const{deps:t}=e;if(t.length){let n=0;for(let r=0;r{(u==="length"||u>=r)&&i.push(a)});else switch(n!==void 0&&i.push(l.get(n)),t){case"add":Y(e)?Ko(n)&&i.push(l.get("length")):(i.push(l.get(Vt)),rn(e)&&i.push(l.get(co)));break;case"delete":Y(e)||(i.push(l.get(Vt)),rn(e)&&i.push(l.get(co)));break;case"set":rn(e)&&i.push(l.get(Vt));break}if(i.length===1)i[0]&&fo(i[0]);else{const a=[];for(const u of i)u&&a.push(...u);fo(zo(a))}}function fo(e,t){const n=Y(e)?e:[...e];for(const r of n)r.computed&&Es(r);for(const r of n)r.computed||Es(r)}function Es(e,t){(e!==Xe||e.allowRecurse)&&(e.scheduler?e.scheduler():e.run())}const _u=No("__proto__,__v_isRef,__isVue"),Ql=new Set(Object.getOwnPropertyNames(Symbol).filter(e=>e!=="arguments"&&e!=="caller").map(e=>Symbol[e]).filter(Uo)),vu=Yo(),bu=Yo(!1,!0),wu=Yo(!0),Cs=Eu();function Eu(){const e={};return["includes","indexOf","lastIndexOf"].forEach(t=>{e[t]=function(...n){const r=le(this);for(let s=0,l=this.length;s{e[t]=function(...n){vn();const r=le(this)[t].apply(this,n);return bn(),r}}),e}function Yo(e=!1,t=!1){return function(r,o,s){if(o==="__v_isReactive")return!e;if(o==="__v_isReadonly")return e;if(o==="__v_isShallow")return t;if(o==="__v_raw"&&s===(e?t?Hu:ei:t?Gl:Zl).get(r))return r;const l=Y(r);if(!e&&l&&re(Cs,o))return Reflect.get(Cs,o,s);const i=Reflect.get(r,o,s);return(Uo(o)?Ql.has(o):_u(o))||(e||Fe(r,"get",o),t)?i:Re(i)?l&&Ko(o)?i:i.value:he(i)?e?ti(i):et(i):i}}const Cu=Jl(),xu=Jl(!0);function Jl(e=!1){return function(n,r,o,s){let l=n[r];if(fn(l)&&Re(l)&&!Re(o))return!1;if(!e&&(!fr(o)&&!fn(o)&&(l=le(l),o=le(o)),!Y(n)&&Re(l)&&!Re(o)))return l.value=o,!0;const i=Y(n)&&Ko(r)?Number(r)e,kr=e=>Reflect.getPrototypeOf(e);function Gn(e,t,n=!1,r=!1){e=e.__v_raw;const o=le(e),s=le(t);n||(t!==s&&Fe(o,"get",t),Fe(o,"get",s));const{has:l}=kr(o),i=r?Qo:n?Zo:Un;if(l.call(o,t))return i(e.get(t));if(l.call(o,s))return i(e.get(s));e!==o&&e.get(t)}function er(e,t=!1){const n=this.__v_raw,r=le(n),o=le(e);return t||(e!==o&&Fe(r,"has",e),Fe(r,"has",o)),e===o?n.has(e):n.has(e)||n.has(o)}function tr(e,t=!1){return e=e.__v_raw,!t&&Fe(le(e),"iterate",Vt),Reflect.get(e,"size",e)}function xs(e){e=le(e);const t=le(this);return kr(t).has.call(t,e)||(t.add(e),pt(t,"add",e,e)),this}function Rs(e,t){t=le(t);const n=le(this),{has:r,get:o}=kr(n);let s=r.call(n,e);s||(e=le(e),s=r.call(n,e));const l=o.call(n,e);return n.set(e,t),s?Fn(t,l)&&pt(n,"set",e,t):pt(n,"add",e,t),this}function Ps(e){const t=le(this),{has:n,get:r}=kr(t);let o=n.call(t,e);o||(e=le(e),o=n.call(t,e)),r&&r.call(t,e);const s=t.delete(e);return o&&pt(t,"delete",e,void 0),s}function ks(){const e=le(this),t=e.size!==0,n=e.clear();return t&&pt(e,"clear",void 0,void 0),n}function nr(e,t){return function(r,o){const s=this,l=s.__v_raw,i=le(l),a=t?Qo:e?Zo:Un;return!e&&Fe(i,"iterate",Vt),l.forEach((u,c)=>r.call(o,a(u),a(c),s))}}function rr(e,t,n){return function(...r){const o=this.__v_raw,s=le(o),l=rn(s),i=e==="entries"||e===Symbol.iterator&&l,a=e==="keys"&&l,u=o[e](...r),c=n?Qo:t?Zo:Un;return!t&&Fe(s,"iterate",a?co:Vt),{next(){const{value:f,done:p}=u.next();return p?{value:f,done:p}:{value:i?[c(f[0]),c(f[1])]:c(f),done:p}},[Symbol.iterator](){return this}}}}function _t(e){return function(...t){return e==="delete"?!1:this}}function Tu(){const e={get(s){return Gn(this,s)},get size(){return tr(this)},has:er,add:xs,set:Rs,delete:Ps,clear:ks,forEach:nr(!1,!1)},t={get(s){return Gn(this,s,!1,!0)},get size(){return tr(this)},has:er,add:xs,set:Rs,delete:Ps,clear:ks,forEach:nr(!1,!0)},n={get(s){return Gn(this,s,!0)},get size(){return tr(this,!0)},has(s){return er.call(this,s,!0)},add:_t("add"),set:_t("set"),delete:_t("delete"),clear:_t("clear"),forEach:nr(!0,!1)},r={get(s){return Gn(this,s,!0,!0)},get size(){return tr(this,!0)},has(s){return er.call(this,s,!0)},add:_t("add"),set:_t("set"),delete:_t("delete"),clear:_t("clear"),forEach:nr(!0,!0)};return["keys","values","entries",Symbol.iterator].forEach(s=>{e[s]=rr(s,!1,!1),n[s]=rr(s,!0,!1),t[s]=rr(s,!1,!0),r[s]=rr(s,!0,!0)}),[e,n,t,r]}const[Ou,Lu,Mu,Du]=Tu();function Jo(e,t){const n=t?e?Du:Mu:e?Lu:Ou;return(r,o,s)=>o==="__v_isReactive"?!e:o==="__v_isReadonly"?e:o==="__v_raw"?r:Reflect.get(re(n,o)&&o in r?n:r,o,s)}const Iu={get:Jo(!1,!1)},$u={get:Jo(!1,!0)},Bu={get:Jo(!0,!1)},Zl=new WeakMap,Gl=new WeakMap,ei=new WeakMap,Hu=new WeakMap;function Nu(e){switch(e){case"Object":case"Array":return 1;case"Map":case"Set":case"WeakMap":case"WeakSet":return 2;default:return 0}}function ju(e){return e.__v_skip||!Object.isExtensible(e)?0:Nu(cu(e))}function et(e){return fn(e)?e:Xo(e,!1,Xl,Iu,Zl)}function Fu(e){return Xo(e,!1,Au,$u,Gl)}function ti(e){return Xo(e,!0,Su,Bu,ei)}function Xo(e,t,n,r,o){if(!he(e)||e.__v_raw&&!(t&&e.__v_isReactive))return e;const s=o.get(e);if(s)return s;const l=ju(e);if(l===0)return e;const i=new Proxy(e,l===2?r:n);return o.set(e,i),i}function on(e){return fn(e)?on(e.__v_raw):!!(e&&e.__v_isReactive)}function fn(e){return!!(e&&e.__v_isReadonly)}function fr(e){return!!(e&&e.__v_isShallow)}function ni(e){return on(e)||fn(e)}function le(e){const t=e&&e.__v_raw;return t?le(t):e}function ri(e){return cr(e,"__v_skip",!0),e}const Un=e=>he(e)?et(e):e,Zo=e=>he(e)?ti(e):e;function oi(e){kt&&Xe&&(e=le(e),Yl(e.dep||(e.dep=zo())))}function si(e,t){e=le(e),e.dep&&fo(e.dep)}function Re(e){return!!(e&&e.__v_isRef===!0)}function Ve(e){return li(e,!1)}function po(e){return li(e,!0)}function li(e,t){return Re(e)?e:new Uu(e,t)}class Uu{constructor(t,n){this.__v_isShallow=n,this.dep=void 0,this.__v_isRef=!0,this._rawValue=n?t:le(t),this._value=n?t:Un(t)}get value(){return oi(this),this._value}set value(t){const n=this.__v_isShallow||fr(t)||fn(t);t=n?t:le(t),Fn(t,this._rawValue)&&(this._rawValue=t,this._value=n?t:Un(t),si(this))}}function be(e){return Re(e)?e.value:e}const qu={get:(e,t,n)=>be(Reflect.get(e,t,n)),set:(e,t,n,r)=>{const o=e[t];return Re(o)&&!Re(n)?(o.value=n,!0):Reflect.set(e,t,n,r)}};function ii(e){return on(e)?e:new Proxy(e,qu)}function ai(e){const t=Y(e)?new Array(e.length):{};for(const n in e)t[n]=Go(e,n);return t}class Ku{constructor(t,n,r){this._object=t,this._key=n,this._defaultValue=r,this.__v_isRef=!0}get value(){const t=this._object[this._key];return t===void 0?this._defaultValue:t}set value(t){this._object[this._key]=t}}function Go(e,t,n){const r=e[t];return Re(r)?r:new Ku(e,t,n)}var ui;class Vu{constructor(t,n,r,o){this._setter=n,this.dep=void 0,this.__v_isRef=!0,this[ui]=!1,this._dirty=!0,this.effect=new Wo(t,()=>{this._dirty||(this._dirty=!0,si(this))}),this.effect.computed=this,this.effect.active=this._cacheable=!o,this.__v_isReadonly=r}get value(){const t=le(this);return oi(t),(t._dirty||!t._cacheable)&&(t._dirty=!1,t._value=t.effect.run()),t._value}set value(t){this._setter(t)}}ui="__v_isReadonly";function zu(e,t,n=!1){let r,o;const s=X(e);return s?(r=e,o=Ze):(r=e.get,o=e.set),new Vu(r,o,s||!o,n)}function St(e,t,n,r){let o;try{o=r?e(...r):e()}catch(s){wn(s,t,n)}return o}function ze(e,t,n,r){if(X(e)){const s=St(e,t,n,r);return s&&qo(s)&&s.catch(l=>{wn(l,t,n)}),s}const o=[];for(let s=0;s>>1;Kn(Te[r])st&&Te.splice(t,1)}function di(e){Y(e)?sn.push(...e):(!ft||!ft.includes(e,e.allowRecurse?qt+1:qt))&&sn.push(e),fi()}function Ss(e,t=qn?st+1:0){for(;tKn(n)-Kn(r)),qt=0;qte.id==null?1/0:e.id,Ju=(e,t)=>{const n=Kn(e)-Kn(t);if(n===0){if(e.pre&&!t.pre)return-1;if(t.pre&&!e.pre)return 1}return n};function pi(e){ho=!1,qn=!0,Te.sort(Ju);const t=Ze;try{for(st=0;stg.trim())),f&&(o=n.map(Vo))}let i,a=r[i=Ur(t)]||r[i=Ur(it(t))];!a&&s&&(a=r[i=Ur(_n(t))]),a&&ze(a,e,6,o);const u=r[i+"Once"];if(u){if(!e.emitted)e.emitted={};else if(e.emitted[i])return;e.emitted[i]=!0,ze(u,e,6,o)}}function hi(e,t,n=!1){const r=t.emitsCache,o=r.get(e);if(o!==void 0)return o;const s=e.emits;let l={},i=!1;if(!X(e)){const a=u=>{const c=hi(u,t,!0);c&&(i=!0,Se(l,c))};!n&&t.mixins.length&&t.mixins.forEach(a),e.extends&&a(e.extends),e.mixins&&e.mixins.forEach(a)}return!s&&!i?(he(e)&&r.set(e,null),null):(Y(s)?s.forEach(a=>l[a]=null):Se(l,s),he(e)&&r.set(e,l),l)}function Ar(e,t){return!e||!Wn(t)?!1:(t=t.slice(2).replace(/Once$/,""),re(e,t[0].toLowerCase()+t.slice(1))||re(e,_n(t))||re(e,t))}let De=null,Tr=null;function pr(e){const t=De;return De=e,Tr=e&&e.type.__scopeId||null,t}function Om(e){Tr=e}function Lm(){Tr=null}function Or(e,t=De,n){if(!t||e._n)return e;const r=(...o)=>{r._d&&js(-1);const s=pr(t);let l;try{l=e(...o)}finally{pr(s),r._d&&js(1)}return l};return r._n=!0,r._c=!0,r._d=!0,r}function qr(e){const{type:t,vnode:n,proxy:r,withProxy:o,props:s,propsOptions:[l],slots:i,attrs:a,emit:u,render:c,renderCache:f,data:p,setupState:g,ctx:_,inheritAttrs:C}=e;let R,y;const h=pr(e);try{if(n.shapeFlag&4){const w=o||r;R=qe(c.call(w,w,f,s,g,p,_)),y=a}else{const w=t;R=qe(w.length>1?w(s,{attrs:a,slots:i,emit:u}):w(s,null)),y=t.props?a:Gu(a)}}catch(w){$n.length=0,wn(w,e,1),R=ge(Ie)}let v=R;if(y&&C!==!1){const w=Object.keys(y),{shapeFlag:T}=v;w.length&&T&7&&(l&&w.some(jo)&&(y=ec(y,l)),v=gt(v,y))}return n.dirs&&(v=gt(v),v.dirs=v.dirs?v.dirs.concat(n.dirs):n.dirs),n.transition&&(v.transition=n.transition),R=v,pr(h),R}function Zu(e){let t;for(let n=0;n{let t;for(const n in e)(n==="class"||n==="style"||Wn(n))&&((t||(t={}))[n]=e[n]);return t},ec=(e,t)=>{const n={};for(const r in e)(!jo(r)||!(r.slice(9)in t))&&(n[r]=e[r]);return n};function tc(e,t,n){const{props:r,children:o,component:s}=e,{props:l,children:i,patchFlag:a}=t,u=s.emitsOptions;if(t.dirs||t.transition)return!0;if(n&&a>=0){if(a&1024)return!0;if(a&16)return r?As(r,l,u):!!l;if(a&8){const c=t.dynamicProps;for(let f=0;fe.__isSuspense,nc={name:"Suspense",__isSuspense:!0,process(e,t,n,r,o,s,l,i,a,u){e==null?rc(t,n,r,o,s,l,i,a,u):oc(e,t,n,r,o,l,i,a,u)},hydrate:sc,create:ns,normalize:lc},mi=nc;function Vn(e,t){const n=e.props&&e.props[t];X(n)&&n()}function rc(e,t,n,r,o,s,l,i,a){const{p:u,o:{createElement:c}}=a,f=c("div"),p=e.suspense=ns(e,o,r,t,f,n,s,l,i,a);u(null,p.pendingBranch=e.ssContent,f,null,r,p,s,l),p.deps>0?(Vn(e,"onPending"),Vn(e,"onFallback"),u(null,e.ssFallback,t,n,r,null,s,l),ln(p,e.ssFallback)):p.resolve()}function oc(e,t,n,r,o,s,l,i,{p:a,um:u,o:{createElement:c}}){const f=t.suspense=e.suspense;f.vnode=t,t.el=e.el;const p=t.ssContent,g=t.ssFallback,{activeBranch:_,pendingBranch:C,isInFallback:R,isHydrating:y}=f;if(C)f.pendingBranch=p,lt(p,C)?(a(C,p,f.hiddenContainer,null,o,f,s,l,i),f.deps<=0?f.resolve():R&&(a(_,g,n,r,o,null,s,l,i),ln(f,g))):(f.pendingId++,y?(f.isHydrating=!1,f.activeBranch=C):u(C,o,f),f.deps=0,f.effects.length=0,f.hiddenContainer=c("div"),R?(a(null,p,f.hiddenContainer,null,o,f,s,l,i),f.deps<=0?f.resolve():(a(_,g,n,r,o,null,s,l,i),ln(f,g))):_&<(p,_)?(a(_,p,n,r,o,f,s,l,i),f.resolve(!0)):(a(null,p,f.hiddenContainer,null,o,f,s,l,i),f.deps<=0&&f.resolve()));else if(_&<(p,_))a(_,p,n,r,o,f,s,l,i),ln(f,p);else if(Vn(t,"onPending"),f.pendingBranch=p,f.pendingId++,a(null,p,f.hiddenContainer,null,o,f,s,l,i),f.deps<=0)f.resolve();else{const{timeout:h,pendingId:v}=f;h>0?setTimeout(()=>{f.pendingId===v&&f.fallback(g)},h):h===0&&f.fallback(g)}}function ns(e,t,n,r,o,s,l,i,a,u,c=!1){const{p:f,m:p,um:g,n:_,o:{parentNode:C,remove:R}}=u,y=Vo(e.props&&e.props.timeout),h={vnode:e,parent:t,parentComponent:n,isSVG:l,container:r,hiddenContainer:o,anchor:s,deps:0,pendingId:0,timeout:typeof y=="number"?y:-1,activeBranch:null,pendingBranch:null,isInFallback:!0,isHydrating:c,isUnmounted:!1,effects:[],resolve(v=!1){const{vnode:w,activeBranch:T,pendingBranch:O,pendingId:I,effects:k,parentComponent:U,container:F}=h;if(h.isHydrating)h.isHydrating=!1;else if(!v){const Z=T&&O.transition&&O.transition.mode==="out-in";Z&&(T.transition.afterLeave=()=>{I===h.pendingId&&p(O,F,j,0)});let{anchor:j}=h;T&&(j=_(T),g(T,U,h,!0)),Z||p(O,F,j,0)}ln(h,O),h.pendingBranch=null,h.isInFallback=!1;let W=h.parent,H=!1;for(;W;){if(W.pendingBranch){W.effects.push(...k),H=!0;break}W=W.parent}H||di(k),h.effects=[],Vn(w,"onResolve")},fallback(v){if(!h.pendingBranch)return;const{vnode:w,activeBranch:T,parentComponent:O,container:I,isSVG:k}=h;Vn(w,"onFallback");const U=_(T),F=()=>{!h.isInFallback||(f(null,v,I,U,O,null,k,i,a),ln(h,v))},W=v.transition&&v.transition.mode==="out-in";W&&(T.transition.afterLeave=F),h.isInFallback=!0,g(T,O,null,!0),W||F()},move(v,w,T){h.activeBranch&&p(h.activeBranch,v,w,T),h.container=v},next(){return h.activeBranch&&_(h.activeBranch)},registerDep(v,w){const T=!!h.pendingBranch;T&&h.deps++;const O=v.vnode.el;v.asyncDep.catch(I=>{wn(I,v,0)}).then(I=>{if(v.isUnmounted||h.isUnmounted||h.pendingId!==v.suspenseId)return;v.asyncResolved=!0;const{vnode:k}=v;wo(v,I,!1),O&&(k.el=O);const U=!O&&v.subTree.el;w(v,k,C(O||v.subTree.el),O?null:_(v.subTree),h,l,a),U&&R(U),ts(v,k.el),T&&--h.deps===0&&h.resolve()})},unmount(v,w){h.isUnmounted=!0,h.activeBranch&&g(h.activeBranch,n,v,w),h.pendingBranch&&g(h.pendingBranch,n,v,w)}};return h}function sc(e,t,n,r,o,s,l,i,a){const u=t.suspense=ns(t,r,n,e.parentNode,document.createElement("div"),null,o,s,l,i,!0),c=a(e,u.pendingBranch=t.ssContent,n,u,s,l);return u.deps===0&&u.resolve(),c}function lc(e){const{shapeFlag:t,children:n}=e,r=t&32;e.ssContent=Ts(r?n.default:n),e.ssFallback=r?Ts(n.fallback):ge(Ie)}function Ts(e){let t;if(X(e)){const n=dn&&e._c;n&&(e._d=!1,Oe()),e=e(),n&&(e._d=!0,t=Ke,Bi())}return Y(e)&&(e=Zu(e)),e=qe(e),t&&!e.dynamicChildren&&(e.dynamicChildren=t.filter(n=>n!==e)),e}function yi(e,t){t&&t.pendingBranch?Y(e)?t.effects.push(...e):t.effects.push(e):di(e)}function ln(e,t){e.activeBranch=t;const{vnode:n,parentComponent:r}=e,o=n.el=t.el;r&&r.subTree===n&&(r.vnode.el=o,ts(r,o))}function an(e,t){if(Ee){let n=Ee.provides;const r=Ee.parent&&Ee.parent.provides;r===n&&(n=Ee.provides=Object.create(r)),n[e]=t}}function Ge(e,t,n=!1){const r=Ee||De;if(r){const o=r.parent==null?r.vnode.appContext&&r.vnode.appContext.provides:r.parent.provides;if(o&&e in o)return o[e];if(arguments.length>1)return n&&X(t)?t.call(r.proxy):t}}function ic(e,t){return rs(e,null,t)}const Os={};function je(e,t,n){return rs(e,t,n)}function rs(e,t,{immediate:n,deep:r,flush:o,onTrack:s,onTrigger:l}=de){const i=Ee;let a,u=!1,c=!1;if(Re(e)?(a=()=>e.value,u=fr(e)):on(e)?(a=()=>e,r=!0):Y(e)?(c=!0,u=e.some(y=>on(y)||fr(y)),a=()=>e.map(y=>{if(Re(y))return y.value;if(on(y))return tn(y);if(X(y))return St(y,i,2)})):X(e)?t?a=()=>St(e,i,2):a=()=>{if(!(i&&i.isUnmounted))return f&&f(),ze(e,i,3,[p])}:a=Ze,t&&r){const y=a;a=()=>tn(y())}let f,p=y=>{f=R.onStop=()=>{St(y,i,4)}};if(hn)return p=Ze,t?n&&ze(t,i,3,[a(),c?[]:void 0,p]):a(),Ze;let g=c?[]:Os;const _=()=>{if(!!R.active)if(t){const y=R.run();(r||u||(c?y.some((h,v)=>Fn(h,g[v])):Fn(y,g)))&&(f&&f(),ze(t,i,3,[y,g===Os?void 0:g,p]),g=y)}else R.run()};_.allowRecurse=!!t;let C;o==="sync"?C=_:o==="post"?C=()=>Pe(_,i&&i.suspense):(_.pre=!0,i&&(_.id=i.uid),C=()=>Sr(_));const R=new Wo(a,C);return t?n?_():g=R.run():o==="post"?Pe(R.run.bind(R),i&&i.suspense):R.run(),()=>{R.stop(),i&&i.scope&&Fo(i.scope.effects,R)}}function ac(e,t,n){const r=this.proxy,o=we(e)?e.includes(".")?_i(r,e):()=>r[e]:e.bind(r,r);let s;X(t)?s=t:(s=t.handler,n=t);const l=Ee;Ot(this);const i=rs(o,s.bind(r),n);return l?Ot(l):At(),i}function _i(e,t){const n=t.split(".");return()=>{let r=e;for(let o=0;o{tn(n,t)});else if(Kl(e))for(const n in e)tn(e[n],t);return e}function uc(){const e={isMounted:!1,isLeaving:!1,isUnmounting:!1,leavingVNodes:new Map};return Qn(()=>{e.isMounted=!0}),Cn(()=>{e.isUnmounting=!0}),e}const Ue=[Function,Array],cc={name:"BaseTransition",props:{mode:String,appear:Boolean,persisted:Boolean,onBeforeEnter:Ue,onEnter:Ue,onAfterEnter:Ue,onEnterCancelled:Ue,onBeforeLeave:Ue,onLeave:Ue,onAfterLeave:Ue,onLeaveCancelled:Ue,onBeforeAppear:Ue,onAppear:Ue,onAfterAppear:Ue,onAppearCancelled:Ue},setup(e,{slots:t}){const n=yt(),r=uc();let o;return()=>{const s=t.default&&wi(t.default(),!0);if(!s||!s.length)return;let l=s[0];if(s.length>1){for(const C of s)if(C.type!==Ie){l=C;break}}const i=le(e),{mode:a}=i;if(r.isLeaving)return Kr(l);const u=Ls(l);if(!u)return Kr(l);const c=go(u,i,r,n);hr(u,c);const f=n.subTree,p=f&&Ls(f);let g=!1;const{getTransitionKey:_}=u.type;if(_){const C=_();o===void 0?o=C:C!==o&&(o=C,g=!0)}if(p&&p.type!==Ie&&(!lt(u,p)||g)){const C=go(p,i,r,n);if(hr(p,C),a==="out-in")return r.isLeaving=!0,C.afterLeave=()=>{r.isLeaving=!1,n.update()},Kr(l);a==="in-out"&&u.type!==Ie&&(C.delayLeave=(R,y,h)=>{const v=bi(r,p);v[String(p.key)]=p,R._leaveCb=()=>{y(),R._leaveCb=void 0,delete c.delayedLeave},c.delayedLeave=h})}return l}}},vi=cc;function bi(e,t){const{leavingVNodes:n}=e;let r=n.get(t.type);return r||(r=Object.create(null),n.set(t.type,r)),r}function go(e,t,n,r){const{appear:o,mode:s,persisted:l=!1,onBeforeEnter:i,onEnter:a,onAfterEnter:u,onEnterCancelled:c,onBeforeLeave:f,onLeave:p,onAfterLeave:g,onLeaveCancelled:_,onBeforeAppear:C,onAppear:R,onAfterAppear:y,onAppearCancelled:h}=t,v=String(e.key),w=bi(n,e),T=(k,U)=>{k&&ze(k,r,9,U)},O=(k,U)=>{const F=U[1];T(k,U),Y(k)?k.every(W=>W.length<=1)&&F():k.length<=1&&F()},I={mode:s,persisted:l,beforeEnter(k){let U=i;if(!n.isMounted)if(o)U=C||i;else return;k._leaveCb&&k._leaveCb(!0);const F=w[v];F&<(e,F)&&F.el._leaveCb&&F.el._leaveCb(),T(U,[k])},enter(k){let U=a,F=u,W=c;if(!n.isMounted)if(o)U=R||a,F=y||u,W=h||c;else return;let H=!1;const Z=k._enterCb=j=>{H||(H=!0,j?T(W,[k]):T(F,[k]),I.delayedLeave&&I.delayedLeave(),k._enterCb=void 0)};U?O(U,[k,Z]):Z()},leave(k,U){const F=String(e.key);if(k._enterCb&&k._enterCb(!0),n.isUnmounting)return U();T(f,[k]);let W=!1;const H=k._leaveCb=Z=>{W||(W=!0,U(),Z?T(_,[k]):T(g,[k]),k._leaveCb=void 0,w[F]===e&&delete w[F])};w[F]=e,p?O(p,[k,H]):H()},clone(k){return go(k,t,n,r)}};return I}function Kr(e){if(Yn(e))return e=gt(e),e.children=null,e}function Ls(e){return Yn(e)?e.children?e.children[0]:void 0:e}function hr(e,t){e.shapeFlag&6&&e.component?hr(e.component.subTree,t):e.shapeFlag&128?(e.ssContent.transition=t.clone(e.ssContent),e.ssFallback.transition=t.clone(e.ssFallback)):e.transition=t}function wi(e,t=!1,n){let r=[],o=0;for(let s=0;s1)for(let s=0;s!!e.type.__asyncLoader;function ne(e){X(e)&&(e={loader:e});const{loader:t,loadingComponent:n,errorComponent:r,delay:o=200,timeout:s,suspensible:l=!0,onError:i}=e;let a=null,u,c=0;const f=()=>(c++,a=null,p()),p=()=>{let g;return a||(g=a=t().catch(_=>{if(_=_ instanceof Error?_:new Error(String(_)),i)return new Promise((C,R)=>{i(_,()=>C(f()),()=>R(_),c+1)});throw _}).then(_=>g!==a&&a?a:(_&&(_.__esModule||_[Symbol.toStringTag]==="Module")&&(_=_.default),u=_,_)))};return Le({name:"AsyncComponentWrapper",__asyncLoader:p,get __asyncResolved(){return u},setup(){const g=Ee;if(u)return()=>Vr(u,g);const _=h=>{a=null,wn(h,g,13,!r)};if(l&&g.suspense||hn)return p().then(h=>()=>Vr(h,g)).catch(h=>(_(h),()=>r?ge(r,{error:h}):null));const C=Ve(!1),R=Ve(),y=Ve(!!o);return o&&setTimeout(()=>{y.value=!1},o),s!=null&&setTimeout(()=>{if(!C.value&&!R.value){const h=new Error(`Async component timed out after ${s}ms.`);_(h),R.value=h}},s),p().then(()=>{C.value=!0,g.parent&&Yn(g.parent.vnode)&&Sr(g.parent.update)}).catch(h=>{_(h),R.value=h}),()=>{if(C.value&&u)return Vr(u,g);if(R.value&&r)return ge(r,{error:R.value});if(n&&!y.value)return ge(n)}}})}function Vr(e,{vnode:{ref:t,props:n,children:r,shapeFlag:o},parent:s}){const l=ge(e,n,r);return l.ref=t,l}const Yn=e=>e.type.__isKeepAlive,fc={name:"KeepAlive",__isKeepAlive:!0,props:{include:[String,RegExp,Array],exclude:[String,RegExp,Array],max:[String,Number]},setup(e,{slots:t}){const n=yt(),r=n.ctx;if(!r.renderer)return()=>{const h=t.default&&t.default();return h&&h.length===1?h[0]:h};const o=new Map,s=new Set;let l=null;const i=n.suspense,{renderer:{p:a,m:u,um:c,o:{createElement:f}}}=r,p=f("div");r.activate=(h,v,w,T,O)=>{const I=h.component;u(h,v,w,0,i),a(I.vnode,h,v,w,I,i,T,h.slotScopeIds,O),Pe(()=>{I.isDeactivated=!1,I.a&&Dn(I.a);const k=h.props&&h.props.onVnodeMounted;k&&Be(k,I.parent,h)},i)},r.deactivate=h=>{const v=h.component;u(h,p,null,1,i),Pe(()=>{v.da&&Dn(v.da);const w=h.props&&h.props.onVnodeUnmounted;w&&Be(w,v.parent,h),v.isDeactivated=!0},i)};function g(h){zr(h),c(h,n,i,!0)}function _(h){o.forEach((v,w)=>{const T=Eo(v.type);T&&(!h||!h(T))&&C(w)})}function C(h){const v=o.get(h);!l||v.type!==l.type?g(v):l&&zr(l),o.delete(h),s.delete(h)}je(()=>[e.include,e.exclude],([h,v])=>{h&&_(w=>On(h,w)),v&&_(w=>!On(v,w))},{flush:"post",deep:!0});let R=null;const y=()=>{R!=null&&o.set(R,Wr(n.subTree))};return Qn(y),xi(y),Cn(()=>{o.forEach(h=>{const{subTree:v,suspense:w}=n,T=Wr(v);if(h.type===T.type){zr(T);const O=T.component.da;O&&Pe(O,w);return}g(h)})}),()=>{if(R=null,!t.default)return null;const h=t.default(),v=h[0];if(h.length>1)return l=null,h;if(!pn(v)||!(v.shapeFlag&4)&&!(v.shapeFlag&128))return l=null,v;let w=Wr(v);const T=w.type,O=Eo(zt(w)?w.type.__asyncResolved||{}:T),{include:I,exclude:k,max:U}=e;if(I&&(!O||!On(I,O))||k&&O&&On(k,O))return l=w,v;const F=w.key==null?T:w.key,W=o.get(F);return w.el&&(w=gt(w),v.shapeFlag&128&&(v.ssContent=w)),R=F,W?(w.el=W.el,w.component=W.component,w.transition&&hr(w,w.transition),w.shapeFlag|=512,s.delete(F),s.add(F)):(s.add(F),U&&s.size>parseInt(U,10)&&C(s.values().next().value)),w.shapeFlag|=256,l=w,gi(v.type)?v:w}}},dc=fc;function On(e,t){return Y(e)?e.some(n=>On(n,t)):we(e)?e.split(",").includes(t):e.test?e.test(t):!1}function pc(e,t){Ei(e,"a",t)}function hc(e,t){Ei(e,"da",t)}function Ei(e,t,n=Ee){const r=e.__wdc||(e.__wdc=()=>{let o=n;for(;o;){if(o.isDeactivated)return;o=o.parent}return e()});if(Lr(t,r,n),n){let o=n.parent;for(;o&&o.parent;)Yn(o.parent.vnode)&&gc(r,t,n,o),o=o.parent}}function gc(e,t,n,r){const o=Lr(t,e,r,!0);gr(()=>{Fo(r[t],o)},n)}function zr(e){let t=e.shapeFlag;t&256&&(t-=256),t&512&&(t-=512),e.shapeFlag=t}function Wr(e){return e.shapeFlag&128?e.ssContent:e}function Lr(e,t,n=Ee,r=!1){if(n){const o=n[e]||(n[e]=[]),s=t.__weh||(t.__weh=(...l)=>{if(n.isUnmounted)return;vn(),Ot(n);const i=ze(t,n,e,l);return At(),bn(),i});return r?o.unshift(s):o.push(s),s}}const mt=e=>(t,n=Ee)=>(!hn||e==="sp")&&Lr(e,(...r)=>t(...r),n),Ci=mt("bm"),Qn=mt("m"),mc=mt("bu"),xi=mt("u"),Cn=mt("bum"),gr=mt("um"),yc=mt("sp"),_c=mt("rtg"),vc=mt("rtc");function Ri(e,t=Ee){Lr("ec",e,t)}function ot(e,t,n,r){const o=e.dirs,s=t&&t.dirs;for(let l=0;lt(l,i,void 0,s&&s[i]));else{const l=Object.keys(e);o=new Array(l.length);for(let i=0,a=l.length;ipn(t)?!(t.type===Ie||t.type===ke&&!ki(t.children)):!0)?e:null}const yo=e=>e?ji(e)?is(e)||e.proxy:yo(e.parent):null,mr=Se(Object.create(null),{$:e=>e,$el:e=>e.vnode.el,$data:e=>e.data,$props:e=>e.props,$attrs:e=>e.attrs,$slots:e=>e.slots,$refs:e=>e.refs,$parent:e=>yo(e.parent),$root:e=>yo(e.root),$emit:e=>e.emit,$options:e=>os(e),$forceUpdate:e=>e.f||(e.f=()=>Sr(e.update)),$nextTick:e=>e.n||(e.n=En.bind(e.proxy)),$watch:e=>ac.bind(e)}),Cc={get({_:e},t){const{ctx:n,setupState:r,data:o,props:s,accessCache:l,type:i,appContext:a}=e;let u;if(t[0]!=="$"){const g=l[t];if(g!==void 0)switch(g){case 1:return r[t];case 2:return o[t];case 4:return n[t];case 3:return s[t]}else{if(r!==de&&re(r,t))return l[t]=1,r[t];if(o!==de&&re(o,t))return l[t]=2,o[t];if((u=e.propsOptions[0])&&re(u,t))return l[t]=3,s[t];if(n!==de&&re(n,t))return l[t]=4,n[t];_o&&(l[t]=0)}}const c=mr[t];let f,p;if(c)return t==="$attrs"&&Fe(e,"get",t),c(e);if((f=i.__cssModules)&&(f=f[t]))return f;if(n!==de&&re(n,t))return l[t]=4,n[t];if(p=a.config.globalProperties,re(p,t))return p[t]},set({_:e},t,n){const{data:r,setupState:o,ctx:s}=e;return o!==de&&re(o,t)?(o[t]=n,!0):r!==de&&re(r,t)?(r[t]=n,!0):re(e.props,t)||t[0]==="$"&&t.slice(1)in e?!1:(s[t]=n,!0)},has({_:{data:e,setupState:t,accessCache:n,ctx:r,appContext:o,propsOptions:s}},l){let i;return!!n[l]||e!==de&&re(e,l)||t!==de&&re(t,l)||(i=s[0])&&re(i,l)||re(r,l)||re(mr,l)||re(o.config.globalProperties,l)},defineProperty(e,t,n){return n.get!=null?e._.accessCache[t]=0:re(n,"value")&&this.set(e,t,n.value,null),Reflect.defineProperty(e,t,n)}};let _o=!0;function xc(e){const t=os(e),n=e.proxy,r=e.ctx;_o=!1,t.beforeCreate&&Ds(t.beforeCreate,e,"bc");const{data:o,computed:s,methods:l,watch:i,provide:a,inject:u,created:c,beforeMount:f,mounted:p,beforeUpdate:g,updated:_,activated:C,deactivated:R,beforeDestroy:y,beforeUnmount:h,destroyed:v,unmounted:w,render:T,renderTracked:O,renderTriggered:I,errorCaptured:k,serverPrefetch:U,expose:F,inheritAttrs:W,components:H,directives:Z,filters:j}=t;if(u&&Rc(u,r,null,e.appContext.config.unwrapInjectedRef),l)for(const ce in l){const ae=l[ce];X(ae)&&(r[ce]=ae.bind(n))}if(o){const ce=o.call(n,n);he(ce)&&(e.data=et(ce))}if(_o=!0,s)for(const ce in s){const ae=s[ce],Ye=X(ae)?ae.bind(n,n):X(ae.get)?ae.get.bind(n,n):Ze,Mt=!X(ae)&&X(ae.set)?ae.set.bind(n):Ze,Qe=xe({get:Ye,set:Mt});Object.defineProperty(r,ce,{enumerable:!0,configurable:!0,get:()=>Qe.value,set:$e=>Qe.value=$e})}if(i)for(const ce in i)Si(i[ce],r,n,ce);if(a){const ce=X(a)?a.call(n):a;Reflect.ownKeys(ce).forEach(ae=>{an(ae,ce[ae])})}c&&Ds(c,e,"c");function oe(ce,ae){Y(ae)?ae.forEach(Ye=>ce(Ye.bind(n))):ae&&ce(ae.bind(n))}if(oe(Ci,f),oe(Qn,p),oe(mc,g),oe(xi,_),oe(pc,C),oe(hc,R),oe(Ri,k),oe(vc,O),oe(_c,I),oe(Cn,h),oe(gr,w),oe(yc,U),Y(F))if(F.length){const ce=e.exposed||(e.exposed={});F.forEach(ae=>{Object.defineProperty(ce,ae,{get:()=>n[ae],set:Ye=>n[ae]=Ye})})}else e.exposed||(e.exposed={});T&&e.render===Ze&&(e.render=T),W!=null&&(e.inheritAttrs=W),H&&(e.components=H),Z&&(e.directives=Z)}function Rc(e,t,n=Ze,r=!1){Y(e)&&(e=vo(e));for(const o in e){const s=e[o];let l;he(s)?"default"in s?l=Ge(s.from||o,s.default,!0):l=Ge(s.from||o):l=Ge(s),Re(l)&&r?Object.defineProperty(t,o,{enumerable:!0,configurable:!0,get:()=>l.value,set:i=>l.value=i}):t[o]=l}}function Ds(e,t,n){ze(Y(e)?e.map(r=>r.bind(t.proxy)):e.bind(t.proxy),t,n)}function Si(e,t,n,r){const o=r.includes(".")?_i(n,r):()=>n[r];if(we(e)){const s=t[e];X(s)&&je(o,s)}else if(X(e))je(o,e.bind(n));else if(he(e))if(Y(e))e.forEach(s=>Si(s,t,n,r));else{const s=X(e.handler)?e.handler.bind(n):t[e.handler];X(s)&&je(o,s,e)}}function os(e){const t=e.type,{mixins:n,extends:r}=t,{mixins:o,optionsCache:s,config:{optionMergeStrategies:l}}=e.appContext,i=s.get(t);let a;return i?a=i:!o.length&&!n&&!r?a=t:(a={},o.length&&o.forEach(u=>yr(a,u,l,!0)),yr(a,t,l)),he(t)&&s.set(t,a),a}function yr(e,t,n,r=!1){const{mixins:o,extends:s}=t;s&&yr(e,s,n,!0),o&&o.forEach(l=>yr(e,l,n,!0));for(const l in t)if(!(r&&l==="expose")){const i=Pc[l]||n&&n[l];e[l]=i?i(e[l],t[l]):t[l]}return e}const Pc={data:Is,props:Ut,emits:Ut,methods:Ut,computed:Ut,beforeCreate:Me,created:Me,beforeMount:Me,mounted:Me,beforeUpdate:Me,updated:Me,beforeDestroy:Me,beforeUnmount:Me,destroyed:Me,unmounted:Me,activated:Me,deactivated:Me,errorCaptured:Me,serverPrefetch:Me,components:Ut,directives:Ut,watch:Sc,provide:Is,inject:kc};function Is(e,t){return t?e?function(){return Se(X(e)?e.call(this,this):e,X(t)?t.call(this,this):t)}:t:e}function kc(e,t){return Ut(vo(e),vo(t))}function vo(e){if(Y(e)){const t={};for(let n=0;n0)&&!(l&16)){if(l&8){const c=e.vnode.dynamicProps;for(let f=0;f{a=!0;const[p,g]=Ti(f,t,!0);Se(l,p),g&&i.push(...g)};!n&&t.mixins.length&&t.mixins.forEach(c),e.extends&&c(e.extends),e.mixins&&e.mixins.forEach(c)}if(!s&&!a)return he(e)&&r.set(e,nn),nn;if(Y(s))for(let c=0;c-1,g[1]=C<0||_-1||re(g,"default"))&&i.push(f)}}}const u=[l,i];return he(e)&&r.set(e,u),u}function $s(e){return e[0]!=="$"}function Bs(e){const t=e&&e.toString().match(/^\s*function (\w+)/);return t?t[1]:e===null?"null":""}function Hs(e,t){return Bs(e)===Bs(t)}function Ns(e,t){return Y(t)?t.findIndex(n=>Hs(n,e)):X(t)&&Hs(t,e)?0:-1}const Oi=e=>e[0]==="_"||e==="$stable",ss=e=>Y(e)?e.map(qe):[qe(e)],Oc=(e,t,n)=>{if(t._n)return t;const r=Or((...o)=>ss(t(...o)),n);return r._c=!1,r},Li=(e,t,n)=>{const r=e._ctx;for(const o in e){if(Oi(o))continue;const s=e[o];if(X(s))t[o]=Oc(o,s,r);else if(s!=null){const l=ss(s);t[o]=()=>l}}},Mi=(e,t)=>{const n=ss(t);e.slots.default=()=>n},Lc=(e,t)=>{if(e.vnode.shapeFlag&32){const n=t._;n?(e.slots=le(t),cr(t,"_",n)):Li(t,e.slots={})}else e.slots={},t&&Mi(e,t);cr(e.slots,Dr,1)},Mc=(e,t,n)=>{const{vnode:r,slots:o}=e;let s=!0,l=de;if(r.shapeFlag&32){const i=t._;i?n&&i===1?s=!1:(Se(o,t),!n&&i===1&&delete o._):(s=!t.$stable,Li(t,o)),l=t}else t&&(Mi(e,t),l={default:1});if(s)for(const i in o)!Oi(i)&&!(i in l)&&delete o[i]};function Di(){return{app:null,config:{isNativeTag:iu,performance:!1,globalProperties:{},optionMergeStrategies:{},errorHandler:void 0,warnHandler:void 0,compilerOptions:{}},mixins:[],components:{},directives:{},provides:Object.create(null),optionsCache:new WeakMap,propsCache:new WeakMap,emitsCache:new WeakMap}}let Dc=0;function Ic(e,t){return function(r,o=null){X(r)||(r=Object.assign({},r)),o!=null&&!he(o)&&(o=null);const s=Di(),l=new Set;let i=!1;const a=s.app={_uid:Dc++,_component:r,_props:o,_container:null,_context:s,_instance:null,version:Zc,get config(){return s.config},set config(u){},use(u,...c){return l.has(u)||(u&&X(u.install)?(l.add(u),u.install(a,...c)):X(u)&&(l.add(u),u(a,...c))),a},mixin(u){return s.mixins.includes(u)||s.mixins.push(u),a},component(u,c){return c?(s.components[u]=c,a):s.components[u]},directive(u,c){return c?(s.directives[u]=c,a):s.directives[u]},mount(u,c,f){if(!i){const p=ge(r,o);return p.appContext=s,c&&t?t(p,u):e(p,u,f),i=!0,a._container=u,u.__vue_app__=a,is(p.component)||p.component.proxy}},unmount(){i&&(e(null,a._container),delete a._container.__vue_app__)},provide(u,c){return s.provides[u]=c,a}};return a}}function _r(e,t,n,r,o=!1){if(Y(e)){e.forEach((p,g)=>_r(p,t&&(Y(t)?t[g]:t),n,r,o));return}if(zt(r)&&!o)return;const s=r.shapeFlag&4?is(r.component)||r.component.proxy:r.el,l=o?null:s,{i,r:a}=e,u=t&&t.r,c=i.refs===de?i.refs={}:i.refs,f=i.setupState;if(u!=null&&u!==a&&(we(u)?(c[u]=null,re(f,u)&&(f[u]=null)):Re(u)&&(u.value=null)),X(a))St(a,i,12,[l,c]);else{const p=we(a),g=Re(a);if(p||g){const _=()=>{if(e.f){const C=p?re(f,a)?f[a]:c[a]:a.value;o?Y(C)&&Fo(C,s):Y(C)?C.includes(s)||C.push(s):p?(c[a]=[s],re(f,a)&&(f[a]=c[a])):(a.value=[s],e.k&&(c[e.k]=a.value))}else p?(c[a]=l,re(f,a)&&(f[a]=l)):g&&(a.value=l,e.k&&(c[e.k]=l))};l?(_.id=-1,Pe(_,n)):_()}}}let vt=!1;const or=e=>/svg/.test(e.namespaceURI)&&e.tagName!=="foreignObject",sr=e=>e.nodeType===8;function $c(e){const{mt:t,p:n,o:{patchProp:r,createText:o,nextSibling:s,parentNode:l,remove:i,insert:a,createComment:u}}=e,c=(y,h)=>{if(!h.hasChildNodes()){n(null,y,h),dr(),h._vnode=y;return}vt=!1,f(h.firstChild,y,null,null,null),dr(),h._vnode=y,vt&&console.error("Hydration completed but contains mismatches.")},f=(y,h,v,w,T,O=!1)=>{const I=sr(y)&&y.data==="[",k=()=>C(y,h,v,w,T,I),{type:U,ref:F,shapeFlag:W,patchFlag:H}=h;let Z=y.nodeType;h.el=y,H===-2&&(O=!1,h.dynamicChildren=null);let j=null;switch(U){case ht:Z!==3?h.children===""?(a(h.el=o(""),l(y),y),j=y):j=k():(y.data!==h.children&&(vt=!0,y.data=h.children),j=s(y));break;case Ie:Z!==8||I?j=k():j=s(y);break;case In:if(I&&(y=s(y),Z=y.nodeType),Z===1||Z===3){j=y;const Ae=!h.children.length;for(let oe=0;oe{O=O||!!h.dynamicChildren;const{type:I,props:k,patchFlag:U,shapeFlag:F,dirs:W}=h,H=I==="input"&&W||I==="option";if(H||U!==-1){if(W&&ot(h,null,v,"created"),k)if(H||!O||U&48)for(const j in k)(H&&j.endsWith("value")||Wn(j)&&!Mn(j))&&r(y,j,null,k[j],!1,void 0,v);else k.onClick&&r(y,"onClick",null,k.onClick,!1,void 0,v);let Z;if((Z=k&&k.onVnodeBeforeMount)&&Be(Z,v,h),W&&ot(h,null,v,"beforeMount"),((Z=k&&k.onVnodeMounted)||W)&&yi(()=>{Z&&Be(Z,v,h),W&&ot(h,null,v,"mounted")},w),F&16&&!(k&&(k.innerHTML||k.textContent))){let j=g(y.firstChild,h,y,v,w,T,O);for(;j;){vt=!0;const Ae=j;j=j.nextSibling,i(Ae)}}else F&8&&y.textContent!==h.children&&(vt=!0,y.textContent=h.children)}return y.nextSibling},g=(y,h,v,w,T,O,I)=>{I=I||!!h.dynamicChildren;const k=h.children,U=k.length;for(let F=0;F{const{slotScopeIds:I}=h;I&&(T=T?T.concat(I):I);const k=l(y),U=g(s(y),h,k,v,w,T,O);return U&&sr(U)&&U.data==="]"?s(h.anchor=U):(vt=!0,a(h.anchor=u("]"),k,U),U)},C=(y,h,v,w,T,O)=>{if(vt=!0,h.el=null,O){const U=R(y);for(;;){const F=s(y);if(F&&F!==U)i(F);else break}}const I=s(y),k=l(y);return i(y),n(null,h,k,I,v,w,or(k),T),I},R=y=>{let h=0;for(;y;)if(y=s(y),y&&sr(y)&&(y.data==="["&&h++,y.data==="]")){if(h===0)return s(y);h--}return y};return[c,f]}const Pe=yi;function Bc(e){return Ii(e)}function Hc(e){return Ii(e,$c)}function Ii(e,t){const n=pu();n.__VUE__=!0;const{insert:r,remove:o,patchProp:s,createElement:l,createText:i,createComment:a,setText:u,setElementText:c,parentNode:f,nextSibling:p,setScopeId:g=Ze,insertStaticContent:_}=e,C=(d,m,b,E=null,P=null,M=null,B=!1,L=null,D=!!m.dynamicChildren)=>{if(d===m)return;d&&!lt(d,m)&&(E=$(d),$e(d,P,M,!0),d=null),m.patchFlag===-2&&(D=!1,m.dynamicChildren=null);const{type:S,ref:V,shapeFlag:q}=m;switch(S){case ht:R(d,m,b,E);break;case Ie:y(d,m,b,E);break;case In:d==null&&h(m,b,E,B);break;case ke:H(d,m,b,E,P,M,B,L,D);break;default:q&1?T(d,m,b,E,P,M,B,L,D):q&6?Z(d,m,b,E,P,M,B,L,D):(q&64||q&128)&&S.process(d,m,b,E,P,M,B,L,D,se)}V!=null&&P&&_r(V,d&&d.ref,M,m||d,!m)},R=(d,m,b,E)=>{if(d==null)r(m.el=i(m.children),b,E);else{const P=m.el=d.el;m.children!==d.children&&u(P,m.children)}},y=(d,m,b,E)=>{d==null?r(m.el=a(m.children||""),b,E):m.el=d.el},h=(d,m,b,E)=>{[d.el,d.anchor]=_(d.children,m,b,E,d.el,d.anchor)},v=({el:d,anchor:m},b,E)=>{let P;for(;d&&d!==m;)P=p(d),r(d,b,E),d=P;r(m,b,E)},w=({el:d,anchor:m})=>{let b;for(;d&&d!==m;)b=p(d),o(d),d=b;o(m)},T=(d,m,b,E,P,M,B,L,D)=>{B=B||m.type==="svg",d==null?O(m,b,E,P,M,B,L,D):U(d,m,P,M,B,L,D)},O=(d,m,b,E,P,M,B,L)=>{let D,S;const{type:V,props:q,shapeFlag:z,transition:J,dirs:te}=d;if(D=d.el=l(d.type,M,q&&q.is,q),z&8?c(D,d.children):z&16&&k(d.children,D,null,E,P,M&&V!=="foreignObject",B,L),te&&ot(d,null,E,"created"),q){for(const ue in q)ue!=="value"&&!Mn(ue)&&s(D,ue,null,q[ue],M,d.children,E,P,N);"value"in q&&s(D,"value",null,q.value),(S=q.onVnodeBeforeMount)&&Be(S,E,d)}I(D,d,d.scopeId,B,E),te&&ot(d,null,E,"beforeMount");const fe=(!P||P&&!P.pendingBranch)&&J&&!J.persisted;fe&&J.beforeEnter(D),r(D,m,b),((S=q&&q.onVnodeMounted)||fe||te)&&Pe(()=>{S&&Be(S,E,d),fe&&J.enter(D),te&&ot(d,null,E,"mounted")},P)},I=(d,m,b,E,P)=>{if(b&&g(d,b),E)for(let M=0;M{for(let S=D;S{const L=m.el=d.el;let{patchFlag:D,dynamicChildren:S,dirs:V}=m;D|=d.patchFlag&16;const q=d.props||de,z=m.props||de;let J;b&&Dt(b,!1),(J=z.onVnodeBeforeUpdate)&&Be(J,b,m,d),V&&ot(m,d,b,"beforeUpdate"),b&&Dt(b,!0);const te=P&&m.type!=="foreignObject";if(S?F(d.dynamicChildren,S,L,b,E,te,M):B||ae(d,m,L,null,b,E,te,M,!1),D>0){if(D&16)W(L,m,q,z,b,E,P);else if(D&2&&q.class!==z.class&&s(L,"class",null,z.class,P),D&4&&s(L,"style",q.style,z.style,P),D&8){const fe=m.dynamicProps;for(let ue=0;ue{J&&Be(J,b,m,d),V&&ot(m,d,b,"updated")},E)},F=(d,m,b,E,P,M,B)=>{for(let L=0;L{if(b!==E){if(b!==de)for(const L in b)!Mn(L)&&!(L in E)&&s(d,L,b[L],null,B,m.children,P,M,N);for(const L in E){if(Mn(L))continue;const D=E[L],S=b[L];D!==S&&L!=="value"&&s(d,L,S,D,B,m.children,P,M,N)}"value"in E&&s(d,"value",b.value,E.value)}},H=(d,m,b,E,P,M,B,L,D)=>{const S=m.el=d?d.el:i(""),V=m.anchor=d?d.anchor:i("");let{patchFlag:q,dynamicChildren:z,slotScopeIds:J}=m;J&&(L=L?L.concat(J):J),d==null?(r(S,b,E),r(V,b,E),k(m.children,b,V,P,M,B,L,D)):q>0&&q&64&&z&&d.dynamicChildren?(F(d.dynamicChildren,z,b,P,M,B,L),(m.key!=null||P&&m===P.subTree)&&$i(d,m,!0)):ae(d,m,b,V,P,M,B,L,D)},Z=(d,m,b,E,P,M,B,L,D)=>{m.slotScopeIds=L,d==null?m.shapeFlag&512?P.ctx.activate(m,b,E,B,D):j(m,b,E,P,M,B,D):Ae(d,m,D)},j=(d,m,b,E,P,M,B)=>{const L=d.component=zc(d,E,P);if(Yn(d)&&(L.ctx.renderer=se),Wc(L),L.asyncDep){if(P&&P.registerDep(L,oe),!d.el){const D=L.subTree=ge(Ie);y(null,D,m,b)}return}oe(L,d,m,b,P,M,B)},Ae=(d,m,b)=>{const E=m.component=d.component;if(tc(d,m,b))if(E.asyncDep&&!E.asyncResolved){ce(E,m,b);return}else E.next=m,Qu(E.update),E.update();else m.el=d.el,E.vnode=m},oe=(d,m,b,E,P,M,B)=>{const L=()=>{if(d.isMounted){let{next:V,bu:q,u:z,parent:J,vnode:te}=d,fe=V,ue;Dt(d,!1),V?(V.el=te.el,ce(d,V,B)):V=te,q&&Dn(q),(ue=V.props&&V.props.onVnodeBeforeUpdate)&&Be(ue,J,V,te),Dt(d,!0);const _e=qr(d),Je=d.subTree;d.subTree=_e,C(Je,_e,f(Je.el),$(Je),d,P,M),V.el=_e.el,fe===null&&ts(d,_e.el),z&&Pe(z,P),(ue=V.props&&V.props.onVnodeUpdated)&&Pe(()=>Be(ue,J,V,te),P)}else{let V;const{el:q,props:z}=m,{bm:J,m:te,parent:fe}=d,ue=zt(m);if(Dt(d,!1),J&&Dn(J),!ue&&(V=z&&z.onVnodeBeforeMount)&&Be(V,fe,m),Dt(d,!0),q&&ee){const _e=()=>{d.subTree=qr(d),ee(q,d.subTree,d,P,null)};ue?m.type.__asyncLoader().then(()=>!d.isUnmounted&&_e()):_e()}else{const _e=d.subTree=qr(d);C(null,_e,b,E,d,P,M),m.el=_e.el}if(te&&Pe(te,P),!ue&&(V=z&&z.onVnodeMounted)){const _e=m;Pe(()=>Be(V,fe,_e),P)}(m.shapeFlag&256||fe&&zt(fe.vnode)&&fe.vnode.shapeFlag&256)&&d.a&&Pe(d.a,P),d.isMounted=!0,m=b=E=null}},D=d.effect=new Wo(L,()=>Sr(S),d.scope),S=d.update=()=>D.run();S.id=d.uid,Dt(d,!0),S()},ce=(d,m,b)=>{m.component=d;const E=d.vnode.props;d.vnode=m,d.next=null,Tc(d,m.props,E,b),Mc(d,m.children,b),vn(),Ss(),bn()},ae=(d,m,b,E,P,M,B,L,D=!1)=>{const S=d&&d.children,V=d?d.shapeFlag:0,q=m.children,{patchFlag:z,shapeFlag:J}=m;if(z>0){if(z&128){Mt(S,q,b,E,P,M,B,L,D);return}else if(z&256){Ye(S,q,b,E,P,M,B,L,D);return}}J&8?(V&16&&N(S,P,M),q!==S&&c(b,q)):V&16?J&16?Mt(S,q,b,E,P,M,B,L,D):N(S,P,M,!0):(V&8&&c(b,""),J&16&&k(q,b,E,P,M,B,L,D))},Ye=(d,m,b,E,P,M,B,L,D)=>{d=d||nn,m=m||nn;const S=d.length,V=m.length,q=Math.min(S,V);let z;for(z=0;zV?N(d,P,M,!0,!1,q):k(m,b,E,P,M,B,L,D,q)},Mt=(d,m,b,E,P,M,B,L,D)=>{let S=0;const V=m.length;let q=d.length-1,z=V-1;for(;S<=q&&S<=z;){const J=d[S],te=m[S]=D?Ct(m[S]):qe(m[S]);if(lt(J,te))C(J,te,b,null,P,M,B,L,D);else break;S++}for(;S<=q&&S<=z;){const J=d[q],te=m[z]=D?Ct(m[z]):qe(m[z]);if(lt(J,te))C(J,te,b,null,P,M,B,L,D);else break;q--,z--}if(S>q){if(S<=z){const J=z+1,te=Jz)for(;S<=q;)$e(d[S],P,M,!0),S++;else{const J=S,te=S,fe=new Map;for(S=te;S<=z;S++){const He=m[S]=D?Ct(m[S]):qe(m[S]);He.key!=null&&fe.set(He.key,S)}let ue,_e=0;const Je=z-te+1;let Xt=!1,ys=0;const kn=new Array(Je);for(S=0;S=Je){$e(He,P,M,!0);continue}let nt;if(He.key!=null)nt=fe.get(He.key);else for(ue=te;ue<=z;ue++)if(kn[ue-te]===0&<(He,m[ue])){nt=ue;break}nt===void 0?$e(He,P,M,!0):(kn[nt-te]=S+1,nt>=ys?ys=nt:Xt=!0,C(He,m[nt],b,null,P,M,B,L,D),_e++)}const _s=Xt?Nc(kn):nn;for(ue=_s.length-1,S=Je-1;S>=0;S--){const He=te+S,nt=m[He],vs=He+1{const{el:M,type:B,transition:L,children:D,shapeFlag:S}=d;if(S&6){Qe(d.component.subTree,m,b,E);return}if(S&128){d.suspense.move(m,b,E);return}if(S&64){B.move(d,m,b,se);return}if(B===ke){r(M,m,b);for(let q=0;qL.enter(M),P);else{const{leave:q,delayLeave:z,afterLeave:J}=L,te=()=>r(M,m,b),fe=()=>{q(M,()=>{te(),J&&J()})};z?z(M,te,fe):fe()}else r(M,m,b)},$e=(d,m,b,E=!1,P=!1)=>{const{type:M,props:B,ref:L,children:D,dynamicChildren:S,shapeFlag:V,patchFlag:q,dirs:z}=d;if(L!=null&&_r(L,null,b,d,!0),V&256){m.ctx.deactivate(d);return}const J=V&1&&z,te=!zt(d);let fe;if(te&&(fe=B&&B.onVnodeBeforeUnmount)&&Be(fe,m,d),V&6)x(d.component,b,E);else{if(V&128){d.suspense.unmount(b,E);return}J&&ot(d,null,m,"beforeUnmount"),V&64?d.type.remove(d,m,b,P,se,E):S&&(M!==ke||q>0&&q&64)?N(S,m,b,!1,!0):(M===ke&&q&384||!P&&V&16)&&N(D,m,b),E&&Jt(d)}(te&&(fe=B&&B.onVnodeUnmounted)||J)&&Pe(()=>{fe&&Be(fe,m,d),J&&ot(d,null,m,"unmounted")},b)},Jt=d=>{const{type:m,el:b,anchor:E,transition:P}=d;if(m===ke){Zn(b,E);return}if(m===In){w(d);return}const M=()=>{o(b),P&&!P.persisted&&P.afterLeave&&P.afterLeave()};if(d.shapeFlag&1&&P&&!P.persisted){const{leave:B,delayLeave:L}=P,D=()=>B(b,M);L?L(d.el,M,D):D()}else M()},Zn=(d,m)=>{let b;for(;d!==m;)b=p(d),o(d),d=b;o(m)},x=(d,m,b)=>{const{bum:E,scope:P,update:M,subTree:B,um:L}=d;E&&Dn(E),P.stop(),M&&(M.active=!1,$e(B,d,m,b)),L&&Pe(L,m),Pe(()=>{d.isUnmounted=!0},m),m&&m.pendingBranch&&!m.isUnmounted&&d.asyncDep&&!d.asyncResolved&&d.suspenseId===m.pendingId&&(m.deps--,m.deps===0&&m.resolve())},N=(d,m,b,E=!1,P=!1,M=0)=>{for(let B=M;Bd.shapeFlag&6?$(d.component.subTree):d.shapeFlag&128?d.suspense.next():p(d.anchor||d.el),K=(d,m,b)=>{d==null?m._vnode&&$e(m._vnode,null,null,!0):C(m._vnode||null,d,m,null,null,null,b),Ss(),dr(),m._vnode=d},se={p:C,um:$e,m:Qe,r:Jt,mt:j,mc:k,pc:ae,pbc:F,n:$,o:e};let me,ee;return t&&([me,ee]=t(se)),{render:K,hydrate:me,createApp:Ic(K,me)}}function Dt({effect:e,update:t},n){e.allowRecurse=t.allowRecurse=n}function $i(e,t,n=!1){const r=e.children,o=t.children;if(Y(r)&&Y(o))for(let s=0;s>1,e[n[i]]0&&(t[r]=n[s-1]),n[s]=r)}}for(s=n.length,l=n[s-1];s-- >0;)n[s]=l,l=t[l];return n}const jc=e=>e.__isTeleport,ke=Symbol(void 0),ht=Symbol(void 0),Ie=Symbol(void 0),In=Symbol(void 0),$n=[];let Ke=null;function Oe(e=!1){$n.push(Ke=e?null:[])}function Bi(){$n.pop(),Ke=$n[$n.length-1]||null}let dn=1;function js(e){dn+=e}function Hi(e){return e.dynamicChildren=dn>0?Ke||nn:null,Bi(),dn>0&&Ke&&Ke.push(e),e}function Pt(e,t,n,r,o,s){return Hi(vr(e,t,n,r,o,s,!0))}function Wt(e,t,n,r,o){return Hi(ge(e,t,n,r,o,!0))}function pn(e){return e?e.__v_isVNode===!0:!1}function lt(e,t){return e.type===t.type&&e.key===t.key}const Dr="__vInternal",Ni=({key:e})=>e!=null?e:null,ar=({ref:e,ref_key:t,ref_for:n})=>e!=null?we(e)||Re(e)||X(e)?{i:De,r:e,k:t,f:!!n}:e:null;function vr(e,t=null,n=null,r=0,o=null,s=e===ke?0:1,l=!1,i=!1){const a={__v_isVNode:!0,__v_skip:!0,type:e,props:t,key:t&&Ni(t),ref:t&&ar(t),scopeId:Tr,slotScopeIds:null,children:n,component:null,suspense:null,ssContent:null,ssFallback:null,dirs:null,transition:null,el:null,anchor:null,target:null,targetAnchor:null,staticCount:0,shapeFlag:s,patchFlag:r,dynamicProps:o,dynamicChildren:null,appContext:null};return i?(ls(a,n),s&128&&e.normalize(a)):n&&(a.shapeFlag|=we(n)?8:16),dn>0&&!l&&Ke&&(a.patchFlag>0||s&6)&&a.patchFlag!==32&&Ke.push(a),a}const ge=Fc;function Fc(e,t=null,n=null,r=0,o=null,s=!1){if((!e||e===bc)&&(e=Ie),pn(e)){const i=gt(e,t,!0);return n&&ls(i,n),dn>0&&!s&&Ke&&(i.shapeFlag&6?Ke[Ke.indexOf(e)]=i:Ke.push(i)),i.patchFlag|=-2,i}if(Jc(e)&&(e=e.__vccOpts),t){t=Uc(t);let{class:i,style:a}=t;i&&!we(i)&&(t.class=dt(i)),he(a)&&(ni(a)&&!Y(a)&&(a=Se({},a)),t.style=cn(a))}const l=we(e)?1:gi(e)?128:jc(e)?64:he(e)?4:X(e)?2:0;return vr(e,t,n,r,o,l,s,!0)}function Uc(e){return e?ni(e)||Dr in e?Se({},e):e:null}function gt(e,t,n=!1){const{props:r,ref:o,patchFlag:s,children:l}=e,i=t?qc(r||{},t):r;return{__v_isVNode:!0,__v_skip:!0,type:e.type,props:i,key:i&&Ni(i),ref:t&&t.ref?n&&o?Y(o)?o.concat(ar(t)):[o,ar(t)]:ar(t):o,scopeId:e.scopeId,slotScopeIds:e.slotScopeIds,children:l,target:e.target,targetAnchor:e.targetAnchor,staticCount:e.staticCount,shapeFlag:e.shapeFlag,patchFlag:t&&e.type!==ke?s===-1?16:s|16:s,dynamicProps:e.dynamicProps,dynamicChildren:e.dynamicChildren,appContext:e.appContext,dirs:e.dirs,transition:e.transition,component:e.component,suspense:e.suspense,ssContent:e.ssContent&>(e.ssContent),ssFallback:e.ssFallback&>(e.ssFallback),el:e.el,anchor:e.anchor}}function Ir(e=" ",t=0){return ge(ht,null,e,t)}function Mm(e,t){const n=ge(In,null,e);return n.staticCount=t,n}function Dm(e="",t=!1){return t?(Oe(),Wt(Ie,null,e)):ge(Ie,null,e)}function qe(e){return e==null||typeof e=="boolean"?ge(Ie):Y(e)?ge(ke,null,e.slice()):typeof e=="object"?Ct(e):ge(ht,null,String(e))}function Ct(e){return e.el===null&&e.patchFlag!==-1||e.memo?e:gt(e)}function ls(e,t){let n=0;const{shapeFlag:r}=e;if(t==null)t=null;else if(Y(t))n=16;else if(typeof t=="object")if(r&65){const o=t.default;o&&(o._c&&(o._d=!1),ls(e,o()),o._c&&(o._d=!0));return}else{n=32;const o=t._;!o&&!(Dr in t)?t._ctx=De:o===3&&De&&(De.slots._===1?t._=1:(t._=2,e.patchFlag|=1024))}else X(t)?(t={default:t,_ctx:De},n=32):(t=String(t),r&64?(n=16,t=[Ir(t)]):n=8);e.children=t,e.shapeFlag|=n}function qc(...e){const t={};for(let n=0;nEe||De,Ot=e=>{Ee=e,e.scope.on()},At=()=>{Ee&&Ee.scope.off(),Ee=null};function ji(e){return e.vnode.shapeFlag&4}let hn=!1;function Wc(e,t=!1){hn=t;const{props:n,children:r}=e.vnode,o=ji(e);Ac(e,n,o,t),Lc(e,r);const s=o?Yc(e,t):void 0;return hn=!1,s}function Yc(e,t){const n=e.type;e.accessCache=Object.create(null),e.proxy=ri(new Proxy(e.ctx,Cc));const{setup:r}=n;if(r){const o=e.setupContext=r.length>1?Ui(e):null;Ot(e),vn();const s=St(r,e,0,[e.props,o]);if(bn(),At(),qo(s)){if(s.then(At,At),t)return s.then(l=>{wo(e,l,t)}).catch(l=>{wn(l,e,0)});e.asyncDep=s}else wo(e,s,t)}else Fi(e,t)}function wo(e,t,n){X(t)?e.type.__ssrInlineRender?e.ssrRender=t:e.render=t:he(t)&&(e.setupState=ii(t)),Fi(e,n)}let Fs;function Fi(e,t,n){const r=e.type;if(!e.render){if(!t&&Fs&&!r.render){const o=r.template||os(e).template;if(o){const{isCustomElement:s,compilerOptions:l}=e.appContext.config,{delimiters:i,compilerOptions:a}=r,u=Se(Se({isCustomElement:s,delimiters:i},l),a);r.render=Fs(o,u)}}e.render=r.render||Ze}Ot(e),vn(),xc(e),bn(),At()}function Qc(e){return new Proxy(e.attrs,{get(t,n){return Fe(e,"get","$attrs"),t[n]}})}function Ui(e){const t=r=>{e.exposed=r||{}};let n;return{get attrs(){return n||(n=Qc(e))},slots:e.slots,emit:e.emit,expose:t}}function is(e){if(e.exposed)return e.exposeProxy||(e.exposeProxy=new Proxy(ii(ri(e.exposed)),{get(t,n){if(n in t)return t[n];if(n in mr)return mr[n](e)}}))}function Eo(e,t=!0){return X(e)?e.displayName||e.name:e.name||t&&e.__name}function Jc(e){return X(e)&&"__vccOpts"in e}const xe=(e,t)=>zu(e,t,hn);function as(){return Xc().slots}function Xc(){const e=yt();return e.setupContext||(e.setupContext=Ui(e))}function Im(e){const t=yt();let n=e();return At(),qo(n)&&(n=n.catch(r=>{throw Ot(t),r})),[n,()=>Ot(t)]}function ye(e,t,n){const r=arguments.length;return r===2?he(t)&&!Y(t)?pn(t)?ge(e,null,[t]):ge(e,t):ge(e,null,t):(r>3?n=Array.prototype.slice.call(arguments,2):r===3&&pn(n)&&(n=[n]),ge(e,t,n))}const Zc="3.2.41",Gc="http://www.w3.org/2000/svg",Kt=typeof document<"u"?document:null,Us=Kt&&Kt.createElement("template"),ef={insert:(e,t,n)=>{t.insertBefore(e,n||null)},remove:e=>{const t=e.parentNode;t&&t.removeChild(e)},createElement:(e,t,n,r)=>{const o=t?Kt.createElementNS(Gc,e):Kt.createElement(e,n?{is:n}:void 0);return e==="select"&&r&&r.multiple!=null&&o.setAttribute("multiple",r.multiple),o},createText:e=>Kt.createTextNode(e),createComment:e=>Kt.createComment(e),setText:(e,t)=>{e.nodeValue=t},setElementText:(e,t)=>{e.textContent=t},parentNode:e=>e.parentNode,nextSibling:e=>e.nextSibling,querySelector:e=>Kt.querySelector(e),setScopeId(e,t){e.setAttribute(t,"")},insertStaticContent(e,t,n,r,o,s){const l=n?n.previousSibling:t.lastChild;if(o&&(o===s||o.nextSibling))for(;t.insertBefore(o.cloneNode(!0),n),!(o===s||!(o=o.nextSibling)););else{Us.innerHTML=r?`${e}`:e;const i=Us.content;if(r){const a=i.firstChild;for(;a.firstChild;)i.appendChild(a.firstChild);i.removeChild(a)}t.insertBefore(i,n)}return[l?l.nextSibling:t.firstChild,n?n.previousSibling:t.lastChild]}};function tf(e,t,n){const r=e._vtc;r&&(t=(t?[t,...r]:[...r]).join(" ")),t==null?e.removeAttribute("class"):n?e.setAttribute("class",t):e.className=t}function nf(e,t,n){const r=e.style,o=we(n);if(n&&!o){for(const s in n)Co(r,s,n[s]);if(t&&!we(t))for(const s in t)n[s]==null&&Co(r,s,"")}else{const s=r.display;o?t!==n&&(r.cssText=n):t&&e.removeAttribute("style"),"_vod"in e&&(r.display=s)}}const qs=/\s*!important$/;function Co(e,t,n){if(Y(n))n.forEach(r=>Co(e,t,r));else if(n==null&&(n=""),t.startsWith("--"))e.setProperty(t,n);else{const r=rf(e,t);qs.test(n)?e.setProperty(_n(r),n.replace(qs,""),"important"):e[r]=n}}const Ks=["Webkit","Moz","ms"],Yr={};function rf(e,t){const n=Yr[t];if(n)return n;let r=it(t);if(r!=="filter"&&r in e)return Yr[t]=r;r=Pr(r);for(let o=0;oQr||(ff.then(()=>Qr=0),Qr=Date.now());function pf(e,t){const n=r=>{if(!r._vts)r._vts=Date.now();else if(r._vts<=n.attached)return;ze(hf(r,n.value),t,5,[r])};return n.value=e,n.attached=df(),n}function hf(e,t){if(Y(t)){const n=e.stopImmediatePropagation;return e.stopImmediatePropagation=()=>{n.call(e),e._stopped=!0},t.map(r=>o=>!o._stopped&&r&&r(o))}else return t}const Ws=/^on[a-z]/,gf=(e,t,n,r,o=!1,s,l,i,a)=>{t==="class"?tf(e,r,o):t==="style"?nf(e,n,r):Wn(t)?jo(t)||uf(e,t,n,r,l):(t[0]==="."?(t=t.slice(1),!0):t[0]==="^"?(t=t.slice(1),!1):mf(e,t,r,o))?sf(e,t,r,s,l,i,a):(t==="true-value"?e._trueValue=r:t==="false-value"&&(e._falseValue=r),of(e,t,r,o))};function mf(e,t,n,r){return r?!!(t==="innerHTML"||t==="textContent"||t in e&&Ws.test(t)&&X(n)):t==="spellcheck"||t==="draggable"||t==="translate"||t==="form"||t==="list"&&e.tagName==="INPUT"||t==="type"&&e.tagName==="TEXTAREA"||Ws.test(t)&&we(n)?!1:t in e}const bt="transition",Sn="animation",$r=(e,{slots:t})=>ye(vi,yf(e),t);$r.displayName="Transition";const qi={name:String,type:String,css:{type:Boolean,default:!0},duration:[String,Number,Object],enterFromClass:String,enterActiveClass:String,enterToClass:String,appearFromClass:String,appearActiveClass:String,appearToClass:String,leaveFromClass:String,leaveActiveClass:String,leaveToClass:String};$r.props=Se({},vi.props,qi);const It=(e,t=[])=>{Y(e)?e.forEach(n=>n(...t)):e&&e(...t)},Ys=e=>e?Y(e)?e.some(t=>t.length>1):e.length>1:!1;function yf(e){const t={};for(const H in e)H in qi||(t[H]=e[H]);if(e.css===!1)return t;const{name:n="v",type:r,duration:o,enterFromClass:s=`${n}-enter-from`,enterActiveClass:l=`${n}-enter-active`,enterToClass:i=`${n}-enter-to`,appearFromClass:a=s,appearActiveClass:u=l,appearToClass:c=i,leaveFromClass:f=`${n}-leave-from`,leaveActiveClass:p=`${n}-leave-active`,leaveToClass:g=`${n}-leave-to`}=e,_=_f(o),C=_&&_[0],R=_&&_[1],{onBeforeEnter:y,onEnter:h,onEnterCancelled:v,onLeave:w,onLeaveCancelled:T,onBeforeAppear:O=y,onAppear:I=h,onAppearCancelled:k=v}=t,U=(H,Z,j)=>{$t(H,Z?c:i),$t(H,Z?u:l),j&&j()},F=(H,Z)=>{H._isLeaving=!1,$t(H,f),$t(H,g),$t(H,p),Z&&Z()},W=H=>(Z,j)=>{const Ae=H?I:h,oe=()=>U(Z,H,j);It(Ae,[Z,oe]),Qs(()=>{$t(Z,H?a:s),wt(Z,H?c:i),Ys(Ae)||Js(Z,r,C,oe)})};return Se(t,{onBeforeEnter(H){It(y,[H]),wt(H,s),wt(H,l)},onBeforeAppear(H){It(O,[H]),wt(H,a),wt(H,u)},onEnter:W(!1),onAppear:W(!0),onLeave(H,Z){H._isLeaving=!0;const j=()=>F(H,Z);wt(H,f),wf(),wt(H,p),Qs(()=>{!H._isLeaving||($t(H,f),wt(H,g),Ys(w)||Js(H,r,R,j))}),It(w,[H,j])},onEnterCancelled(H){U(H,!1),It(v,[H])},onAppearCancelled(H){U(H,!0),It(k,[H])},onLeaveCancelled(H){F(H),It(T,[H])}})}function _f(e){if(e==null)return null;if(he(e))return[Jr(e.enter),Jr(e.leave)];{const t=Jr(e);return[t,t]}}function Jr(e){return Vo(e)}function wt(e,t){t.split(/\s+/).forEach(n=>n&&e.classList.add(n)),(e._vtc||(e._vtc=new Set)).add(t)}function $t(e,t){t.split(/\s+/).forEach(r=>r&&e.classList.remove(r));const{_vtc:n}=e;n&&(n.delete(t),n.size||(e._vtc=void 0))}function Qs(e){requestAnimationFrame(()=>{requestAnimationFrame(e)})}let vf=0;function Js(e,t,n,r){const o=e._endId=++vf,s=()=>{o===e._endId&&r()};if(n)return setTimeout(s,n);const{type:l,timeout:i,propCount:a}=bf(e,t);if(!l)return r();const u=l+"end";let c=0;const f=()=>{e.removeEventListener(u,p),s()},p=g=>{g.target===e&&++c>=a&&f()};setTimeout(()=>{c(n[_]||"").split(", "),o=r(bt+"Delay"),s=r(bt+"Duration"),l=Xs(o,s),i=r(Sn+"Delay"),a=r(Sn+"Duration"),u=Xs(i,a);let c=null,f=0,p=0;t===bt?l>0&&(c=bt,f=l,p=s.length):t===Sn?u>0&&(c=Sn,f=u,p=a.length):(f=Math.max(l,u),c=f>0?l>u?bt:Sn:null,p=c?c===bt?s.length:a.length:0);const g=c===bt&&/\b(transform|all)(,|$)/.test(n[bt+"Property"]);return{type:c,timeout:f,propCount:p,hasTransform:g}}function Xs(e,t){for(;e.lengthZs(n)+Zs(e[r])))}function Zs(e){return Number(e.slice(0,-1).replace(",","."))*1e3}function wf(){return document.body.offsetHeight}const Ki=Se({patchProp:gf},ef);let Bn,Gs=!1;function Ef(){return Bn||(Bn=Bc(Ki))}function Cf(){return Bn=Gs?Bn:Hc(Ki),Gs=!0,Bn}const xf=(...e)=>{const t=Ef().createApp(...e),{mount:n}=t;return t.mount=r=>{const o=Vi(r);if(!o)return;const s=t._component;!X(s)&&!s.render&&!s.template&&(s.template=o.innerHTML),o.innerHTML="";const l=n(o,!1,o instanceof SVGElement);return o instanceof Element&&(o.removeAttribute("v-cloak"),o.setAttribute("data-v-app","")),l},t},Rf=(...e)=>{const t=Cf().createApp(...e),{mount:n}=t;return t.mount=r=>{const o=Vi(r);if(o)return n(o,!0,o instanceof SVGElement)},t};function Vi(e){return we(e)?document.querySelector(e):e}const Pf=/"(?:_|\\u005[Ff])(?:_|\\u005[Ff])(?:p|\\u0070)(?:r|\\u0072)(?:o|\\u006[Ff])(?:t|\\u0074)(?:o|\\u006[Ff])(?:_|\\u005[Ff])(?:_|\\u005[Ff])"\s*:/,kf=/"(?:c|\\u0063)(?:o|\\u006[Ff])(?:n|\\u006[Ee])(?:s|\\u0073)(?:t|\\u0074)(?:r|\\u0072)(?:u|\\u0075)(?:c|\\u0063)(?:t|\\u0074)(?:o|\\u006[Ff])(?:r|\\u0072)"\s*:/,Sf=/^["{[]|^-?[0-9][0-9.]{0,14}$/;function Af(e,t){if(!(e==="__proto__"||e==="constructor"))return t}function us(e,t={}){if(typeof e!="string")return e;const n=e.toLowerCase();if(n==="true")return!0;if(n==="false")return!1;if(n==="null")return null;if(n==="nan")return NaN;if(n==="infinity")return 1/0;if(n!=="undefined"){if(!Sf.test(e)){if(t.strict)throw new SyntaxError("Invalid JSON");return e}try{return Pf.test(e)||kf.test(e)?JSON.parse(e,Af):JSON.parse(e)}catch(r){if(t.strict)throw r;return e}}}const Tf=/#/g,Of=/&/g,Lf=/=/g,zi=/\+/g,Mf=/%5B/gi,Df=/%5D/gi,If=/%5E/gi,$f=/%60/gi,Bf=/%7B/gi,Hf=/%7C/gi,Nf=/%7D/gi,jf=/%20/gi;function Ff(e){return encodeURI(""+e).replace(Hf,"|").replace(Mf,"[").replace(Df,"]")}function xo(e){return Ff(e).replace(zi,"%2B").replace(jf,"+").replace(Tf,"%23").replace(Of,"%26").replace($f,"`").replace(Bf,"{").replace(Nf,"}").replace(If,"^")}function Xr(e){return xo(e).replace(Lf,"%3D")}function Wi(e=""){try{return decodeURIComponent(""+e)}catch{return""+e}}function Uf(e){return Wi(e.replace(zi," "))}function qf(e=""){const t={};e[0]==="?"&&(e=e.substr(1));for(const n of e.split("&")){const r=n.match(/([^=]+)=?(.*)/)||[];if(r.length<2)continue;const o=Wi(r[1]);if(o==="__proto__"||o==="constructor")continue;const s=Uf(r[2]||"");t[o]?Array.isArray(t[o])?t[o].push(s):t[o]=[t[o],s]:t[o]=s}return t}function Kf(e,t){return(typeof t=="number"||typeof t=="boolean")&&(t=String(t)),t?Array.isArray(t)?t.map(n=>`${Xr(e)}=${xo(n)}`).join("&"):`${Xr(e)}=${xo(t)}`:Xr(e)}function Vf(e){return Object.keys(e).map(t=>Kf(t,e[t])).join("&")}const zf=/^\w+:(\/\/)?/,Wf=/^\/\/[^/]+/;function Br(e,t=!1){return zf.test(e)||t&&Wf.test(e)}const Yf=/\/$|\/\?/;function Ro(e="",t=!1){return t?Yf.test(e):e.endsWith("/")}function cs(e="",t=!1){if(!t)return(Ro(e)?e.slice(0,-1):e)||"/";if(!Ro(e,!0))return e||"/";const[n,...r]=e.split("?");return(n.slice(0,-1)||"/")+(r.length?`?${r.join("?")}`:"")}function Yi(e="",t=!1){if(!t)return e.endsWith("/")?e:e+"/";if(Ro(e,!0))return e||"/";const[n,...r]=e.split("?");return n+"/"+(r.length?`?${r.join("?")}`:"")}function Qi(e=""){return e.startsWith("/")}function Qf(e=""){return(Qi(e)?e.substr(1):e)||"/"}function Jf(e=""){return Qi(e)?e:"/"+e}function Ji(e,t){if(Xi(t)||Br(e))return e;const n=cs(t);return e.startsWith(n)?e:Jn(n,e)}function el(e,t){if(Xi(t))return e;const n=cs(t);if(!e.startsWith(n))return e;const r=e.substring(n.length);return r[0]==="/"?r:"/"+r}function Xf(e,t){const n=Hr(e),r={...qf(n.search),...t};return n.search=Vf(r),Gf(n)}function Xi(e){return!e||e==="/"}function Zf(e){return e&&e!=="/"}function Jn(e,...t){let n=e||"";for(const r of t.filter(Zf))n=n?Yi(n)+Qf(r):r;return n}function Hr(e="",t){if(!Br(e,!0))return t?Hr(t+e):tl(e);const[n="",r,o=""]=(e.replace(/\\/g,"/").match(/([^:/]+:)?\/\/([^/@]+@)?(.*)/)||[]).splice(1),[s="",l=""]=(o.match(/([^/?#]*)(.*)?/)||[]).splice(1),{pathname:i,search:a,hash:u}=tl(l);return{protocol:n,auth:r?r.substr(0,r.length-1):"",host:s,pathname:i,search:a,hash:u}}function tl(e=""){const[t="",n="",r=""]=(e.match(/([^#?]*)(\?[^#]*)?(#.*)?/)||[]).splice(1);return{pathname:t,search:n,hash:r}}function Gf(e){const t=e.pathname+(e.search?(e.search.startsWith("?")?"":"?")+e.search:"")+e.hash;return e.protocol?e.protocol+"//"+(e.auth?e.auth+"@":"")+e.host+t:t}class ed extends Error{constructor(){super(...arguments),this.name="FetchError"}}function td(e,t,n){let r="";e&&n&&(r=`${n.status} ${n.statusText} (${e.toString()})`),t&&(r=`${t.message} (${r})`);const o=new ed(r);return Object.defineProperty(o,"request",{get(){return e}}),Object.defineProperty(o,"response",{get(){return n}}),Object.defineProperty(o,"data",{get(){return n&&n._data}}),o}const nd=new Set(Object.freeze(["PATCH","POST","PUT","DELETE"]));function nl(e="GET"){return nd.has(e.toUpperCase())}function rd(e){if(e===void 0)return!1;const t=typeof e;return t==="string"||t==="number"||t==="boolean"||t===null?!0:t!=="object"?!1:Array.isArray(e)?!0:e.constructor&&e.constructor.name==="Object"||typeof e.toJSON=="function"}const od=new Set(["image/svg","application/xml","application/xhtml","application/html"]),sd=/^application\/(?:[\w!#$%&*`\-.^~]*\+)?json(;.+)?$/i;function ld(e=""){if(!e)return"json";const t=e.split(";").shift();return sd.test(t)?"json":od.has(t)||t.startsWith("text/")?"text":"blob"}const id=new Set([408,409,425,429,500,502,503,504]);function Zi(e){const{fetch:t,Headers:n}=e;function r(l){const i=l.error&&l.error.name==="AbortError"||!1;if(l.options.retry!==!1&&!i){const u=typeof l.options.retry=="number"?l.options.retry:nl(l.options.method)?0:1,c=l.response&&l.response.status||500;if(u>0&&id.has(c))return o(l.request,{...l.options,retry:u-1})}const a=td(l.request,l.error,l.response);throw Error.captureStackTrace&&Error.captureStackTrace(a,o),a}const o=async function(i,a={}){const u={request:i,options:{...e.defaults,...a},response:void 0,error:void 0};u.options.onRequest&&await u.options.onRequest(u),typeof u.request=="string"&&(u.options.baseURL&&(u.request=Ji(u.request,u.options.baseURL)),(u.options.query||u.options.params)&&(u.request=Xf(u.request,{...u.options.params,...u.options.query})),u.options.body&&nl(u.options.method)&&rd(u.options.body)&&(u.options.body=typeof u.options.body=="string"?u.options.body:JSON.stringify(u.options.body),u.options.headers=new n(u.options.headers),u.options.headers.has("content-type")||u.options.headers.set("content-type","application/json"),u.options.headers.has("accept")||u.options.headers.set("accept","application/json"))),u.response=await t(u.request,u.options).catch(async f=>(u.error=f,u.options.onRequestError&&await u.options.onRequestError(u),r(u)));const c=(u.options.parseResponse?"json":u.options.responseType)||ld(u.response.headers.get("content-type")||"");if(c==="json"){const f=await u.response.text(),p=u.options.parseResponse||us;u.response._data=p(f)}else c==="stream"?u.response._data=u.response.body:u.response._data=await u.response[c]();return u.options.onResponse&&await u.options.onResponse(u),u.response.ok||u.options.onResponseError&&await u.options.onResponseError(u),u.response.ok?u.response:r(u)},s=function(i,a){return o(i,a).then(u=>u._data)};return s.raw=o,s.create=(l={})=>Zi({...e,defaults:{...e.defaults,...l}}),s}const Gi=function(){if(typeof globalThis<"u")return globalThis;if(typeof self<"u")return self;if(typeof window<"u")return window;if(typeof global<"u")return global;throw new Error("unable to locate global object")}(),ad=Gi.fetch||(()=>Promise.reject(new Error("[ohmyfetch] global.fetch is not supported!"))),ud=Gi.Headers,cd=Zi({fetch:ad,Headers:ud}),fd=()=>{var e;return((e=window==null?void 0:window.__NUXT__)==null?void 0:e.config)||{}},br=fd().app,dd=()=>br.baseURL,pd=()=>br.buildAssetsDir,hd=(...e)=>Jn(ea(),pd(),...e),ea=(...e)=>{const t=br.cdnURL||br.baseURL;return e.length?Jn(t,...e):t};globalThis.__buildAssetsURL=hd,globalThis.__publicAssetsURL=ea;function Po(e,t={},n){for(const r in e){const o=e[r],s=n?`${n}:${r}`:r;typeof o=="object"&&o!==null?Po(o,t,s):typeof o=="function"&&(t[s]=o)}return t}function gd(e,t){return e.reduce((n,r)=>n.then(()=>r.apply(void 0,t)),Promise.resolve(null))}function md(e,t){return Promise.all(e.map(n=>n.apply(void 0,t)))}function Zr(e,t){for(const n of e)n(t)}class yd{constructor(){this._hooks={},this._before=null,this._after=null,this._deprecatedMessages=null,this._deprecatedHooks={},this.hook=this.hook.bind(this),this.callHook=this.callHook.bind(this),this.callHookWith=this.callHookWith.bind(this)}hook(t,n,r={}){if(!t||typeof n!="function")return()=>{};const o=t;let s;for(;this._deprecatedHooks[t];)s=this._deprecatedHooks[t],t=s.to;if(s&&!r.allowDeprecated){let l=s.message;l||(l=`${o} hook has been deprecated`+(s.to?`, please use ${s.to}`:"")),this._deprecatedMessages||(this._deprecatedMessages=new Set),this._deprecatedMessages.has(l)||(console.warn(l),this._deprecatedMessages.add(l))}return this._hooks[t]=this._hooks[t]||[],this._hooks[t].push(n),()=>{n&&(this.removeHook(t,n),n=null)}}hookOnce(t,n){let r,o=(...s)=>(r(),r=null,o=null,n(...s));return r=this.hook(t,o),r}removeHook(t,n){if(this._hooks[t]){const r=this._hooks[t].indexOf(n);r!==-1&&this._hooks[t].splice(r,1),this._hooks[t].length===0&&delete this._hooks[t]}}deprecateHook(t,n){this._deprecatedHooks[t]=typeof n=="string"?{to:n}:n;const r=this._hooks[t]||[];this._hooks[t]=void 0;for(const o of r)this.hook(t,o)}deprecateHooks(t){Object.assign(this._deprecatedHooks,t);for(const n in t)this.deprecateHook(n,t[n])}addHooks(t){const n=Po(t),r=Object.keys(n).map(o=>this.hook(o,n[o]));return()=>{r.splice(0,r.length).forEach(o=>o())}}removeHooks(t){const n=Po(t);for(const r in n)this.removeHook(r,n[r])}callHook(t,...n){return this.callHookWith(gd,t,...n)}callHookParallel(t,...n){return this.callHookWith(md,t,...n)}callHookWith(t,n,...r){const o=this._before||this._after?{name:n,args:r,context:{}}:void 0;this._before&&Zr(this._before,o);const s=t(this._hooks[n]||[],r);return s instanceof Promise?s.finally(()=>{this._after&&o&&Zr(this._after,o)}):(this._after&&o&&Zr(this._after,o),s)}beforeEach(t){return this._before=this._before||[],this._before.push(t),()=>{const n=this._before.indexOf(t);n!==-1&&this._before.splice(n,1)}}afterEach(t){return this._after=this._after||[],this._after.push(t),()=>{const n=this._after.indexOf(t);n!==-1&&this._after.splice(n,1)}}}function _d(){return new yd}function vd(){let e=null,t=!1;const n=r=>{if(e&&e!==r)throw new Error("Context conflict")};return{use:()=>{if(e==null)throw new Error("Context is not available");return e},tryUse:()=>e,set:(r,o)=>{o||n(r),e=r,t=!0},unset:()=>{e=null,t=!1},call:(r,o)=>{n(r),e=r;try{return o()}finally{t||(e=null)}},async callAsync(r,o){e=r;const s=()=>{e=r},l=()=>e===r?s:void 0;ko.add(l);try{const i=o();return t||(e=null),await i}finally{ko.delete(l)}}}}function bd(){const e={};return{get(t){return e[t]||(e[t]=vd()),e[t],e[t]}}}const wr=typeof globalThis<"u"?globalThis:typeof self<"u"?self:typeof global<"u"?global:typeof window<"u"?window:{},rl="__unctx__",wd=wr[rl]||(wr[rl]=bd()),Ed=e=>wd.get(e),ol="__unctx_async_handlers__",ko=wr[ol]||(wr[ol]=new Set);function ta(e){const t=[];for(const o of ko){const s=o();s&&t.push(s)}const n=()=>{for(const o of t)o()};let r=e();return"catch"in r&&(r=r.catch(o=>{throw n(),o})),[r,n]}const na=Ed("nuxt-app"),Cd="__nuxt_plugin";function xd(e){let t=0;const n={provide:void 0,globalName:"nuxt",payload:et({data:{},state:{},_errors:{},...window.__NUXT__}),isHydrating:!0,deferHydration(){if(!n.isHydrating)return()=>{};t++;let s=!1;return()=>{if(!s&&(s=!0,t--,t===0))return n.isHydrating=!1,n.callHook("app:suspense:resolve")}},_asyncDataPromises:{},_asyncData:{},...e};n.hooks=_d(),n.hook=n.hooks.hook,n.callHook=n.hooks.callHook,n.provide=(s,l)=>{const i="$"+s;lr(n,i,l),lr(n.vueApp.config.globalProperties,i,l)},lr(n.vueApp,"$nuxt",n),lr(n.vueApp.config.globalProperties,"$nuxt",n);const r=et(n.payload.config),o=new Proxy(r,{get(s,l){var i;return l==="public"?s.public:(i=s[l])!=null?i:s.public[l]},set(s,l,i){return l==="public"||l==="app"?!1:(s[l]=i,s.public[l]=i,!0)}});return n.provide("config",o),n}async function Rd(e,t){if(typeof t!="function")return;const{provide:n}=await xt(e,t,[e])||{};if(n&&typeof n=="object")for(const r in n)e.provide(r,n[r])}async function Pd(e,t){for(const n of t)await Rd(e,n)}function kd(e){return e.map(n=>typeof n!="function"?null:n.length>1?r=>n(r,r.provide):n).filter(Boolean)}function Lt(e){return e[Cd]=!0,e}function xt(e,t,n){const r=()=>n?t(...n):t();return na.set(e),r()}function Ce(){const e=na.tryUse();if(!e){const t=yt();if(!t)throw new Error("nuxt instance unavailable");return t.appContext.app.$nuxt}return e}function xn(){return Ce().$config}function lr(e,t,n){Object.defineProperty(e,t,{get:()=>n})}const Sd=()=>null;function Ad(...e){var f,p,g,_,C,R,y,h,v;const t=typeof e[e.length-1]=="string"?e.pop():void 0;typeof e[0]!="string"&&e.unshift(t);let[n,r,o={}]=e;if(typeof n!="string")throw new TypeError("[nuxt] [asyncData] key must be a string.");if(typeof r!="function")throw new TypeError("[nuxt] [asyncData] handler must be a function.");o.server=(f=o.server)!=null?f:!0,o.default=(p=o.default)!=null?p:Sd,o.defer&&console.warn("[useAsyncData] `defer` has been renamed to `lazy`. Support for `defer` will be removed in RC."),o.lazy=(_=(g=o.lazy)!=null?g:o.defer)!=null?_:!1,o.initialCache=(C=o.initialCache)!=null?C:!0,o.immediate=(R=o.immediate)!=null?R:!0;const s=Ce(),l=()=>(s.isHydrating||o.initialCache)&&s.payload.data[n]!==void 0;s._asyncData[n]||(s._asyncData[n]={data:Ve(l()?s.payload.data[n]:(h=(y=o.default)==null?void 0:y.call(o))!=null?h:null),pending:Ve(!l()),error:Ve((v=s.payload._errors[n])!=null?v:null)});const i={...s._asyncData[n]};i.refresh=i.execute=(w={})=>{if(s._asyncDataPromises[n]){if(w.dedupe===!1)return s._asyncDataPromises[n];s._asyncDataPromises[n].cancelled=!0}if(w._initial&&l())return s.payload.data[n];i.pending.value=!0;const T=new Promise((O,I)=>{try{O(r(s))}catch(k){I(k)}}).then(O=>{if(T.cancelled)return s._asyncDataPromises[n];o.transform&&(O=o.transform(O)),o.pick&&(O=Td(O,o.pick)),i.data.value=O,i.error.value=null}).catch(O=>{var I,k;if(T.cancelled)return s._asyncDataPromises[n];i.error.value=O,i.data.value=be((k=(I=o.default)==null?void 0:I.call(o))!=null?k:null)}).finally(()=>{T.cancelled||(i.pending.value=!1,s.payload.data[n]=i.data.value,i.error.value&&(s.payload._errors[n]=!0),delete s._asyncDataPromises[n])});return s._asyncDataPromises[n]=T,s._asyncDataPromises[n]};const a=()=>i.refresh({_initial:!0}),u=o.server!==!1&&s.payload.serverRendered;{const w=yt();if(w&&!w._nuxtOnBeforeMountCbs){w._nuxtOnBeforeMountCbs=[];const O=w._nuxtOnBeforeMountCbs;w&&(Ci(()=>{O.forEach(I=>{I()}),O.splice(0,O.length)}),gr(()=>O.splice(0,O.length)))}u&&s.isHydrating&&n in s.payload.data?i.pending.value=!1:w&&(s.payload.serverRendered&&s.isHydrating||o.lazy)&&o.immediate?w._nuxtOnBeforeMountCbs.push(a):o.immediate&&a(),o.watch&&je(o.watch,()=>i.refresh());const T=s.hook("app:data:refresh",O=>{if(!O||O.includes(n))return i.refresh()});w&&gr(T)}const c=Promise.resolve(s._asyncDataPromises[n]).then(()=>i);return Object.assign(c,i),c}function $m(e){const t=e?Array.isArray(e)?e:[e]:void 0;return Ce().callHook("app:data:refresh",t)}function Td(e,t){const n={};for(const r of t)n[r]=e[r];return n}const Od=decodeURIComponent,Ld=encodeURIComponent,Md=/; */,ir=/^[\u0009\u0020-\u007e\u0080-\u00ff]+$/;function Dd(e,t){if(typeof e!="string")throw new TypeError("argument str must be a string");let n={},r=t||{},o=e.split(Md),s=r.decode||Od;for(let l=0;lGo(Ce().payload,"error"),Ln=e=>{const t=ra(e);try{Ce().callHook("app:error",t);const r=Nr();r.value=r.value||t}catch{throw t}return t},Bd=async(e={})=>{const t=Ce(),n=Nr();t.callHook("app:error:cleared",e),e.redirect&&await t.$router.replace(e.redirect),n.value=null},Hd=e=>!!(e&&typeof e=="object"&&"__nuxt_error"in e),ra=e=>{const t=Ao(e);return t.__nuxt_error=!0,t};function oa(...e){const t=typeof e[e.length-1]=="string"?e.pop():void 0;typeof e[0]!="string"&&e.unshift(t);const[n,r]=e;if(!n||typeof n!="string")throw new TypeError("[nuxt] [useState] key must be a string: "+n);if(r!==void 0&&typeof r!="function")throw new Error("[nuxt] [useState] init must be a function: "+r);const o="$s"+n,s=Ce(),l=Go(s.payload.state,o);if(l.value===void 0&&r){const i=r();if(Re(i))return s.payload.state[o]=i,i;l.value=i}return l}const Yt=()=>{var e;return(e=Ce())==null?void 0:e.$router},Rn=()=>yt()?Ge("_route",Ce()._route):Ce()._route,Nd=e=>e,jd=()=>{try{if(Ce()._processingMiddleware)return!0}catch{return!0}return!1},Fd=(e,t)=>{e||(e="/");const n=typeof e=="string"?e:e.path||"/",r=Br(n,!0);if(r&&!(t!=null&&t.external))throw new Error("Navigating to external URL is not allowed by default. Use `nagivateTo (url, { external: true })`.");if(r&&Hr(n).protocol==="script:")throw new Error("Cannot navigate to an URL with script protocol.");if(!r&&jd())return e;const o=Yt();return r?(t!=null&&t.replace?location.replace(n):location.href=n,Promise.resolve()):t!=null&&t.replace?o.replace(e):o.push(e)},Ud={ignoreUnknown:!1,respectType:!1,respectFunctionNames:!1,respectFunctionProperties:!1,unorderedObjects:!0,unorderedArrays:!1,unorderedSets:!1};function qd(e,t={}){t={...Ud,...t};const n=sa(t);return n.dispatch(e),n.toString()}function sa(e){const t=[];let n=[];const r=o=>{t.push(o)};return{toString(){return t.join("")},getContext(){return n},dispatch(o){return e.replacer&&(o=e.replacer(o)),this["_"+(o===null?"null":typeof o)](o)},_object(o){const s=/\[object (.*)\]/i,l=Object.prototype.toString.call(o),i=s.exec(l),a=i?i[1].toLowerCase():"unknown:["+l.toLowerCase()+"]";let u=null;if((u=n.indexOf(o))>=0)return this.dispatch("[CIRCULAR:"+u+"]");if(n.push(o),typeof Buffer<"u"&&Buffer.isBuffer&&Buffer.isBuffer(o))return r("buffer:"),r(o.toString("utf8"));if(a!=="object"&&a!=="function"&&a!=="asyncfunction")if(this["_"+a])this["_"+a](o);else{if(e.ignoreUnknown)return r("["+a+"]");throw new Error('Unknown object type "'+a+'"')}else{let c=Object.keys(o);return e.unorderedObjects&&(c=c.sort()),e.respectType!==!1&&!ll(o)&&c.splice(0,0,"prototype","__proto__","letructor"),e.excludeKeys&&(c=c.filter(function(f){return!e.excludeKeys(f)})),r("object:"+c.length+":"),c.forEach(f=>{this.dispatch(f),r(":"),e.excludeValues||this.dispatch(o[f]),r(",")})}},_array(o,s){if(s=typeof s<"u"?s:e.unorderedArrays!==!1,r("array:"+o.length+":"),!s||o.length<=1)return o.forEach(a=>this.dispatch(a));const l=[],i=o.map(a=>{const u=sa(e);return u.dispatch(a),l.push(u.getContext()),u.toString()});return n=n.concat(l),i.sort(),this._array(i,!1)},_date(o){return r("date:"+o.toJSON())},_symbol(o){return r("symbol:"+o.toString())},_error(o){return r("error:"+o.toString())},_boolean(o){return r("bool:"+o.toString())},_string(o){r("string:"+o.length+":"),r(o.toString())},_function(o){r("fn:"),ll(o)?this.dispatch("[native]"):this.dispatch(o.toString()),e.respectFunctionNames!==!1&&this.dispatch("function-name:"+String(o.name)),e.respectFunctionProperties&&this._object(o)},_number(o){return r("number:"+o.toString())},_xml(o){return r("xml:"+o.toString())},_null(){return r("Null")},_undefined(){return r("Undefined")},_regexp(o){return r("regex:"+o.toString())},_uint8array(o){return r("uint8array:"),this.dispatch(Array.prototype.slice.call(o))},_uint8clampedarray(o){return r("uint8clampedarray:"),this.dispatch(Array.prototype.slice.call(o))},_int8array(o){return r("int8array:"),this.dispatch(Array.prototype.slice.call(o))},_uint16array(o){return r("uint16array:"),this.dispatch(Array.prototype.slice.call(o))},_int16array(o){return r("int16array:"),this.dispatch(Array.prototype.slice.call(o))},_uint32array(o){return r("uint32array:"),this.dispatch(Array.prototype.slice.call(o))},_int32array(o){return r("int32array:"),this.dispatch(Array.prototype.slice.call(o))},_float32array(o){return r("float32array:"),this.dispatch(Array.prototype.slice.call(o))},_float64array(o){return r("float64array:"),this.dispatch(Array.prototype.slice.call(o))},_arraybuffer(o){return r("arraybuffer:"),this.dispatch(new Uint8Array(o))},_url(o){return r("url:"+o.toString())},_map(o){r("map:");const s=Array.from(o);return this._array(s,e.unorderedSets!==!1)},_set(o){r("set:");const s=Array.from(o);return this._array(s,e.unorderedSets!==!1)},_file(o){return r("file:"),this.dispatch([o.name,o.size,o.type,o.lastModfied])},_blob(){if(e.ignoreUnknown)return r("[blob]");throw new Error(`Hashing Blob objects is currently not supported +Use "options.replacer" or "options.ignoreUnknown" +`)},_domwindow(){return r("domwindow")},_bigint(o){return r("bigint:"+o.toString())},_process(){return r("process")},_timer(){return r("timer")},_pipe(){return r("pipe")},_tcp(){return r("tcp")},_udp(){return r("udp")},_tty(){return r("tty")},_statwatcher(){return r("statwatcher")},_securecontext(){return r("securecontext")},_connection(){return r("connection")},_zlib(){return r("zlib")},_context(){return r("context")},_nodescript(){return r("nodescript")},_httpparser(){return r("httpparser")},_dataview(){return r("dataview")},_signal(){return r("signal")},_fsevent(){return r("fsevent")},_tlswrap(){return r("tlswrap")}}}function ll(e){return typeof e!="function"?!1:/^function\s+\w*\s*\(\s*\)\s*{\s+\[native code\]\s+}$/i.exec(Function.prototype.toString.call(e))!=null}class gn{constructor(t,n){t=this.words=t||[],n!==void 0?this.sigBytes=n:this.sigBytes=t.length*4}toString(t){return(t||Kd).stringify(this)}concat(t){if(this.clamp(),this.sigBytes%4)for(let n=0;n>>2]>>>24-n%4*8&255;this.words[this.sigBytes+n>>>2]|=r<<24-(this.sigBytes+n)%4*8}else for(let n=0;n>>2]=t.words[n>>>2];return this.sigBytes+=t.sigBytes,this}clamp(){this.words[this.sigBytes>>>2]&=4294967295<<32-this.sigBytes%4*8,this.words.length=Math.ceil(this.sigBytes/4)}clone(){return new gn(this.words.slice(0))}}const Kd={stringify(e){const t=[];for(let n=0;n>>2]>>>24-n%4*8&255;t.push((r>>>4).toString(16)),t.push((r&15).toString(16))}return t.join("")}},Vd={stringify(e){const t="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789",n=[];for(let r=0;r>>2]>>>24-r%4*8&255,s=e.words[r+1>>>2]>>>24-(r+1)%4*8&255,l=e.words[r+2>>>2]>>>24-(r+2)%4*8&255,i=o<<16|s<<8|l;for(let a=0;a<4&&r*8+a*6>>6*(3-a)&63))}return n.join("")}},zd={parse(e){const t=e.length,n=[];for(let r=0;r>>2]|=(e.charCodeAt(r)&255)<<24-r%4*8;return new gn(n,t)}},Wd={parse(e){return zd.parse(unescape(encodeURIComponent(e)))}};class Yd{constructor(){this._minBufferSize=0,this.blockSize=512/32,this.reset()}reset(){this._data=new gn,this._nDataBytes=0}_append(t){typeof t=="string"&&(t=Wd.parse(t)),this._data.concat(t),this._nDataBytes+=t.sigBytes}_doProcessBlock(t,n){}_process(t){let n,r=this._data.sigBytes/(this.blockSize*4);t?r=Math.ceil(r):r=Math.max((r|0)-this._minBufferSize,0);const o=r*this.blockSize,s=Math.min(o*4,this._data.sigBytes);if(o){for(let l=0;l>>7)^(v<<14|v>>>18)^v>>>3,T=Bt[p-2],O=(T<<15|T>>>17)^(T<<13|T>>>19)^T>>>10;Bt[p]=w+Bt[p-7]+O+Bt[p-16]}const g=a&u^~a&c,_=o&s^o&l^s&l,C=(o<<30|o>>>2)^(o<<19|o>>>13)^(o<<10|o>>>22),R=(a<<26|a>>>6)^(a<<21|a>>>11)^(a<<7|a>>>25),y=f+R+g+Xd[p]+Bt[p],h=C+_;f=c,c=u,u=a,a=i+y|0,i=l,l=s,s=o,o=y+h|0}r[0]=r[0]+o|0,r[1]=r[1]+s|0,r[2]=r[2]+l|0,r[3]=r[3]+i|0,r[4]=r[4]+a|0,r[5]=r[5]+u|0,r[6]=r[6]+c|0,r[7]=r[7]+f|0}finalize(t){super.finalize(t);const n=this._nDataBytes*8,r=this._data.sigBytes*8;return this._data.words[r>>>5]|=128<<24-r%32,this._data.words[(r+64>>>9<<4)+14]=Math.floor(n/4294967296),this._data.words[(r+64>>>9<<4)+15]=n,this._data.sigBytes=this._data.words.length*4,this._process(),this._hash}}function Gd(e){return new Zd().finalize(e).toString(Vd)}function la(e,t={}){const n=typeof e=="string"?e:qd(e,t);return Gd(n).substr(0,10)}const ep={path:"/",decode:e=>us(decodeURIComponent(e)),encode:e=>encodeURIComponent(typeof e=="string"?e:JSON.stringify(e))};function ia(e,t){var s,l;const n={...ep,...t},r=tp(n)||{},o=Ve((l=r[e])!=null?l:(s=n.default)==null?void 0:s.call(n));return je(o,()=>{rp(e,o.value,n)}),o}function tp(e={}){return Dd(document.cookie,e)}function np(e,t,n={}){return t==null?sl(e,t,{...n,maxAge:-1}):sl(e,t,n)}function rp(e,t,n={}){document.cookie=np(e,t,n)}async function aa(e,t=Yt()){if(t._routePreloaded||(t._routePreloaded=new Set),t._routePreloaded.has(e))return;t._routePreloaded.add(e);const n=t._preloadPromises||(t._preloadPromises=[]);if(n.length>4)return Promise.all(n).then(()=>aa(e,t));const r=t.resolve(e).matched.map(o=>{var s;return(s=o.components)==null?void 0:s.default}).filter(o=>typeof o=="function");for(const o of r){const s=Promise.resolve(o()).catch(()=>{}).finally(()=>n.splice(n.indexOf(s)));n.push(s)}await Promise.all(n)}const op="modulepreload",sp=function(e,t){return new URL(e,t).href},il={},Q=function(t,n,r){return!n||n.length===0?t():Promise.all(n.map(o=>{if(o=sp(o,r),o in il)return;il[o]=!0;const s=o.endsWith(".css"),l=s?'[rel="stylesheet"]':"";if(document.querySelector(`link[href="${o}"]${l}`))return;const i=document.createElement("link");if(i.rel=s?"stylesheet":op,s||(i.as="script",i.crossOrigin=""),i.href=o,document.head.appendChild(i),s)return new Promise((a,u)=>{i.addEventListener("load",a),i.addEventListener("error",()=>u(new Error(`Unable to preload CSS for ${o}`)))})})).then(()=>t())};function al(e,t={}){const n=lp(e,t),r=Ce(),o=r._payloadCache=r._payloadCache||{};return o[e]||(o[e]=ip(n).then(s=>s||(delete o[e],null))),o[e]}function lp(e,t={}){const n=Hr(e);if(n.search)throw new Error("Payload URL cannot contain search params: "+e);const r=t.hash||(t.fresh?Date.now():"");return Jn(xn().app.baseURL,n.pathname,r?`_payload.${r}.js`:"_payload.js")}async function ip(e){const t=await Q(()=>import(e),[],import.meta.url).catch(n=>{console.warn("[nuxt] Cannot load payload ",e,n)});return(t==null?void 0:t.default)||null}function ap(){return!!Ce().payload.prerenderedAt}const up=(...e)=>e.find(t=>t!==void 0),cp="noopener noreferrer",fp=globalThis.requestIdleCallback||(e=>{const t=Date.now(),n={didTimeout:!1,timeRemaining:()=>Math.max(0,50-(Date.now()-t))};return setTimeout(()=>{e(n)},1)}),dp=globalThis.cancelIdleCallback||(e=>{clearTimeout(e)});function ua(e){const t=e.componentName||"NuxtLink";return Le({name:t,props:{to:{type:[String,Object],default:void 0,required:!1},href:{type:[String,Object],default:void 0,required:!1},target:{type:String,default:void 0,required:!1},rel:{type:String,default:void 0,required:!1},noRel:{type:Boolean,default:void 0,required:!1},prefetch:{type:Boolean,default:void 0,required:!1},noPrefetch:{type:Boolean,default:void 0,required:!1},activeClass:{type:String,default:void 0,required:!1},exactActiveClass:{type:String,default:void 0,required:!1},prefetchedClass:{type:String,default:void 0,required:!1},replace:{type:Boolean,default:void 0,required:!1},ariaCurrentValue:{type:String,default:void 0,required:!1},external:{type:Boolean,default:void 0,required:!1},custom:{type:Boolean,default:void 0,required:!1}},setup(n,{slots:r}){const o=Yt(),s=xe(()=>n.to||n.href||""),l=xe(()=>n.external||n.target&&n.target!=="_self"?!0:typeof s.value=="object"?!1:s.value===""||Br(s.value,!0)),i=Ve(!1),a=Ve(null);if(n.prefetch!==!1&&n.noPrefetch!==!0&&typeof s.value=="string"&&n.target!=="_blank"&&!hp()){const c=Ce(),f=pp();let p,g=null;Qn(()=>{p=fp(()=>{var _;(_=a==null?void 0:a.value)!=null&&_.tagName&&(g=f.observe(a.value,async()=>{g==null||g(),g=null,await Promise.all([c.hooks.callHook("link:prefetch",s.value).catch(()=>{}),!l.value&&aa(s.value,o).catch(()=>{})]),i.value=!0}))})}),Cn(()=>{p&&dp(p),g==null||g(),g=null})}return()=>{var g,_,C;if(!l.value)return ye(Mr("RouterLink"),{ref:R=>{a.value=R==null?void 0:R.$el},to:s.value,...i.value&&!n.custom?{class:n.prefetchedClass||e.prefetchedClass}:{},activeClass:n.activeClass||e.activeClass,exactActiveClass:n.exactActiveClass||e.exactActiveClass,replace:n.replace,ariaCurrentValue:n.ariaCurrentValue,custom:n.custom},r.default);const u=typeof s.value=="object"?(_=(g=o.resolve(s.value))==null?void 0:g.href)!=null?_:null:s.value||null,c=n.target||null,f=n.noRel?null:up(n.rel,e.externalRelAttribute,u?cp:"")||null,p=()=>Fd(u,{replace:n.replace});return n.custom?r.default?r.default({href:u,navigate:p,route:o.resolve(u),rel:f,target:c,isActive:!1,isExactActive:!1}):null:ye("a",{ref:a,href:u,rel:f,target:c},(C=r.default)==null?void 0:C.call(r))}}})}const ca=ua({componentName:"NuxtLink"});function pp(){const e=Ce();if(e._observer)return e._observer;let t=null;const n=new Map,r=(s,l)=>(t||(t=new IntersectionObserver(i=>{for(const a of i){const u=n.get(a.target);(a.isIntersecting||a.intersectionRatio>0)&&u&&u()}})),n.set(s,l),t.observe(s),()=>{n.delete(s),t.unobserve(s),n.size===0&&(t.disconnect(),t=null)});return e._observer={observe:r}}function hp(){const e=navigator.connection;return!!(e&&(e.saveData||/2g/.test(e.effectiveType)))}const Bm=Object.freeze(Object.defineProperty({__proto__:null,defineNuxtLink:ua,default:ca},Symbol.toStringTag,{value:"Module"}));function Gr(e){return e!==null&&typeof e=="object"}function To(e,t,n=".",r){if(!Gr(t))return To(e,{},n,r);const o=Object.assign({},t);for(const s in e){if(s==="__proto__"||s==="constructor")continue;const l=e[s];l!=null&&(r&&r(o,s,l,n)||(Array.isArray(l)&&Array.isArray(o[s])?o[s]=l.concat(o[s]):Gr(l)&&Gr(o[s])?o[s]=To(l,o[s],(n?`${n}.`:"")+s.toString(),r):o[s]=l))}return o}function gp(e){return(...t)=>t.reduce((n,r)=>To(n,r,"",e),{})}const mp=gp((e,t,n,r)=>{if(typeof e[t]<"u"&&typeof n=="function")return e[t]=n(e[t]),!0}),yp={};mp(yp);function fa(e){Ce()._useHead(e)}const eo={ProseA:ne(()=>Q(()=>import("./ProseA.125f5d24.js"),[],import.meta.url).then(e=>e.default||e)),ProseCode:ne(()=>Q(()=>import("./ProseCode.6beb51eb.js"),["ProseCode.6beb51eb.js","UiIconCopy.bfce4552.js","ProseCode.vue_used_vue_type_style_index_1_lang.module.230a312a.js","ProseCode.vue_used_vue_type_style_index_1_lang.24930a5d.css"],import.meta.url).then(e=>e.default||e)),ContentDoc:ne(()=>Q(()=>Promise.resolve().then(()=>kg),void 0,import.meta.url).then(e=>e.default||e)),ContentList:ne(()=>Q(()=>import("./ContentList.aa5fabfc.js"),[],import.meta.url).then(e=>e.default||e)),ContentNavigation:ne(()=>Q(()=>import("./ContentNavigation.3663b4c1.js"),["ContentNavigation.3663b4c1.js","ContentNavigation.eba111bf.css","navigation.c88a11e6.js","ProseCode.vue_used_vue_type_style_index_1_lang.module.230a312a.js","ProseCode.vue_used_vue_type_style_index_1_lang.24930a5d.css","BioSkills.vue_used_vue_type_style_index_0_lang.module.516c18c9.js","BioSkills.vue_used_vue_type_style_index_0_lang.4d0cadf8.css","UiCard.vue_used_vue_type_style_index_0_lang.module.a0027dfd.js","UiCard.vue_used_vue_type_style_index_0_lang.7760099e.css","ContactInformation.vue_used_vue_type_style_index_0_lang.module.80c3b839.js","ContactInformation.vue_used_vue_type_style_index_0_lang.826cd7fe.css","LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.module.5f1b7ee4.js","LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.cfa40af4.css","LayoutHeader.vue_used_vue_type_style_index_0_lang.module.57d4f89f.js","LayoutHeader.vue_used_vue_type_style_index_0_lang.b2295632.css","LayoutMainMenuToggle.vue_used_vue_type_style_index_0_lang.module.fbcd3219.js","LayoutMainMenuToggle.vue_used_vue_type_style_index_0_lang.17e7aae7.css","ContentList.aa5fabfc.js","ContentSlot.017eac9c.js","DocumentDrivenEmpty.901ae14d.js","DocumentDrivenNotFound.ac941741.js","Markdown.ca979d4c.js"],import.meta.url).then(e=>e.default||e)),ContentQuery:ne(()=>Q(()=>Promise.resolve().then(()=>Rg),void 0,import.meta.url).then(e=>e.default||e)),ContentRenderer:ne(()=>Q(()=>Promise.resolve().then(()=>yg),void 0,import.meta.url).then(e=>e.default||e)),ContentRendererMarkdown:ne(()=>Q(()=>Promise.resolve().then(()=>mg),void 0,import.meta.url).then(e=>e.default||e)),ContentSlot:ne(()=>Q(()=>import("./ContentSlot.017eac9c.js"),[],import.meta.url).then(e=>e.default||e)),DocumentDrivenEmpty:ne(()=>Q(()=>import("./DocumentDrivenEmpty.901ae14d.js"),[],import.meta.url).then(e=>e.default||e)),DocumentDrivenNotFound:ne(()=>Q(()=>import("./DocumentDrivenNotFound.ac941741.js"),[],import.meta.url).then(e=>e.default||e)),Markdown:ne(()=>Q(()=>import("./Markdown.ca979d4c.js"),["Markdown.ca979d4c.js","ContentSlot.017eac9c.js"],import.meta.url).then(e=>e.default||e)),ProseBlockquote:ne(()=>Q(()=>import("./ProseBlockquote.cf38769b.js"),[],import.meta.url).then(e=>e.default||e)),ProseCodeInline:ne(()=>Q(()=>import("./ProseCodeInline.4d9c4a74.js"),[],import.meta.url).then(e=>e.default||e)),ProseEm:ne(()=>Q(()=>import("./ProseEm.f76a6875.js"),[],import.meta.url).then(e=>e.default||e)),ProseH1:ne(()=>Q(()=>import("./ProseH1.84254f6d.js"),[],import.meta.url).then(e=>e.default||e)),ProseH2:ne(()=>Q(()=>import("./ProseH2.7bcea41b.js"),[],import.meta.url).then(e=>e.default||e)),ProseH3:ne(()=>Q(()=>import("./ProseH3.a0130b89.js"),[],import.meta.url).then(e=>e.default||e)),ProseH4:ne(()=>Q(()=>import("./ProseH4.f11e985d.js"),[],import.meta.url).then(e=>e.default||e)),ProseH5:ne(()=>Q(()=>import("./ProseH5.9093445b.js"),[],import.meta.url).then(e=>e.default||e)),ProseH6:ne(()=>Q(()=>import("./ProseH6.b0d8f665.js"),[],import.meta.url).then(e=>e.default||e)),ProseHr:ne(()=>Q(()=>import("./ProseHr.96616888.js"),[],import.meta.url).then(e=>e.default||e)),ProseImg:ne(()=>Q(()=>import("./ProseImg.092ce6d9.js"),[],import.meta.url).then(e=>e.default||e)),ProseLi:ne(()=>Q(()=>import("./ProseLi.03d0a4b8.js"),[],import.meta.url).then(e=>e.default||e)),ProseOl:ne(()=>Q(()=>import("./ProseOl.abb4941e.js"),[],import.meta.url).then(e=>e.default||e)),ProseP:ne(()=>Q(()=>import("./ProseP.b6cc34ce.js"),[],import.meta.url).then(e=>e.default||e)),ProseStrong:ne(()=>Q(()=>import("./ProseStrong.157fed42.js"),[],import.meta.url).then(e=>e.default||e)),ProseTable:ne(()=>Q(()=>import("./ProseTable.71457587.js"),[],import.meta.url).then(e=>e.default||e)),ProseTbody:ne(()=>Q(()=>import("./ProseTbody.fe1f05e0.js"),[],import.meta.url).then(e=>e.default||e)),ProseTd:ne(()=>Q(()=>import("./ProseTd.63f8da62.js"),[],import.meta.url).then(e=>e.default||e)),ProseTh:ne(()=>Q(()=>import("./ProseTh.1dca9060.js"),[],import.meta.url).then(e=>e.default||e)),ProseThead:ne(()=>Q(()=>import("./ProseThead.c70e04b7.js"),[],import.meta.url).then(e=>e.default||e)),ProseTr:ne(()=>Q(()=>import("./ProseTr.fcd995d6.js"),[],import.meta.url).then(e=>e.default||e)),ProseUl:ne(()=>Q(()=>import("./ProseUl.a662ccb8.js"),[],import.meta.url).then(e=>e.default||e))},_p=Lt(e=>{for(const t in eo)e.vueApp.component(t,eo[t]),e.vueApp.component("Lazy"+t,eo[t])});var ul;const vp=typeof window<"u";vp&&((ul=window==null?void 0:window.navigator)==null?void 0:ul.userAgent)&&/iP(ad|hone|od)/.test(window.navigator.userAgent);function bp(e){return typeof e=="function"?e():be(e)}var wp="usehead",cl="head:count",to="data-head-attrs",da="data-meta-body",fs=(e,t)=>e.map(n=>(n.input&&(t||!n.resolved)&&(n.input=Er(n.input)),n)),Ep=(e,t)=>{const n=r=>{var o;if((o=r.options)!=null&&o.renderPriority)return r.options.renderPriority;switch(r.tag){case"base":return-1;case"meta":return r.props.charset?-2:r.props["http-equiv"]==="content-security-policy"?0:10;default:return 10}};return n(e)-n(t)},Cp=e=>{const{props:t,tag:n,options:r}=e;if(n==="base"||n==="title"||n==="titleTemplate")return n;if(n==="link"&&t.rel==="canonical")return"canonical";if(t.charset)return"charset";if(r!=null&&r.key)return`${n}:${r.key}`;const o=["id"];n==="meta"&&o.push("name","property","http-equiv");for(const s of o)if(typeof t[s]<"u")return`${n}:${s}:${t[s]}`;return e.runtime.position};function Er(e){const t=bp(e);return!e||!t?t:Array.isArray(t)?t.map(Er):typeof t=="object"?Object.fromEntries(Object.entries(t).map(([n,r])=>n==="titleTemplate"?[n,be(r)]:[n,Er(r)])):t}var xp=(e,t,n)=>{var r;t={...t};const o={tag:e,props:{},runtime:{entryId:n.id},options:{...n.options}};return["hid","vmid","key"].forEach(s=>{t[s]&&(o.options.key=t[s],delete t[s])}),["children","innerHTML","textContent"].forEach(s=>{typeof t[s]<"u"&&(o.children=t[s],delete t[s])}),["body","renderPriority"].forEach(s=>{typeof t[s]<"u"&&(o.options[s]=t[s],delete t[s])}),(r=o.options)!=null&&r.body&&(t[da]=!0),o.props=t,o},Rp=e=>Object.entries(e.input).filter(([,t])=>typeof t<"u").map(([t,n])=>(Array.isArray(n)?n:[n]).map(r=>{switch(t){case"title":case"titleTemplate":return{tag:t,children:r,props:{},runtime:{entryId:e.id},options:e.options};case"base":case"meta":case"link":case"style":case"script":case"noscript":case"htmlAttrs":case"bodyAttrs":return xp(t,r,e);default:return!1}})).flat().filter(t=>!!t),fl=(e,t)=>e==null?t||null:typeof e=="function"?e(t):e.replace("%s",t!=null?t:""),pa=e=>{const t={};fs(e).forEach((l,i)=>{Rp(l).forEach((u,c)=>{u.runtime=u.runtime||{},u.runtime.position=i*1e4+c,t[Cp(u)]=u})});let r=Object.values(t).sort((l,i)=>l.runtime.position-i.runtime.position).sort(Ep);const o=r.findIndex(l=>l.tag==="titleTemplate"),s=r.findIndex(l=>l.tag==="title");if(s!==-1&&o!==-1){const l=fl(r[o].children,r[s].children);l!==null?r[s].children=l||r[s].children:r=r.filter((i,a)=>a!==s),r=r.filter((i,a)=>a!==o)}else if(o!==-1){const l=fl(r[o].children);l!==null?(r[o].children=l,r[o].tag="title"):r=r.filter((i,a)=>a!==o)}return r};function dl(e,t){if(e instanceof HTMLElement&&t instanceof HTMLElement){const n=t.getAttribute("nonce");if(n&&!e.getAttribute("nonce")){const r=t.cloneNode(!0);return r.setAttribute("nonce",""),r.nonce=n,n===e.nonce&&e.isEqualNode(r)}}return e.isEqualNode(t)}var pl=(e,t)=>{const n=e.getAttribute(to);if(n)for(const o of n.split(","))o in t||e.removeAttribute(o);const r=[];for(const o in t){const s=t[o];s!=null&&(s===!1?e.removeAttribute(o):e.setAttribute(o,s),r.push(o))}r.length?e.setAttribute(to,r.join(",")):e.removeAttribute(to)},Pp=(e,t)=>{var n;const r=t.createElement(e.tag);return Object.entries(e.props).forEach(([o,s])=>{s!==!1&&r.setAttribute(o,s===!0?"":String(s))}),e.children&&((n=e.options)!=null&&n.safe?e.tag!=="script"&&(r.textContent=e.children):r.innerHTML=e.children),r},kp=(e=window.document,t,n)=>{var r,o;const s=e.head,l=e.body;let i=s.querySelector(`meta[name="${cl}"]`);const a=l.querySelectorAll(`[${da}]`),u=i?Number(i.getAttribute("content")):0,c=[],f=[];if(a)for(let g=0;g{var C;var _;return{element:Pp(g,e),body:(C=(_=g.options)==null?void 0:_.body)!=null?C:!1}});p=p.filter(g=>{for(let _=0;_{var _;return(_=g.parentNode)==null?void 0:_.removeChild(g)}),c.forEach(g=>{var _;return(_=g.parentNode)==null?void 0:_.removeChild(g)}),p.forEach(g=>{g.body?l.insertAdjacentElement("beforeend",g.element):s.insertBefore(g.element,i)}),i.setAttribute("content",`${u-c.length+p.filter(g=>!g.body).length}`)},Sp=async(e,t,n)=>{var r,o;const s={};n||(n=window.document);for(const u in e.hooks["before:dom"])if(await e.hooks["before:dom"][u]()===!1)return;const l=fs(e.headEntries);for(const u in e.hooks["resolved:entries"])await e.hooks["resolved:entries"][u](l);const i=pa(l);for(const u in e.hooks["resolved:tags"])await e.hooks["resolved:tags"][u](i);for(const u of i)switch(u.tag){case"title":typeof u.children<"u"&&(n.title=u.children);break;case"base":case"meta":case"link":case"style":case"script":case"noscript":s[u.tag]=s[u.tag]||[],s[u.tag].push(u);break}pl(n.documentElement,((r=i.find(u=>u.tag==="htmlAttrs"))==null?void 0:r.props)||{}),pl(n.body,((o=i.find(u=>u.tag==="bodyAttrs"))==null?void 0:o.props)||{});const a=new Set([...Object.keys(s),...t]);for(const u of a)kp(n,u,s[u]||[]);t.clear(),Object.keys(s).forEach(u=>t.add(u))},Ap=typeof window<"u",Tp=e=>{let t=[],n=0;const r=new Set;let o=null;const s={install(l){l.config.globalProperties&&(l.config.globalProperties.$head=s),l.provide(wp,s)},hooks:{"before:dom":[],"resolved:tags":[],"resolved:entries":[]},get headEntries(){return t},get headTags(){const l=fs(s.headEntries);return pa(l)},addHeadObjs(l,i){return s.addEntry(l,i)},addEntry(l,i={}){let a=!1;i!=null&&i.resolved&&(a=!0,delete i.resolved);const u={id:n++,options:i,resolved:a,input:l};return t.push(u),{remove(){t=t.filter(c=>c.id!==u.id)},update(c){t=t.map(f=>(f.id===u.id&&(f.input=c),f))}}},async updateDOM(l,i){const a=()=>(o=null,Sp(s,r,l));return i?a():o=o||new Promise(u=>En(()=>u(a())))},addReactiveEntry(l,i={}){let a=null;const u=ic(()=>{const c=Er(l);a===null?a=s.addEntry(c,{...i,resolved:!0}):a.update(c),Ap&&s.updateDOM()});return()=>{u(),a&&a.remove()}}};return e&&s.addEntry(e),s};const Op={meta:[{name:"viewport",content:"width=device-width, initial-scale=1"},{charset:"utf-8"}],link:[],style:[],script:[],noscript:[]},Lp={name:"layout",mode:"out-in"},Mp={name:"page",mode:"out-in"},Dp=!1,Ip=Lt(e=>{const t=Tp();t.addEntry(Op,{resolved:!0}),e.vueApp.use(t);{let n=!0;t.hooks["before:dom"].push(()=>!n),e.hooks.hookOnce("app:mounted",()=>{n=!1,t.updateDOM(),Yt().beforeEach(()=>{n=!0}),Yt().afterEach(()=>{n&&(n=!1,t.updateDOM())})})}e._useHead=(n,r)=>{const o=t.addReactiveEntry(n,r);!yt()||Cn(()=>{o(),t.updateDOM()})}}),$p={created(){const e=yt();if(!e)return;const t=e.type;if(!t||!("head"in t))return;const n=Ce(),r=typeof t.head=="function"?()=>t.head(n):t.head;fa(r)}},Bp=Lt(e=>{e.vueApp.mixin($p)});/*! + * vue-router v4.1.5 + * (c) 2022 Eduardo San Martin Morote + * @license MIT + */const en=typeof window<"u";function Hp(e){return e.__esModule||e[Symbol.toStringTag]==="Module"}const ie=Object.assign;function no(e,t){const n={};for(const r in t){const o=t[r];n[r]=tt(o)?o.map(e):e(o)}return n}const Hn=()=>{},tt=Array.isArray,Np=/\/$/,jp=e=>e.replace(Np,"");function ro(e,t,n="/"){let r,o={},s="",l="";const i=t.indexOf("#");let a=t.indexOf("?");return i=0&&(a=-1),a>-1&&(r=t.slice(0,a),s=t.slice(a+1,i>-1?i:t.length),o=e(s)),i>-1&&(r=r||t.slice(0,i),l=t.slice(i,t.length)),r=Kp(r!=null?r:t,n),{fullPath:r+(s&&"?")+s+l,path:r,query:o,hash:l}}function Fp(e,t){const n=t.query?e(t.query):"";return t.path+(n&&"?")+n+(t.hash||"")}function hl(e,t){return!t||!e.toLowerCase().startsWith(t.toLowerCase())?e:e.slice(t.length)||"/"}function Up(e,t,n){const r=t.matched.length-1,o=n.matched.length-1;return r>-1&&r===o&&mn(t.matched[r],n.matched[o])&&ha(t.params,n.params)&&e(t.query)===e(n.query)&&t.hash===n.hash}function mn(e,t){return(e.aliasOf||e)===(t.aliasOf||t)}function ha(e,t){if(Object.keys(e).length!==Object.keys(t).length)return!1;for(const n in e)if(!qp(e[n],t[n]))return!1;return!0}function qp(e,t){return tt(e)?gl(e,t):tt(t)?gl(t,e):e===t}function gl(e,t){return tt(t)?e.length===t.length&&e.every((n,r)=>n===t[r]):e.length===1&&e[0]===t}function Kp(e,t){if(e.startsWith("/"))return e;if(!e)return t;const n=t.split("/"),r=e.split("/");let o=n.length-1,s,l;for(s=0;s1&&o--;else break;return n.slice(0,o).join("/")+"/"+r.slice(s-(s===r.length?1:0)).join("/")}var zn;(function(e){e.pop="pop",e.push="push"})(zn||(zn={}));var Nn;(function(e){e.back="back",e.forward="forward",e.unknown=""})(Nn||(Nn={}));function Vp(e){if(!e)if(en){const t=document.querySelector("base");e=t&&t.getAttribute("href")||"/",e=e.replace(/^\w+:\/\/[^\/]+/,"")}else e="/";return e[0]!=="/"&&e[0]!=="#"&&(e="/"+e),jp(e)}const zp=/^[^#]+#/;function Wp(e,t){return e.replace(zp,"#")+t}function Yp(e,t){const n=document.documentElement.getBoundingClientRect(),r=e.getBoundingClientRect();return{behavior:t.behavior,left:r.left-n.left-(t.left||0),top:r.top-n.top-(t.top||0)}}const jr=()=>({left:window.pageXOffset,top:window.pageYOffset});function Qp(e){let t;if("el"in e){const n=e.el,r=typeof n=="string"&&n.startsWith("#"),o=typeof n=="string"?r?document.getElementById(n.slice(1)):document.querySelector(n):n;if(!o)return;t=Yp(o,e)}else t=e;"scrollBehavior"in document.documentElement.style?window.scrollTo(t):window.scrollTo(t.left!=null?t.left:window.pageXOffset,t.top!=null?t.top:window.pageYOffset)}function ml(e,t){return(history.state?history.state.position-t:-1)+e}const Oo=new Map;function Jp(e,t){Oo.set(e,t)}function Xp(e){const t=Oo.get(e);return Oo.delete(e),t}let Zp=()=>location.protocol+"//"+location.host;function ga(e,t){const{pathname:n,search:r,hash:o}=t,s=e.indexOf("#");if(s>-1){let i=o.includes(e.slice(s))?e.slice(s).length:1,a=o.slice(i);return a[0]!=="/"&&(a="/"+a),hl(a,"")}return hl(n,e)+r+o}function Gp(e,t,n,r){let o=[],s=[],l=null;const i=({state:p})=>{const g=ga(e,location),_=n.value,C=t.value;let R=0;if(p){if(n.value=g,t.value=p,l&&l===_){l=null;return}R=C?p.position-C.position:0}else r(g);o.forEach(y=>{y(n.value,_,{delta:R,type:zn.pop,direction:R?R>0?Nn.forward:Nn.back:Nn.unknown})})};function a(){l=n.value}function u(p){o.push(p);const g=()=>{const _=o.indexOf(p);_>-1&&o.splice(_,1)};return s.push(g),g}function c(){const{history:p}=window;!p.state||p.replaceState(ie({},p.state,{scroll:jr()}),"")}function f(){for(const p of s)p();s=[],window.removeEventListener("popstate",i),window.removeEventListener("beforeunload",c)}return window.addEventListener("popstate",i),window.addEventListener("beforeunload",c),{pauseListeners:a,listen:u,destroy:f}}function yl(e,t,n,r=!1,o=!1){return{back:e,current:t,forward:n,replaced:r,position:window.history.length,scroll:o?jr():null}}function eh(e){const{history:t,location:n}=window,r={value:ga(e,n)},o={value:t.state};o.value||s(r.value,{back:null,current:r.value,forward:null,position:t.length-1,replaced:!0,scroll:null},!0);function s(a,u,c){const f=e.indexOf("#"),p=f>-1?(n.host&&document.querySelector("base")?e:e.slice(f))+a:Zp()+e+a;try{t[c?"replaceState":"pushState"](u,"",p),o.value=u}catch(g){console.error(g),n[c?"replace":"assign"](p)}}function l(a,u){const c=ie({},t.state,yl(o.value.back,a,o.value.forward,!0),u,{position:o.value.position});s(a,c,!0),r.value=a}function i(a,u){const c=ie({},o.value,t.state,{forward:a,scroll:jr()});s(c.current,c,!0);const f=ie({},yl(r.value,a,null),{position:c.position+1},u);s(a,f,!1),r.value=a}return{location:r,state:o,push:i,replace:l}}function ma(e){e=Vp(e);const t=eh(e),n=Gp(e,t.state,t.location,t.replace);function r(s,l=!0){l||n.pauseListeners(),history.go(s)}const o=ie({location:"",base:e,go:r,createHref:Wp.bind(null,e)},t,n);return Object.defineProperty(o,"location",{enumerable:!0,get:()=>t.location.value}),Object.defineProperty(o,"state",{enumerable:!0,get:()=>t.state.value}),o}function th(e){return e=location.host?e||location.pathname+location.search:"",e.includes("#")||(e+="#"),ma(e)}function nh(e){return typeof e=="string"||e&&typeof e=="object"}function ya(e){return typeof e=="string"||typeof e=="symbol"}const Et={path:"/",name:void 0,params:{},query:{},hash:"",fullPath:"/",matched:[],meta:{},redirectedFrom:void 0},_a=Symbol("");var _l;(function(e){e[e.aborted=4]="aborted",e[e.cancelled=8]="cancelled",e[e.duplicated=16]="duplicated"})(_l||(_l={}));function yn(e,t){return ie(new Error,{type:e,[_a]:!0},t)}function at(e,t){return e instanceof Error&&_a in e&&(t==null||!!(e.type&t))}const vl="[^/]+?",rh={sensitive:!1,strict:!1,start:!0,end:!0},oh=/[.+*?^${}()[\]/\\]/g;function sh(e,t){const n=ie({},rh,t),r=[];let o=n.start?"^":"";const s=[];for(const u of e){const c=u.length?[]:[90];n.strict&&!u.length&&(o+="/");for(let f=0;ft.length?t.length===1&&t[0]===40+40?1:-1:0}function ih(e,t){let n=0;const r=e.score,o=t.score;for(;n0&&t[t.length-1]<0}const ah={type:0,value:""},uh=/[a-zA-Z0-9_]/;function ch(e){if(!e)return[[]];if(e==="/")return[[ah]];if(!e.startsWith("/"))throw new Error(`Invalid path "${e}"`);function t(g){throw new Error(`ERR (${n})/"${u}": ${g}`)}let n=0,r=n;const o=[];let s;function l(){s&&o.push(s),s=[]}let i=0,a,u="",c="";function f(){!u||(n===0?s.push({type:0,value:u}):n===1||n===2||n===3?(s.length>1&&(a==="*"||a==="+")&&t(`A repeatable param (${u}) must be alone in its segment. eg: '/:ids+.`),s.push({type:1,value:u,regexp:c,repeatable:a==="*"||a==="+",optional:a==="*"||a==="?"})):t("Invalid state to consume buffer"),u="")}function p(){u+=a}for(;i{l(h)}:Hn}function l(c){if(ya(c)){const f=r.get(c);f&&(r.delete(c),n.splice(n.indexOf(f),1),f.children.forEach(l),f.alias.forEach(l))}else{const f=n.indexOf(c);f>-1&&(n.splice(f,1),c.record.name&&r.delete(c.record.name),c.children.forEach(l),c.alias.forEach(l))}}function i(){return n}function a(c){let f=0;for(;f=0&&(c.record.path!==n[f].record.path||!va(c,n[f]));)f++;n.splice(f,0,c),c.record.name&&!El(c)&&r.set(c.record.name,c)}function u(c,f){let p,g={},_,C;if("name"in c&&c.name){if(p=r.get(c.name),!p)throw yn(1,{location:c});C=p.record.name,g=ie(wl(f.params,p.keys.filter(h=>!h.optional).map(h=>h.name)),c.params&&wl(c.params,p.keys.map(h=>h.name))),_=p.stringify(g)}else if("path"in c)_=c.path,p=n.find(h=>h.re.test(_)),p&&(g=p.parse(_),C=p.record.name);else{if(p=f.name?r.get(f.name):n.find(h=>h.re.test(f.path)),!p)throw yn(1,{location:c,currentLocation:f});C=p.record.name,g=ie({},f.params,c.params),_=p.stringify(g)}const R=[];let y=p;for(;y;)R.unshift(y.record),y=y.parent;return{name:C,path:_,params:g,matched:R,meta:gh(R)}}return e.forEach(c=>s(c)),{addRoute:s,resolve:u,removeRoute:l,getRoutes:i,getRecordMatcher:o}}function wl(e,t){const n={};for(const r of t)r in e&&(n[r]=e[r]);return n}function ph(e){return{path:e.path,redirect:e.redirect,name:e.name,meta:e.meta||{},aliasOf:void 0,beforeEnter:e.beforeEnter,props:hh(e),children:e.children||[],instances:{},leaveGuards:new Set,updateGuards:new Set,enterCallbacks:{},components:"components"in e?e.components||null:e.component&&{default:e.component}}}function hh(e){const t={},n=e.props||!1;if("component"in e)t.default=n;else for(const r in e.components)t[r]=typeof n=="boolean"?n:n[r];return t}function El(e){for(;e;){if(e.record.aliasOf)return!0;e=e.parent}return!1}function gh(e){return e.reduce((t,n)=>ie(t,n.meta),{})}function Cl(e,t){const n={};for(const r in e)n[r]=r in t?t[r]:e[r];return n}function va(e,t){return t.children.some(n=>n===e||va(e,n))}const ba=/#/g,mh=/&/g,yh=/\//g,_h=/=/g,vh=/\?/g,wa=/\+/g,bh=/%5B/g,wh=/%5D/g,Ea=/%5E/g,Eh=/%60/g,Ca=/%7B/g,Ch=/%7C/g,xa=/%7D/g,xh=/%20/g;function ds(e){return encodeURI(""+e).replace(Ch,"|").replace(bh,"[").replace(wh,"]")}function Rh(e){return ds(e).replace(Ca,"{").replace(xa,"}").replace(Ea,"^")}function Lo(e){return ds(e).replace(wa,"%2B").replace(xh,"+").replace(ba,"%23").replace(mh,"%26").replace(Eh,"`").replace(Ca,"{").replace(xa,"}").replace(Ea,"^")}function Ph(e){return Lo(e).replace(_h,"%3D")}function kh(e){return ds(e).replace(ba,"%23").replace(vh,"%3F")}function Sh(e){return e==null?"":kh(e).replace(yh,"%2F")}function Cr(e){try{return decodeURIComponent(""+e)}catch{}return""+e}function Ah(e){const t={};if(e===""||e==="?")return t;const r=(e[0]==="?"?e.slice(1):e).split("&");for(let o=0;os&&Lo(s)):[r&&Lo(r)]).forEach(s=>{s!==void 0&&(t+=(t.length?"&":"")+n,s!=null&&(t+="="+s))})}return t}function Th(e){const t={};for(const n in e){const r=e[n];r!==void 0&&(t[n]=tt(r)?r.map(o=>o==null?null:""+o):r==null?r:""+r)}return t}const Oh=Symbol(""),Rl=Symbol(""),ps=Symbol(""),hs=Symbol(""),Mo=Symbol("");function An(){let e=[];function t(r){return e.push(r),()=>{const o=e.indexOf(r);o>-1&&e.splice(o,1)}}function n(){e=[]}return{add:t,list:()=>e,reset:n}}function Rt(e,t,n,r,o){const s=r&&(r.enterCallbacks[o]=r.enterCallbacks[o]||[]);return()=>new Promise((l,i)=>{const a=f=>{f===!1?i(yn(4,{from:n,to:t})):f instanceof Error?i(f):nh(f)?i(yn(2,{from:t,to:f})):(s&&r.enterCallbacks[o]===s&&typeof f=="function"&&s.push(f),l())},u=e.call(r&&r.instances[o],t,n,a);let c=Promise.resolve(u);e.length<3&&(c=c.then(a)),c.catch(f=>i(f))})}function oo(e,t,n,r){const o=[];for(const s of e)for(const l in s.components){let i=s.components[l];if(!(t!=="beforeRouteEnter"&&!s.instances[l]))if(Lh(i)){const u=(i.__vccOpts||i)[t];u&&o.push(Rt(u,n,r,s,l))}else{let a=i();o.push(()=>a.then(u=>{if(!u)return Promise.reject(new Error(`Couldn't resolve component "${l}" at "${s.path}"`));const c=Hp(u)?u.default:u;s.components[l]=c;const p=(c.__vccOpts||c)[t];return p&&Rt(p,n,r,s,l)()}))}}return o}function Lh(e){return typeof e=="object"||"displayName"in e||"props"in e||"__vccOpts"in e}function Pl(e){const t=Ge(ps),n=Ge(hs),r=xe(()=>t.resolve(be(e.to))),o=xe(()=>{const{matched:a}=r.value,{length:u}=a,c=a[u-1],f=n.matched;if(!c||!f.length)return-1;const p=f.findIndex(mn.bind(null,c));if(p>-1)return p;const g=kl(a[u-2]);return u>1&&kl(c)===g&&f[f.length-1].path!==g?f.findIndex(mn.bind(null,a[u-2])):p}),s=xe(()=>o.value>-1&&$h(n.params,r.value.params)),l=xe(()=>o.value>-1&&o.value===n.matched.length-1&&ha(n.params,r.value.params));function i(a={}){return Ih(a)?t[be(e.replace)?"replace":"push"](be(e.to)).catch(Hn):Promise.resolve()}return{route:r,href:xe(()=>r.value.href),isActive:s,isExactActive:l,navigate:i}}const Mh=Le({name:"RouterLink",compatConfig:{MODE:3},props:{to:{type:[String,Object],required:!0},replace:Boolean,activeClass:String,exactActiveClass:String,custom:Boolean,ariaCurrentValue:{type:String,default:"page"}},useLink:Pl,setup(e,{slots:t}){const n=et(Pl(e)),{options:r}=Ge(ps),o=xe(()=>({[Sl(e.activeClass,r.linkActiveClass,"router-link-active")]:n.isActive,[Sl(e.exactActiveClass,r.linkExactActiveClass,"router-link-exact-active")]:n.isExactActive}));return()=>{const s=t.default&&t.default(n);return e.custom?s:ye("a",{"aria-current":n.isExactActive?e.ariaCurrentValue:null,href:n.href,onClick:n.navigate,class:o.value},s)}}}),Dh=Mh;function Ih(e){if(!(e.metaKey||e.altKey||e.ctrlKey||e.shiftKey)&&!e.defaultPrevented&&!(e.button!==void 0&&e.button!==0)){if(e.currentTarget&&e.currentTarget.getAttribute){const t=e.currentTarget.getAttribute("target");if(/\b_blank\b/i.test(t))return}return e.preventDefault&&e.preventDefault(),!0}}function $h(e,t){for(const n in t){const r=t[n],o=e[n];if(typeof r=="string"){if(r!==o)return!1}else if(!tt(o)||o.length!==r.length||r.some((s,l)=>s!==o[l]))return!1}return!0}function kl(e){return e?e.aliasOf?e.aliasOf.path:e.path:""}const Sl=(e,t,n)=>e!=null?e:t!=null?t:n,Bh=Le({name:"RouterView",inheritAttrs:!1,props:{name:{type:String,default:"default"},route:Object},compatConfig:{MODE:3},setup(e,{attrs:t,slots:n}){const r=Ge(Mo),o=xe(()=>e.route||r.value),s=Ge(Rl,0),l=xe(()=>{let u=be(s);const{matched:c}=o.value;let f;for(;(f=c[u])&&!f.components;)u++;return u}),i=xe(()=>o.value.matched[l.value]);an(Rl,xe(()=>l.value+1)),an(Oh,i),an(Mo,o);const a=Ve();return je(()=>[a.value,i.value,e.name],([u,c,f],[p,g,_])=>{c&&(c.instances[f]=u,g&&g!==c&&u&&u===p&&(c.leaveGuards.size||(c.leaveGuards=g.leaveGuards),c.updateGuards.size||(c.updateGuards=g.updateGuards))),u&&c&&(!g||!mn(c,g)||!p)&&(c.enterCallbacks[f]||[]).forEach(C=>C(u))},{flush:"post"}),()=>{const u=o.value,c=e.name,f=i.value,p=f&&f.components[c];if(!p)return Al(n.default,{Component:p,route:u});const g=f.props[c],_=g?g===!0?u.params:typeof g=="function"?g(u):g:null,R=ye(p,ie({},_,t,{onVnodeUnmounted:y=>{y.component.isUnmounted&&(f.instances[c]=null)},ref:a}));return Al(n.default,{Component:R,route:u})||R}}});function Al(e,t){if(!e)return null;const n=e(t);return n.length===1?n[0]:n}const Ra=Bh;function Hh(e){const t=dh(e.routes,e),n=e.parseQuery||Ah,r=e.stringifyQuery||xl,o=e.history,s=An(),l=An(),i=An(),a=po(Et);let u=Et;en&&e.scrollBehavior&&"scrollRestoration"in history&&(history.scrollRestoration="manual");const c=no.bind(null,x=>""+x),f=no.bind(null,Sh),p=no.bind(null,Cr);function g(x,N){let $,K;return ya(x)?($=t.getRecordMatcher(x),K=N):K=x,t.addRoute(K,$)}function _(x){const N=t.getRecordMatcher(x);N&&t.removeRoute(N)}function C(){return t.getRoutes().map(x=>x.record)}function R(x){return!!t.getRecordMatcher(x)}function y(x,N){if(N=ie({},N||a.value),typeof x=="string"){const d=ro(n,x,N.path),m=t.resolve({path:d.path},N),b=o.createHref(d.fullPath);return ie(d,m,{params:p(m.params),hash:Cr(d.hash),redirectedFrom:void 0,href:b})}let $;if("path"in x)$=ie({},x,{path:ro(n,x.path,N.path).path});else{const d=ie({},x.params);for(const m in d)d[m]==null&&delete d[m];$=ie({},x,{params:f(x.params)}),N.params=f(N.params)}const K=t.resolve($,N),se=x.hash||"";K.params=c(p(K.params));const me=Fp(r,ie({},x,{hash:Rh(se),path:K.path})),ee=o.createHref(me);return ie({fullPath:me,hash:se,query:r===xl?Th(x.query):x.query||{}},K,{redirectedFrom:void 0,href:ee})}function h(x){return typeof x=="string"?ro(n,x,a.value.path):ie({},x)}function v(x,N){if(u!==x)return yn(8,{from:N,to:x})}function w(x){return I(x)}function T(x){return w(ie(h(x),{replace:!0}))}function O(x){const N=x.matched[x.matched.length-1];if(N&&N.redirect){const{redirect:$}=N;let K=typeof $=="function"?$(x):$;return typeof K=="string"&&(K=K.includes("?")||K.includes("#")?K=h(K):{path:K},K.params={}),ie({query:x.query,hash:x.hash,params:"path"in K?{}:x.params},K)}}function I(x,N){const $=u=y(x),K=a.value,se=x.state,me=x.force,ee=x.replace===!0,d=O($);if(d)return I(ie(h(d),{state:typeof d=="object"?ie({},se,d.state):se,force:me,replace:ee}),N||$);const m=$;m.redirectedFrom=N;let b;return!me&&Up(r,K,$)&&(b=yn(16,{to:m,from:K}),Mt(K,K,!0,!1)),(b?Promise.resolve(b):U(m,K)).catch(E=>at(E)?at(E,2)?E:Ye(E):ce(E,m,K)).then(E=>{if(E){if(at(E,2))return I(ie({replace:ee},h(E.to),{state:typeof E.to=="object"?ie({},se,E.to.state):se,force:me}),N||m)}else E=W(m,K,!0,ee,se);return F(m,K,E),E})}function k(x,N){const $=v(x,N);return $?Promise.reject($):Promise.resolve()}function U(x,N){let $;const[K,se,me]=Nh(x,N);$=oo(K.reverse(),"beforeRouteLeave",x,N);for(const d of K)d.leaveGuards.forEach(m=>{$.push(Rt(m,x,N))});const ee=k.bind(null,x,N);return $.push(ee),Zt($).then(()=>{$=[];for(const d of s.list())$.push(Rt(d,x,N));return $.push(ee),Zt($)}).then(()=>{$=oo(se,"beforeRouteUpdate",x,N);for(const d of se)d.updateGuards.forEach(m=>{$.push(Rt(m,x,N))});return $.push(ee),Zt($)}).then(()=>{$=[];for(const d of x.matched)if(d.beforeEnter&&!N.matched.includes(d))if(tt(d.beforeEnter))for(const m of d.beforeEnter)$.push(Rt(m,x,N));else $.push(Rt(d.beforeEnter,x,N));return $.push(ee),Zt($)}).then(()=>(x.matched.forEach(d=>d.enterCallbacks={}),$=oo(me,"beforeRouteEnter",x,N),$.push(ee),Zt($))).then(()=>{$=[];for(const d of l.list())$.push(Rt(d,x,N));return $.push(ee),Zt($)}).catch(d=>at(d,8)?d:Promise.reject(d))}function F(x,N,$){for(const K of i.list())K(x,N,$)}function W(x,N,$,K,se){const me=v(x,N);if(me)return me;const ee=N===Et,d=en?history.state:{};$&&(K||ee?o.replace(x.fullPath,ie({scroll:ee&&d&&d.scroll},se)):o.push(x.fullPath,se)),a.value=x,Mt(x,N,$,ee),Ye()}let H;function Z(){H||(H=o.listen((x,N,$)=>{if(!Zn.listening)return;const K=y(x),se=O(K);if(se){I(ie(se,{replace:!0}),K).catch(Hn);return}u=K;const me=a.value;en&&Jp(ml(me.fullPath,$.delta),jr()),U(K,me).catch(ee=>at(ee,12)?ee:at(ee,2)?(I(ee.to,K).then(d=>{at(d,20)&&!$.delta&&$.type===zn.pop&&o.go(-1,!1)}).catch(Hn),Promise.reject()):($.delta&&o.go(-$.delta,!1),ce(ee,K,me))).then(ee=>{ee=ee||W(K,me,!1),ee&&($.delta&&!at(ee,8)?o.go(-$.delta,!1):$.type===zn.pop&&at(ee,20)&&o.go(-1,!1)),F(K,me,ee)}).catch(Hn)}))}let j=An(),Ae=An(),oe;function ce(x,N,$){Ye(x);const K=Ae.list();return K.length?K.forEach(se=>se(x,N,$)):console.error(x),Promise.reject(x)}function ae(){return oe&&a.value!==Et?Promise.resolve():new Promise((x,N)=>{j.add([x,N])})}function Ye(x){return oe||(oe=!x,Z(),j.list().forEach(([N,$])=>x?$(x):N()),j.reset()),x}function Mt(x,N,$,K){const{scrollBehavior:se}=e;if(!en||!se)return Promise.resolve();const me=!$&&Xp(ml(x.fullPath,0))||(K||!$)&&history.state&&history.state.scroll||null;return En().then(()=>se(x,N,me)).then(ee=>ee&&Qp(ee)).catch(ee=>ce(ee,x,N))}const Qe=x=>o.go(x);let $e;const Jt=new Set,Zn={currentRoute:a,listening:!0,addRoute:g,removeRoute:_,hasRoute:R,getRoutes:C,resolve:y,options:e,push:w,replace:T,go:Qe,back:()=>Qe(-1),forward:()=>Qe(1),beforeEach:s.add,beforeResolve:l.add,afterEach:i.add,onError:Ae.add,isReady:ae,install(x){const N=this;x.component("RouterLink",Dh),x.component("RouterView",Ra),x.config.globalProperties.$router=N,Object.defineProperty(x.config.globalProperties,"$route",{enumerable:!0,get:()=>be(a)}),en&&!$e&&a.value===Et&&($e=!0,w(o.location).catch(se=>{}));const $={};for(const se in Et)$[se]=xe(()=>a.value[se]);x.provide(ps,N),x.provide(hs,et($)),x.provide(Mo,a);const K=x.unmount;Jt.add(x),x.unmount=function(){Jt.delete(x),Jt.size<1&&(u=Et,H&&H(),H=null,a.value=Et,$e=!1,oe=!1),K()}}};return Zn}function Zt(e){return e.reduce((t,n)=>t.then(()=>n()),Promise.resolve())}function Nh(e,t){const n=[],r=[],o=[],s=Math.max(t.matched.length,e.matched.length);for(let l=0;lmn(u,i))?r.push(i):n.push(i));const a=e.matched[l];a&&(t.matched.find(u=>mn(u,a))||o.push(a))}return[n,r,o]}function jh(){return Ge(hs)}const Fh=/[0-9]/;function Uh(e=""){return Fh.test(e)?null:e.toUpperCase()===e}const qh=["-","_","/","."];function Kh(e,t=qh){const n=[];if(!e||typeof e!="string")return n;let r="",o=null,s=null;for(const l of e.split("")){const i=t.includes(l);if(i===!0){n.push(r),r="",o=null;continue}const a=Uh(l);if(s===!1){if(o===!1&&a===!0){n.push(r),r=l,o=a;continue}if(o===!0&&a===!1&&r.length>1){const u=r[r.length-1];n.push(r.substr(0,r.length-1)),r=u+l,o=a;continue}}r+=l,o=a,s=i}return n.push(r),n}function Vh(e){return e?e[0].toUpperCase()+e.substring(1):""}function zh(e=""){return(Array.isArray(e)?e:Kh(e)).map(t=>Vh(t)).join("")}class Xn{constructor(t,n,r){this.property=t,this.normal=n,r&&(this.space=r)}}Xn.prototype.property={};Xn.prototype.normal={};Xn.prototype.space=null;function Pa(e,t){const n={},r={};let o=-1;for(;++o4&&n.slice(0,4)==="data"&&Xh.test(t)){if(t.charAt(4)==="-"){const s=t.slice(5).replace(Ol,tg);r="data"+s.charAt(0).toUpperCase()+s.slice(1)}else{const s=t.slice(4);if(!Ol.test(s)){let l=s.replace(Zh,eg);l.charAt(0)!=="-"&&(l="-"+l),t="data"+l}}o=gs}return new o(r,t)}function eg(e){return"-"+e.toLowerCase()}function tg(e){return e.charAt(1).toUpperCase()}const ng=Pa([Aa,Sa,La,Ma,Qh],"html");Pa([Aa,Sa,La,Ma,Jh],"svg");var Hm=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{};function rg(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var Da={exports:{}};const og=["a","abbr","address","area","article","aside","audio","b","base","bdi","bdo","blockquote","body","br","button","canvas","caption","cite","code","col","colgroup","data","datalist","dd","del","details","dfn","dialog","div","dl","dt","em","embed","fieldset","figcaption","figure","footer","form","h1","h2","h3","h4","h5","h6","head","header","hgroup","hr","html","i","iframe","img","input","ins","kbd","label","legend","li","link","main","map","mark","math","menu","menuitem","meta","meter","nav","noscript","object","ol","optgroup","option","output","p","param","picture","pre","progress","q","rb","rp","rt","rtc","ruby","s","samp","script","section","select","slot","small","source","span","strong","style","sub","summary","sup","svg","table","tbody","td","template","textarea","tfoot","th","thead","time","title","tr","track","u","ul","var","video","wbr"];(function(e){e.exports=og})(Da);const Ia=rg(Da.exports),jn="default",$a=/^@|^v-on:/,Ba=/^:|^v-bind:/,Ha=/^v-model/,sg=["select","textarea","input"],Na=Le({name:"ContentRendererMarkdown",props:{value:{type:Object,required:!0},excerpt:{type:Boolean,default:!1},tag:{type:String,default:"div"},components:{type:Object,default:()=>({})}},async setup(e){var n;const{content:{tags:t={}}}=xn().public;return await gg(e.value.body,{tags:{...t,...((n=e.value)==null?void 0:n._components)||{},...e.components}}),{tags:t}},render(e){var u;const{tags:t,tag:n,value:r,components:o}=e;if(!r)return null;let s=r.body||r;e.excerpt&&r.excerpt&&(s=r.excerpt);const l={...r,tags:{...t,...(r==null?void 0:r._components)||{},...o}};let i=l.component||n;typeof l.component=="object"&&(i=l.component.name),i=ja(i);const a=(s.children||[]).map(c=>ur(c,ye,l));return ye(i,{...(u=l.component)==null?void 0:u.props,...this.$attrs},{default:Ua(a)})}});function ur(e,t,n,r={}){var a;if(e.type==="text")return t(ht,e.value);const o=e.tag,s=typeof((a=e.props)==null?void 0:a.__ignoreMap)>"u"&&n.tags[o]||o;if(e.tag==="binding")return lg(e,t,n,r);const l=ja(s);typeof l=="object"&&(l.tag=o);const i=ag(e,n);return t(l,i,ig(e,t,n,{...r,...i}))}function lg(e,t,n,r={}){var a;const o={...r,$route:()=>Rn(),$document:n,$doc:n},s=/\.|\[(\d+)\]/,i=((a=e.props)==null?void 0:a.value.trim().split(s).filter(Boolean)).reduce((u,c)=>c in u?typeof u[c]=="function"?u[c]():u[c]:{},o);return t(ht,i)}function ig(e,t,n,r){const s=(e.children||[]).reduce((i,a)=>{if(!qa(a))return i[jn].push(ur(a,t,n,r)),i;if(pg(a))return i[jn].push(...(a.children||[]).map(c=>ur(c,t,n,r))),i;const u=Fa(a);return i[u]=(a.children||[]).map(c=>ur(c,t,n,r)),i},{[jn]:[]}),l=Object.entries(s).map(([i,a])=>[i,Ua(a)]);return Object.fromEntries(l)}function ag(e,t){const{tag:n="",props:r={}}=e;return Object.keys(r).reduce(function(o,s){if(s==="__ignoreMap")return o;const l=r[s];if(Ha.test(s)&&!sg.includes(n))return ug(s,l,o,t);if(s==="v-bind")return cg(s,l,o,t);if($a.test(s))return fg(s,l,o,t);if(Ba.test(s))return dg(s,l,o,t);const{attribute:i}=Gh(ng,s);return Array.isArray(l)&&l.every(a=>typeof a=="string")?(o[i]=l.join(" "),o):(o[i]=l,o)},{})}function ug(e,t,n,r){const o=f=>+f,s=f=>f.trim(),l=f=>f,i=e.replace(Ha,"").split(".").filter(f=>f).reduce((f,p)=>(f[p]=!0,f),{}),a="value",u=i.lazy?"change":"input",c=i.number?o:i.trim?s:l;return n[a]=Fr(t,r),n.on=n.on||{},n.on[u]=f=>r[t]=c(f),n}function cg(e,t,n,r){const o=Fr(t,r);return n=Object.assign(n,o),n}function fg(e,t,n,r){return e=e.replace($a,""),n.on=n.on||{},n.on[e]=()=>Fr(t,r),n}function dg(e,t,n,r){return e=e.replace(Ba,""),n[e]=Fr(t,r),n}const ja=e=>{if(!Ia.includes(e)){const t=Mr(zh(e),!1);if(typeof t=="object")return t}return e};function Fr(e,t){const n=e.split(".").reduce((r,o)=>typeof r=="object"?r[o]:void 0,t);return typeof n>"u"?us(e):n}function Fa(e){let t="";for(const n of Object.keys(e.props||{}))if(!(!n.startsWith("#")&&!n.startsWith("v-slot:"))){t=n.split(/[:#]/,2)[1];break}return t||jn}function Ua(e){return e.length?()=>hg(e):void 0}function pg(e){return qa(e)&&Fa(e)===jn}function qa(e){return e.tag==="template"}function hg(e){const t=[];for(const n of e){const r=t[t.length-1];n.type===ht&&(r==null?void 0:r.type)===ht?r.children=r.children+n.children:t.push(n)}return t}async function gg(e,t){const n=Array.from(new Set(r(e,t)));await Promise.all(n.map(async o=>{const s=Mr(o);(s==null?void 0:s.__asyncLoader)&&!s.__asyncResolved&&await s.__asyncLoader()}));function r(o,s){var a;if(o.type==="text"||o.tag==="binding")return[];const l=typeof((a=o.props)==null?void 0:a.__ignoreMap)>"u"&&s.tags[o.tag]||o.tag,i=[];o.type!=="root"&&!Ia.includes(l)&&i.push(l);for(const u of o.children||[])i.push(...r(u,s));return i}}const mg=Object.freeze(Object.defineProperty({__proto__:null,default:Na},Symbol.toStringTag,{value:"Module"})),Ka=Le({name:"ContentRenderer",props:{value:{type:Object,required:!1,default:()=>({})},excerpt:{type:Boolean,default:!1},tag:{type:String,default:"div"}},setup(e){je(()=>e.excerpt,t=>{var n,r,o;t&&!((n=e.value)!=null&&n.excerpt)&&(console.warn(`No excerpt found for document content/${(r=e==null?void 0:e.value)==null?void 0:r._path}.${(o=e==null?void 0:e.value)==null?void 0:o._extension}!`),console.warn("Make sure to use in your content if you want to use excerpt feature."))},{immediate:!0})},render(e){var s,l;const t=as(),{value:n,excerpt:r,tag:o}=e;return!n&&(t==null?void 0:t.empty)?t.empty({value:n,excerpt:r,tag:o,...this.$attrs}):t!=null&&t.default?t.default({value:n,excerpt:r,tag:o,...this.$attrs}):n&&(n==null?void 0:n._type)==="markdown"&&((l=(s=n==null?void 0:n.body)==null?void 0:s.children)==null?void 0:l.length)?ye(Na,{value:n,excerpt:r,tag:o,...this.$attrs}):ye("pre",null,JSON.stringify({message:"You should use slots with ",value:n,excerpt:r,tag:o},null,2))}}),yg=Object.freeze(Object.defineProperty({__proto__:null,default:Ka},Symbol.toStringTag,{value:"Module"}));function _g(e){return JSON.stringify(e,vg)}function vg(e,t){return t instanceof RegExp?`--REGEX ${t.toString()}`:t}const bg=["p","h1","h2","h3","h4","h5","h6","li"];function $o(e,t){return e.type===t||typeof e.type=="object"&&e.type.tag===t||e.tag===t}function Va(e){return $o(e,"text")||typeof e.children=="string"}function za(e){return Array.isArray(e.children)||typeof e.children=="string"?e.children:typeof e.children.default=="function"?e.children.default():[]}function Bo(e){if(!e)return"";if(Array.isArray(e))return e.map(Bo).join("");if(Va(e))return e.children||e.value;const t=za(e);return Array.isArray(t)?t.map(Bo).join(""):""}function ms(e,t=["p"]){if(Array.isArray(e))return e.flatMap(r=>ms(r,t));let n=e;return t.some(r=>r==="*"||$o(e,r))&&(n=za(e)||e,!Array.isArray(n)&&bg.some(r=>$o(e,r))&&(n=[n])),n}function Wa(e,t=["p"]){return e=Array.isArray(e)?e:[e],t.length?e.flatMap(n=>Wa(ms(n,[t[0]]),t.slice(1))).filter(n=>!(Va(n)&&Bo(n).trim()==="")):e}const wg=e=>Ji(e,"/api/"+xn().public.content.base),Nm=()=>({unwrap:ms,flatUnwrap:Wa}),jm=()=>{throw console.warn("useContent is only accessible when you are using `documentDriven` mode."),console.warn("Learn more by visiting: https://content.nuxtjs.org/guide/writing/document-driven"),new Error("useContent is only accessible when you are using `documentDriven` mode.")},Eg=()=>{var t;const{clientDB:e}=xn().content;return!!(e!=null&&e.isSPA||((t=Rn().query)==null?void 0:t.preview)||ia("previewToken").value)},Cg="_list_1w161_1",Fm={list:Cg},Ya=(e,t)=>{const n=e.__vccOpts||e;for(const[r,o]of t)n[r]=o;return n},Ll=(e,t=Rn())=>{const n=be(e);je(()=>be(e),(o=n)=>{if(!t.path||!o)return;const s=Object.assign({},(o==null?void 0:o.head)||{}),l=s.title||(o==null?void 0:o.title);l&&(s.title=l),s.meta=[...s.meta||[]];const i=(s==null?void 0:s.description)||(o==null?void 0:o.description);i&&s.meta.filter(u=>u.name==="description").length===0&&s.meta.push({name:"description",content:i});const a=(s==null?void 0:s.image)||(o==null?void 0:o.image);if(a&&s.meta.filter(u=>u.property==="og:image").length===0&&(typeof a=="string"&&s.meta.push({property:"og:image",content:a}),typeof a=="object")){const u=["src","secure_url","type","width","height","alt"];for(const c of u)c==="src"&&a.src?s.meta.push({property:"og:image",content:a[c]}):a[c]&&s.meta.push({property:`og:image:${c}`,content:a[c]})}En(()=>fa(s))},{immediate:!0})},Ml=(e,t)=>t.split(".").reduce((n,r)=>n&&n[r],e),Qa=(e,t)=>Object.keys(e).filter(t).reduce((n,r)=>Object.assign(n,{[r]:e[r]}),{}),Um=e=>t=>Array.isArray(t)?t.map(n=>e(n)):e(t),Ja=e=>{const t=[],n=[];for(const r of e)["$","_"].includes(r)?t.push(r):n.push(r);return{prefixes:t,properties:n}},qm=(e=[])=>t=>{if(e.length===0||!t)return t;const{prefixes:n,properties:r}=Ja(e);return Qa(t,o=>!r.includes(o)&&!n.includes(o[0]))},Km=(e=[])=>t=>{if(e.length===0||!t)return t;const{prefixes:n,properties:r}=Ja(e);return Qa(t,o=>r.includes(o)||n.includes(o[0]))},Vm=(e,t)=>{const n=new Intl.Collator(t.$locale,{numeric:t.$numeric,caseFirst:t.$caseFirst,sensitivity:t.$sensitivity}),r=Object.keys(t).filter(o=>!o.startsWith("$"));for(const o of r)e=e.sort((s,l)=>{const i=[Ml(s,o),Ml(l,o)].map(a=>{if(a!==null)return a instanceof Date?a.toISOString():a});return t[o]===-1&&i.reverse(),n.compare(i[0],i[1])});return e},zm=(e,t="Expected an array")=>{if(!Array.isArray(e))throw new TypeError(t)},Gt=e=>Array.isArray(e)?e:e?[e]:[],xg=["sort","where","only","without"],Dl=(e,t)=>{const n={...t};for(const s of xg)n[s]&&(n[s]=Gt(n[s]));const r=(s,l=i=>i)=>(...i)=>(n[s]=l(...i),o),o={params:()=>n,only:r("only",Gt),without:r("without",Gt),where:r("where",s=>[...Gt(n.where),s]),sort:r("sort",s=>[...Gt(n.sort),...Gt(s)]),limit:r("limit",s=>parseInt(String(s),10)),skip:r("skip",s=>parseInt(String(s),10)),find:()=>e(o),findOne:()=>(n.first=!0,e(o)),findSurround:(s,l)=>(n.surround={query:s,...l},e(o)),locale:s=>o.where({_locale:s})};return o},Il=e=>async t=>{var s;e&&(t.params().first&&(t.params().where||[]).length===0?t.where({_path:cs(e)}):t.where({_path:new RegExp(`^${e.replace(/[-[\]{}()*+.,^$\s/]/g,"\\$&")}`)})),(s=t.params().sort)!=null&&s.length||t.sort({_file:1,$numeric:!0});const n=t.params(),r=wg(`/query/${la(n)}.json`);if(Eg())return(await Q(()=>import("./client-db.ba528d0d.js"),[],import.meta.url).then(i=>i.useContentDatabase())).fetch(t);const o=await $fetch(r,{method:"GET",responseType:"json",params:{_params:_g(n),previewToken:ia("previewToken").value}});if(typeof o=="string"&&o.startsWith(""))throw new Error("Not found");return o};function $l(e,...t){return typeof e=="string"?Dl(Il(Jf(Jn(e,...t)))):Dl(Il(),e)}const Xa=Le({name:"ContentQuery",props:{path:{type:String,required:!1,default:void 0},only:{type:Array,required:!1,default:void 0},without:{type:Array,required:!1,default:void 0},where:{type:Object,required:!1,default:void 0},sort:{type:Object,required:!1,default:void 0},limit:{type:Number,required:!1,default:void 0},skip:{type:Number,required:!1,default:void 0},locale:{type:String,required:!1,default:void 0},find:{type:String,required:!1,default:void 0}},async setup(e){const{path:t,only:n,without:r,where:o,sort:s,limit:l,skip:i,locale:a,find:u}=ai(e),c=xe(()=>{var g;return(g=t.value)==null?void 0:g.includes("/_")}),{data:f,refresh:p}=await Ad(`content-query-${la(e)}`,()=>{let g;return t.value?g=$l(t.value):g=$l(),n.value&&(g=g.only(n.value)),r.value&&(g=g.without(r.value)),o.value&&(g=g.where(o.value)),s.value&&(g=g.sort(s.value)),l.value&&(g=g.limit(l.value)),i.value&&(g=g.skip(i.value)),a.value&&(g=g.where({_locale:a.value})),u.value==="one"?g.findOne():u.value==="surround"?t.value?g.findSurround(t):(console.warn("[Content] Surround queries requires `path` prop to be set."),console.warn("[Content] Query without `path` will return regular `find()` results."),g.find()):g.find()});return{isPartial:c,data:f,refresh:p}},render(e){var R;const t=as(),{data:n,refresh:r,isPartial:o,path:s,only:l,without:i,where:a,sort:u,limit:c,skip:f,locale:p,find:g}=e,_={path:s,only:l,without:i,where:a,sort:u,limit:c,skip:f,locale:p,find:g};if(_.find==="one"){if(!n&&(t==null?void 0:t["not-found"]))return t["not-found"]({props:_,...this.$attrs});if((n==null?void 0:n._type)==="markdown"&&!((R=n==null?void 0:n.body)!=null&&R.children.length))return t.empty({props:_,...this.$attrs})}else if((!n||!n.length)&&t!=null&&t["not-found"])return t["not-found"]({props:_,...this.$attrs});return t!=null&&t.default?t.default({data:n,refresh:r,isPartial:o,props:_,...this.$attrs}):((y,h)=>ye("pre",null,JSON.stringify({message:"You should use slots with !",slot:y,data:h},null,2)))("default",{data:n,props:_,isPartial:o})}}),Rg=Object.freeze(Object.defineProperty({__proto__:null,default:Xa},Symbol.toStringTag,{value:"Module"})),Pg=Le({name:"ContentDoc",props:{tag:{type:String,required:!1,default:"div"},excerpt:{type:Boolean,default:!1},path:{type:String,required:!1,default:void 0},query:{type:Object,required:!1,default:void 0},head:{type:Boolean,required:!1,default:!0}},render(e){const t=as(),{tag:n,excerpt:r,path:o,query:s,head:l}=e,i={...s||{},path:o||(s==null?void 0:s.path)||Yi(Rn().path),find:"one"},a=(u,c)=>ye("pre",null,JSON.stringify({message:"You should use slots with ",slot:u,data:c},null,2));return ye(Xa,i,{default:t!=null&&t.default?({data:u,refresh:c,isPartial:f})=>{var p;return l&&Ll(u),(p=t.default)==null?void 0:p.call(t,{doc:u,refresh:c,isPartial:f,excerpt:r,...this.$attrs})}:({data:u})=>(l&&Ll(u),ye(Ka,{value:u,excerpt:r,tag:n,...this.$attrs},{empty:c=>t!=null&&t.empty?t.empty(c):a("default",u)})),empty:u=>{var c;return((c=t==null?void 0:t.empty)==null?void 0:c.call(t,u))||ye("p",null,"Document is empty, overwrite this content with #empty slot in .")},"not-found":u=>{var c;return((c=t==null?void 0:t["not-found"])==null?void 0:c.call(t,u))||ye("p",null,"Document not found, overwrite this content with #not-found slot in .")}})}}),kg=Object.freeze(Object.defineProperty({__proto__:null,default:Pg},Symbol.toStringTag,{value:"Module"})),Ht=void 0,Nt={layout:"landing"},jt={layout:"landing"},Sg="_button_15t7y_1",Ag="_prefixed_15t7y_42",Tg="_suffixed_15t7y_42",Og="_title_15t7y_49",Lg="_prefix_15t7y_42",Mg="_suffix_15t7y_42",Wm={button:Sg,"variant-primary":"_variant-primary_15t7y_9","variant-outline":"_variant-outline_15t7y_12","size-md":"_size-md_15t7y_38",prefixed:Ag,suffixed:Tg,title:Og,prefix:Lg,suffix:Mg},Dg="_highlight_9h226_139",Ig="_light_9h226_194",$g="_buttons_9h226_233",Ym={"page-enter-active":"_page-enter-active_9h226_2","page-leave-active":"_page-leave-active_9h226_3","page-enter-from":"_page-enter-from_9h226_7","page-leave-to":"_page-leave-to_9h226_8",highlight:Dg,light:Ig,buttons:$g},Bg="_grid_1s2ro_1",Hg="_image_1s2ro_16",Ng="_title_1s2ro_27",jg="_subtitle_1s2ro_31",Fg="_text_1s2ro_41",Ug="_desk_1s2ro_60",qg="_buttons_1s2ro_69",Qm={grid:Bg,image:Hg,title:Ng,subtitle:jg,text:Fg,desk:Ug,buttons:qg},Kg=Le({mounted(){const e=document.querySelector(`.${this.$style.link}.${this.$style.active}`);!e||e==null||e.scrollIntoView({block:"center"})}}),Vg=Le({...Kg,__name:"LayoutMainMenuRow",props:{title:null,url:null,children:null,secondary:{type:Boolean}},setup(e){return(t,n)=>{var s;const r=Za,o=ca;return((s=e.children)==null?void 0:s.length)||!e.url?(Oe(),Pt("div",{key:0,class:dt([t.$style.container,{[t.$style.secondary]:e.secondary}])},[vr("div",{class:dt(t.$style.heading)},io(e.title),3),vr("div",{class:dt(t.$style.children)},[(Oe(!0),Pt(ke,null,mo(e.children,l=>(Oe(),Wt(r,{key:"item._path",title:l.title,url:l._path,children:l.children,secondary:""},null,8,["title","url","children"]))),128))],2)],2)):(Oe(),Pt("div",{key:1,class:dt(t.$style.row)},[ge(o,{to:e.url,class:dt(t.$style.link),exactActiveClass:t.$style.active},{default:Or(()=>[Ir(io(e.title),1)]),_:1},8,["to","class","exactActiveClass"])],2))}}}),zg="_container_192pu_1",Wg="_secondary_192pu_4",Yg="_row_192pu_24",Qg="_heading_192pu_48",Jg="_link_192pu_66",Xg="_active_192pu_81",Zg="_children_192pu_86",Gg={container:zg,secondary:Wg,row:Yg,heading:Qg,link:Jg,active:Xg,children:Zg},em={$style:Gg},Za=Ya(Vg,[["__cssModules",em]]),Jm=Object.freeze(Object.defineProperty({__proto__:null,default:Za},Symbol.toStringTag,{value:"Module"})),tm="_row_1ufrv_1",Xm={row:tm},nm="_main_su98q_1",rm="_reference_su98q_22",om="_grid_su98q_26",Zm={main:nm,reference:rm,grid:om},Ft={layout:"landing"},Bl=[{name:"slug",path:"/:slug(.*)*",file:"/drone/src/pages/[...slug].vue",children:[],meta:Ht,alias:(Ht==null?void 0:Ht.alias)||[],redirect:(Ht==null?void 0:Ht.redirect)||void 0,component:()=>Q(()=>import("./_...slug_.63d24149.js"),["_...slug_.63d24149.js","_...slug_.23599aab.css","HomeReference.bf6fb900.js","navigation.c88a11e6.js"],import.meta.url).then(e=>e.default||e)},{name:"about",path:"/about",file:"/drone/src/pages/about.vue",children:[],meta:Nt,alias:(Nt==null?void 0:Nt.alias)||[],redirect:(Nt==null?void 0:Nt.redirect)||void 0,component:()=>Q(()=>import("./about.8a9181bf.js"),["about.8a9181bf.js","about.9cff0ef5.css","BioHeading.1e2de442.js","IconsSend.9f60ece7.js","UiActionButton.dd6e6d76.js","IconsGithub.c47cbd38.js","UiButtonGroup.03df9d51.js","BioSkills.vue_used_vue_type_style_index_0_lang.module.516c18c9.js","BioSkills.vue_used_vue_type_style_index_0_lang.4d0cadf8.css","BioSkills.8a45295a.js","BioSkillsCard.9eb3a7e8.js","UiStars.f80344a8.js","IconStar.856ef9b4.js","UiCard.30356a36.js","UiCard.vue_used_vue_type_style_index_0_lang.module.a0027dfd.js","UiCard.vue_used_vue_type_style_index_0_lang.7760099e.css","BioProjects.59ee94c3.js","BioProjectCard.92964127.js","IconsCode.f19221b0.js","ArrowRight.14964609.js"],import.meta.url).then(e=>e.default||e)},{name:"contacts",path:"/contacts",file:"/drone/src/pages/contacts.vue",children:[],meta:jt,alias:(jt==null?void 0:jt.alias)||[],redirect:(jt==null?void 0:jt.redirect)||void 0,component:()=>Q(()=>import("./contacts.72cb390a.js"),["contacts.72cb390a.js","contacts.2af401d8.css","ContactInformation.23c7ad7c.js","IconsTelegram.783c99b0.js","ContactRow.c1c5e4b6.js","UiCard.30356a36.js","UiCard.vue_used_vue_type_style_index_0_lang.module.a0027dfd.js","UiCard.vue_used_vue_type_style_index_0_lang.7760099e.css","ContactInformation.vue_used_vue_type_style_index_0_lang.module.80c3b839.js","ContactInformation.vue_used_vue_type_style_index_0_lang.826cd7fe.css","IconsGithub.c47cbd38.js","IconsLinkedin.125a3758.js","IconsSend.9f60ece7.js"],import.meta.url).then(e=>e.default||e)},{name:"index",path:"/",file:"/drone/src/pages/index.vue",children:[],meta:Ft,alias:(Ft==null?void 0:Ft.alias)||[],redirect:(Ft==null?void 0:Ft.redirect)||void 0,component:()=>Q(()=>import("./index.9190d55e.js"),["index.9190d55e.js","HomeHeader.27ad4cc1.js","IconsSend.9f60ece7.js","UiActionButton.dd6e6d76.js","IconsBook.a1725b46.js","UiButtonGroup.03df9d51.js","HomeContentList.46e326e2.js","navigation.c88a11e6.js"],import.meta.url).then(e=>e.default||e)}],sm={},ut={...sm},lm=Nd(async e=>{var o;let t,n;if(!((o=e.meta)!=null&&o.validate))return;const r=([t,n]=ta(()=>Promise.resolve(e.meta.validate(e))),t=await t,n(),t);return typeof r=="boolean"?r:ra(r)}),im=[lm],lo={};function am(e,t){const{pathname:n,search:r,hash:o}=t,s=e.indexOf("#");if(s>-1){const i=o.includes(e.slice(s))?e.slice(s).length:1;let a=o.slice(i);return a[0]!=="/"&&(a="/"+a),el(a,"")}return el(n,e)+r+o}const um=Lt(async e=>{var _,C,R,y;let t,n,r=xn().app.baseURL;ut.hashMode&&!r.includes("#")&&(r+="#");const o=(C=(_=ut.history)==null?void 0:_.call(ut,r))!=null?C:ut.hashMode?th(r):ma(r),s=(y=(R=ut.routes)==null?void 0:R.call(ut,Bl))!=null?y:Bl,l=am(r,window.location),i=Hh({...ut,history:o,routes:s});e.vueApp.use(i);const a=po(i.currentRoute.value);i.afterEach((h,v)=>{a.value=v}),Object.defineProperty(e.vueApp.config.globalProperties,"previousRoute",{get:()=>a.value});const u=po(i.resolve(l)),c=()=>{u.value=i.currentRoute.value};e.hook("page:finish",c),i.afterEach((h,v)=>{var w,T,O,I;((T=(w=h.matched[0])==null?void 0:w.components)==null?void 0:T.default)===((I=(O=v.matched[0])==null?void 0:O.components)==null?void 0:I.default)&&c()});const f={};for(const h in u.value)f[h]=xe(()=>u.value[h]);e._route=et(f),e._middleware=e._middleware||{global:[],named:{}};const p=Nr();try{[t,n]=ta(()=>i.isReady()),await t,n()}catch(h){xt(e,Ln,[h])}const g=oa("_layout");return i.beforeEach(async(h,v)=>{var T,O;h.meta=et(h.meta),e.isHydrating&&(h.meta.layout=(T=g.value)!=null?T:h.meta.layout),e._processingMiddleware=!0;const w=new Set([...im,...e._middleware.global]);for(const I of h.matched){const k=I.meta.middleware;if(!!k)if(Array.isArray(k))for(const U of k)w.add(U);else w.add(k)}for(const I of w){const k=typeof I=="string"?e._middleware.named[I]||await((O=lo[I])==null?void 0:O.call(lo).then(F=>F.default||F)):I;if(!k)throw new Error(`Unknown route middleware: '${I}'.`);const U=await xt(e,k,[h,v]);if(!e.payload.serverRendered&&e.isHydrating&&(U===!1||U instanceof Error)){const F=U||Ao({statusCode:404,statusMessage:`Page Not Found: ${l}`});return xt(e,Ln,[F])}if(U||U===!1)return U}}),i.afterEach(async h=>{delete e._processingMiddleware,!e.isHydrating&&p.value&&await xt(e,Bd),h.matched.length===0&&xt(e,Ln,[Ao({statusCode:404,fatal:!1,statusMessage:`Page not found: ${h.fullPath}`})])}),e.hooks.hookOnce("app:created",async()=>{try{await i.replace({...i.resolve(l),name:void 0,force:!0})}catch(h){xt(e,Ln,[h])}}),{provide:{router:i}}}),cm="__NUXT_COLOR_MODE__",Gm="ColorScheme",fm="nuxt-color-mode",ct=window[cm],dm=Lt(e=>{const t=oa("color-mode",()=>et({preference:ct.preference,value:ct.value,unknown:!1,forced:!1})).value;Yt().afterEach(o=>{const s=o.meta.colorMode;s&&s!=="system"?(t.value=s,t.forced=!0):(s==="system"&&console.warn("You cannot force the colorMode to system at the page level."),t.forced=!1,t.value=t.preference==="system"?ct.getColorScheme():t.preference)});let n;function r(){n||!window.matchMedia||(n=window.matchMedia("(prefers-color-scheme: dark)"),n.addEventListener("change",()=>{!t.forced&&t.preference==="system"&&(t.value=ct.getColorScheme())}))}je(()=>t.preference,o=>{var s;t.forced||(o==="system"?(t.value=ct.getColorScheme(),r()):t.value=o,(s=window.localStorage)==null||s.setItem(fm,o))},{immediate:!0}),je(()=>t.value,(o,s)=>{ct.removeColorScheme(s),ct.addColorScheme(o)}),t.preference==="system"&&r(),e.hook("app:mounted",()=>{t.unknown&&(t.preference=ct.preference,t.value=ct.value,t.unknown=!1)}),e.provide("colorMode",t)}),pm=Lt(()=>{xn().public.content.wsUrl&&Q(()=>import("./web-socket.f2a8f486.js"),[],import.meta.url).then(({useContentWebSocket:t})=>t())}),hm=Lt(e=>{!ap()||(e.hooks.hook("link:prefetch",t=>al(t)),Yt().beforeResolve(async(t,n)=>{if(t.path===n.path)return;const r=await al(t.path);!r||Object.assign(e.payload.data,r.data)}))}),gm=["data-index"],mm=Le({__name:"masonry-wall",props:{columnWidth:{default:400},items:null,gap:{default:0},rtl:{type:Boolean,default:!1},ssrColumns:{default:0},scrollContainer:{default:null}},emits:["redraw","redrawSkip"],setup(e,{emit:t}){const n=e,{columnWidth:r,items:o,gap:s,rtl:l,ssrColumns:i,scrollContainer:a}=ai(n),u=Ve([]),c=Ve();function f(){const R=Math.floor((c.value.getBoundingClientRect().width+s.value)/(r.value+s.value));return R>0?R:1}function p(R){return[...new Array(R)].map(()=>[])}if(i.value>0){const R=p(i.value);o.value.forEach((y,h)=>R[h%i.value].push(h)),u.value=R}async function g(R){if(R>=o.value.length)return;await En();const y=[...c.value.children];l.value&&y.reverse();const h=y.reduce((v,w)=>w.getBoundingClientRect().height"u"?void 0:new ResizeObserver(()=>_());return Qn(()=>{_(),C==null||C.observe(c.value)}),Cn(()=>C==null?void 0:C.unobserve(c.value)),je([o,l],()=>_(!0)),je([r,s],()=>_()),(R,y)=>(Oe(),Pt("div",{ref_key:"wall",ref:c,class:"masonry-wall",style:cn({display:"flex",gap:`${be(s)}px`})},[(Oe(!0),Pt(ke,null,mo(u.value,(h,v)=>(Oe(),Pt("div",{key:v,class:"masonry-column","data-index":v,style:cn({display:"flex","flex-basis":"0px","flex-direction":"column","flex-grow":1,height:["-webkit-max-content","-moz-max-content","max-content"],gap:`${be(s)}px`})},[(Oe(!0),Pt(ke,null,mo(h,w=>(Oe(),Pt("div",{key:w,class:"masonry-item"},[Ec(R.$slots,"default",{item:be(o)[w],index:w},()=>[Ir(io(be(o)[w]),1)])]))),128))],12,gm))),128))],4))}}),ym=(()=>{const e=mm;return e.install=t=>{t.component("MasonryWall",e)},e})(),_m=Lt(e=>{e.vueApp.use(ym)}),vm=[_p,Ip,Bp,um,dm,pm,hm,_m],Hl={__name:"nuxt-root",setup(e){const t=ne(()=>Q(()=>import("./error-component.406471bb.js"),[],import.meta.url).then(s=>s.default||s)),n=Ce(),r=n.deferHydration();an("_route",Rn()),n.hooks.callHookWith(s=>s.map(l=>l()),"vue:setup");const o=Nr();return Ri((s,l,i)=>{n.hooks.callHook("vue:error",s,l,i).catch(a=>console.error("[nuxt] Error in `vue:error` hook",a)),Hd(s)&&(s.fatal||s.unhandled)&&xt(n,Ln,[s])}),(s,l)=>{const i=Mr("App");return Oe(),Wt(mi,{onResolve:be(r)},{default:Or(()=>[be(o)?(Oe(),Wt(be(t),{key:0,error:be(o)},null,8,["error"])):(Oe(),Wt(i,{key:1}))]),_:1},8,["onResolve"])}}},bm=(e,t)=>t.path.replace(/(:\w+)\([^)]+\)/g,"$1").replace(/(:\w+)[?+*]/g,"$1").replace(/:\w+/g,n=>{var r;return((r=e.params[n.slice(1)])==null?void 0:r.toString())||""}),wm=(e,t)=>{var o;const n=t.route.matched.find(s=>{var l;return((l=s.components)==null?void 0:l.default)===t.Component.type}),r=(o=e!=null?e:n==null?void 0:n.meta.key)!=null?o:n&&bm(t.route,n);return typeof r=="function"?r(t.route):r},Em=(e,t)=>({default:()=>e?ye(dc,e===!0?{}:e,t):t}),Cm=Le({setup(e,{slots:t}){return()=>{var n;return(n=t.default)==null?void 0:n.call(t)}}}),Ho=(e,t,n)=>({default:()=>t?ye(e,t===!0?{}:t,n):ye(Cm,{},n)}),Ga=Le({name:"NuxtPage",inheritAttrs:!1,props:{name:{type:String},transition:{type:[Boolean,Object],default:void 0},keepalive:{type:[Boolean,Object],default:void 0},route:{type:Object},pageKey:{type:[Function,String],default:null}},setup(e,{attrs:t}){const n=Ce();return()=>ye(Ra,{name:e.name,route:e.route,...t},{default:r=>{var i,a,u,c;if(!r.Component)return;const o=wm(e.pageKey,r),s=(a=(i=e.transition)!=null?i:r.route.meta.pageTransition)!=null?a:Mp,l=n.deferHydration();return Ho($r,s,Em((c=(u=e.keepalive)!=null?u:r.route.meta.keepalive)!=null?c:Dp,ye(mi,{onPending:()=>n.callHook("page:start",r.Component),onResolve:()=>n.callHook("page:finish",r.Component).finally(l)},{default:()=>ye(xm,{key:o,routeProps:r,pageKey:o,hasTransition:!!s})}))).default()}})}}),xm=Le({props:["routeProps","pageKey","hasTransition"],setup(e){const t=e.pageKey,n=e.routeProps.route,r={};for(const o in e.routeProps.route)r[o]=xe(()=>t===e.pageKey?e.routeProps.route[o]:n[o]);return an("_route",et(r)),()=>ye(e.routeProps.Component)}}),ey=Object.freeze(Object.defineProperty({__proto__:null,default:Ga},Symbol.toStringTag,{value:"Module"})),eu={content:()=>Q(()=>import("./content.24233a04.js"),["content.24233a04.js","content.c373b433.css","LayoutThemeToggle.0b8ad036.js","LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.module.5f1b7ee4.js","LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.cfa40af4.css","LayoutFooter.92ed5906.js"],import.meta.url).then(e=>e.default||e),default:()=>Q(()=>import("./default.291a94d3.js"),["default.291a94d3.js","default.59f6cce8.css","LayoutMainMenuToggle.62cc3970.js","LayoutMainMenuToggle.vue_used_vue_type_style_index_0_lang.module.fbcd3219.js","LayoutMainMenuToggle.vue_used_vue_type_style_index_0_lang.17e7aae7.css","LayoutMainMenu.8e9bb43b.js","navigation.c88a11e6.js"],import.meta.url).then(e=>e.default||e),landing:()=>Q(()=>import("./landing.b66b3c30.js"),["landing.b66b3c30.js","landing.ae49d3c3.css","LayoutHeader.85946555.js","LayoutHeader.vue_used_vue_type_style_index_0_lang.module.57d4f89f.js","LayoutHeader.vue_used_vue_type_style_index_0_lang.b2295632.css"],import.meta.url).then(e=>e.default||e)},Rm=Le({props:{name:String},async setup(e,t){const n=await eu[e.name]().then(r=>r.default||r);return()=>ye(n,{},t.slots)}}),tu=Le({props:{name:{type:[String,Boolean,Object],default:null}},setup(e,t){const n=Ge("_route"),r=n===Rn()?jh():n,o=xe(()=>{var s,l;return(l=(s=be(e.name))!=null?s:r.meta.layout)!=null?l:"default"});return()=>{var i;const s=o.value&&o.value in eu,l=(i=r.meta.layoutTransition)!=null?i:Lp;return Ho($r,s&&l,{default:()=>Ho(Rm,s&&{key:o.value,name:o.value,hasTransition:!!l},t.slots).default()}).default()}}}),ty=Object.freeze(Object.defineProperty({__proto__:null,default:tu},Symbol.toStringTag,{value:"Module"})),Pm={};function km(e,t){const n=Ga,r=tu;return Oe(),Wt(r,null,{default:Or(()=>[ge(n)]),_:1})}const Sm=Ya(Pm,[["render",km]]);globalThis.$fetch||(globalThis.$fetch=cd.create({baseURL:dd()}));let Nl;const Am=kd(vm);Nl=async function(){var o;const n=Boolean((o=window.__NUXT__)==null?void 0:o.serverRendered)?Rf(Hl):xf(Hl);n.component("App",Sm);const r=xd({vueApp:n});try{await Pd(r,Am)}catch(s){await r.callHook("app:error",s),r.payload.error=r.payload.error||s}try{await r.hooks.callHook("app:created",n),await r.hooks.callHook("app:beforeMount",n),n.mount("#__nuxt"),await r.hooks.callHook("app:mounted",n),await En()}catch(s){await r.callHook("app:error",s),r.payload.error=r.payload.error||s}},Nl().catch(e=>{console.error("Error while mounting app:",e)});export{Mr as $,ai as A,oa as B,jm as C,Ad as D,la as E,wg as F,Eg as G,_g as H,ia as I,Qn as J,Nm as K,yt as L,xn as M,$m as N,Pg as O,Ka as P,Im as Q,ke as R,mo as S,Ir as T,Fm as U,Mm as V,Wm as W,Ym as X,Zm as Y,Qm as Z,Q as _,Le as a,Xm as a0,Za as a1,gr as a2,En as a3,tu as a4,us as a5,Ml as a6,zm as a7,Gt as a8,Vm as a9,Um as aa,qm as ab,Km as ac,Hm as ad,zh as ae,Dl as af,Ji as ag,Om as ah,Lm as ai,Gm as aj,Bm as ak,mg as al,yg as am,Rg as an,kg as ao,Jm as ap,ey as aq,ty as ar,ca as b,Wt as c,ne as d,Pt as e,vr as f,Uc as g,dt as h,ge as i,Dm as j,Ya as k,as as l,ye as m,Tm as n,Oe as o,Xa as p,Ve as q,Ec as r,Ce as s,io as t,be as u,Ri as v,Or as w,Cn as x,xe as y,fa as z}; diff --git a/docs/nuxt/error-404.35f01048.js b/docs/nuxt/error-404.35f01048.js new file mode 100644 index 0000000..cfe9386 --- /dev/null +++ b/docs/nuxt/error-404.35f01048.js @@ -0,0 +1 @@ +import{k as a,z as n,o as r,e as l,f as e,t as s,i as d,w as c,T as p,b as f,ah as h,ai as x}from"./entry.a1162545.js";const m=t=>(h("data-v-07b7f6e4"),t=t(),x(),t),u={class:"font-sans antialiased bg-white dark:bg-black text-black dark:text-white grid min-h-screen place-content-center overflow-hidden"},g=m(()=>e("div",{class:"fixed left-0 right-0 spotlight z-10"},null,-1)),b={class:"max-w-520px text-center z-20"},_=["textContent"],w=["textContent"],y={class:"w-full flex items-center justify-center"},S={__name:"error-404",props:{appName:{type:String,default:"Nuxt"},version:{type:String,default:""},statusCode:{type:Number,default:404},statusMessage:{type:String,default:"Not Found"},description:{type:String,default:"Sorry, the page you are looking for could not be found."},backHome:{type:String,default:"Go back home"}},setup(t){const o=t;return n({title:`${o.statusCode} - ${o.statusMessage} | ${o.appName}`,script:[],style:[{children:'*,:before,:after{-webkit-box-sizing:border-box;box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}*{--tw-ring-inset:var(--tw-empty, );--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(14, 165, 233, .5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000}:root{-moz-tab-size:4;-o-tab-size:4;tab-size:4}a{color:inherit;text-decoration:inherit}body{margin:0;font-family:inherit;line-height:inherit}html{-webkit-text-size-adjust:100%;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";line-height:1.5}h1,p{margin:0}h1{font-size:inherit;font-weight:inherit}'}]}),(k,v)=>{const i=f;return r(),l("div",u,[g,e("div",b,[e("h1",{class:"text-8xl sm:text-10xl font-medium mb-8",textContent:s(t.statusCode)},null,8,_),e("p",{class:"text-xl px-8 sm:px-0 sm:text-4xl font-light mb-16 leading-tight",textContent:s(t.description)},null,8,w),e("div",y,[d(i,{to:"/",class:"gradient-border text-md sm:text-xl py-2 px-4 sm:py-3 sm:px-6 cursor-pointer"},{default:c(()=>[p(s(t.backHome),1)]),_:1})])])])}}},z=a(S,[["__scopeId","data-v-07b7f6e4"]]);export{z as default}; diff --git a/docs/nuxt/error-500.f6986e78.js b/docs/nuxt/error-500.f6986e78.js new file mode 100644 index 0000000..ba490f1 --- /dev/null +++ b/docs/nuxt/error-500.f6986e78.js @@ -0,0 +1 @@ +import{k as i,z as a,o as r,e as n,f as e,t as s,ah as l,ai as d}from"./entry.a1162545.js";const c=t=>(l("data-v-73785db7"),t=t(),d(),t),p={class:"font-sans antialiased bg-white dark:bg-black text-black dark:text-white grid min-h-screen place-content-center overflow-hidden"},h=c(()=>e("div",{class:"fixed -bottom-1/2 left-0 right-0 h-1/2 spotlight"},null,-1)),f={class:"max-w-520px text-center"},g=["textContent"],m=["textContent"],b={__name:"error-500",props:{appName:{type:String,default:"Nuxt"},version:{type:String,default:""},statusCode:{type:Number,default:500},statusMessage:{type:String,default:"Server error"},description:{type:String,default:"This page is temporarily unavailable."}},setup(t){const o=t;return a({title:`${o.statusCode} - ${o.statusMessage} | ${o.appName}`,script:[],style:[{children:'*,:before,:after{-webkit-box-sizing:border-box;box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}*{--tw-ring-inset:var(--tw-empty, );--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(14, 165, 233, .5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000}:root{-moz-tab-size:4;-o-tab-size:4;tab-size:4}body{margin:0;font-family:inherit;line-height:inherit}html{-webkit-text-size-adjust:100%;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";line-height:1.5}h1,p{margin:0}h1{font-size:inherit;font-weight:inherit}'}]}),(x,u)=>(r(),n("div",p,[h,e("div",f,[e("h1",{class:"text-8xl sm:text-10xl font-medium mb-8",textContent:s(t.statusCode)},null,8,g),e("p",{class:"text-xl px-8 sm:px-0 sm:text-4xl font-light mb-16 leading-tight",textContent:s(t.description)},null,8,m)])]))}},w=i(b,[["__scopeId","data-v-73785db7"]]);export{w as default}; diff --git a/docs/nuxt/error-component.406471bb.js b/docs/nuxt/error-component.406471bb.js new file mode 100644 index 0000000..7d2ca0a --- /dev/null +++ b/docs/nuxt/error-component.406471bb.js @@ -0,0 +1,3 @@ +import{d as o,_ as c,o as g,c as E,n as k,g as P,u as s}from"./entry.a1162545.js";const v={__name:"nuxt-error-page",props:{error:Object},setup(u){var n;const{error:t}=u;(t.stack||"").split(` +`).splice(1).map(e=>({text:e.replace("webpack:/","").replace(".vue",".js").trim(),internal:e.includes("node_modules")&&!e.includes(".cache")||e.includes("internal")||e.includes("new Promise")})).map(e=>`${e.text}`).join(` +`);const r=Number(t.statusCode||500),a=r===404,i=(n=t.statusMessage)!=null?n:a?"Page Not Found":"Internal Server Error",p=t.message||t.toString(),_=void 0,d=o(()=>c(()=>import("./error-404.35f01048.js"),["error-404.35f01048.js","error-404.18ced855.css","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(e=>e.default||e)),l=o(()=>c(()=>import("./error-500.f6986e78.js"),["error-500.f6986e78.js","error-500.e60962de.css","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(e=>e.default||e)),m=a?d:l;return(e,f)=>(g(),E(s(m),k(P({statusCode:s(r),statusMessage:s(i),description:s(p),stack:s(_)})),null,16))}},h=v;export{h as default}; diff --git a/docs/nuxt/index.9190d55e.js b/docs/nuxt/index.9190d55e.js new file mode 100644 index 0000000..5e36fd0 --- /dev/null +++ b/docs/nuxt/index.9190d55e.js @@ -0,0 +1 @@ +import a from"./HomeHeader.27ad4cc1.js";import c from"./HomeContentList.46e326e2.js";import{k as i,o as m,e as l,i as t,f as s,h as o,Y as _}from"./entry.a1162545.js";import"./IconsSend.9f60ece7.js";import"./UiActionButton.dd6e6d76.js";import"./IconsBook.a1725b46.js";import"./UiButtonGroup.03df9d51.js";import"./navigation.c88a11e6.js";const p={scrollToTop:!0,head(){return{title:"Obsidian Garden"}}},d=s("h1",null,"Cheatsheet",-1);function u(e,$,h,y,k,x){const n=a,r=c;return m(),l("main",{class:o(e.$style.main)},[t(n),s("div",{class:o(e.$style.reference)},[d,s("div",{class:o(e.$style.grid)},[t(r)],2)],2)],2)}const f={$style:_},b=i(p,[["render",u],["__cssModules",f]]);export{b as default}; diff --git a/docs/nuxt/landing.b66b3c30.js b/docs/nuxt/landing.b66b3c30.js new file mode 100644 index 0000000..a779077 --- /dev/null +++ b/docs/nuxt/landing.b66b3c30.js @@ -0,0 +1 @@ +import r from"./LayoutHeader.85946555.js";import{k as _,o as c,e as d,f as n,h as t,i as o,w as l,r as p,a4 as i}from"./entry.a1162545.js";import"./LayoutHeader.vue_used_vue_type_style_index_0_lang.module.57d4f89f.js";const m="_wrapper_1qq06_1",u="_header_container_1qq06_8",h="_header_content_1qq06_38",f={wrapper:m,header_container:u,header_content:h},y={};function q(e,$){const a=r,s=i;return c(),d("div",{class:t(e.$style.wrapper)},[n("div",{class:t(e.$style.header_container)},[n("div",{class:t(e.$style.header_content)},[o(a)],2)],2),o(s,{name:"content"},{default:l(()=>[p(e.$slots,"default")]),_:3})],2)}const w={$style:f},B=_(y,[["render",q],["__cssModules",w]]);export{B as default}; diff --git a/docs/nuxt/navigation.c88a11e6.js b/docs/nuxt/navigation.c88a11e6.js new file mode 100644 index 0000000..61859d0 --- /dev/null +++ b/docs/nuxt/navigation.c88a11e6.js @@ -0,0 +1 @@ +import{F as i,E as r,G as s,_ as p,H as f,I as h}from"./entry.a1162545.js";const m=async e=>{let t=e;typeof(t==null?void 0:t.params)=="function"&&(t=t.params());const n=i(t?`/navigation/${r(t)}.json`:"/navigation");if(s())return(await p(()=>import("./client-db.ba528d0d.js"),["client-db.ba528d0d.js","entry.a1162545.js","entry.10eae4ea.css"],import.meta.url).then(o=>o.generateNavigation))(t||{});const a=await $fetch(n,{method:"GET",responseType:"json",params:{_params:f(t||{}),previewToken:h("previewToken").value}});if(typeof a=="string"&&a.startsWith(""))throw new Error("Not found");return a};export{m as f}; diff --git a/docs/nuxt/web-socket.f2a8f486.js b/docs/nuxt/web-socket.f2a8f486.js new file mode 100644 index 0000000..bb5fe40 --- /dev/null +++ b/docs/nuxt/web-socket.f2a8f486.js @@ -0,0 +1 @@ +import{M as u,N as i}from"./entry.a1162545.js";const n={log:(...t)=>console.log("[Content]",...t),warn:(...t)=>console.warn("[Content]",...t)};let e;function g(){if(!window.WebSocket){n.warn("Could not enable hot reload, your browser does not support WebSocket.");return}const t=o=>{try{if(!JSON.parse(o.data))return;i()}catch{}},s=()=>n.log("WS connected!"),a=o=>{switch(o.code){case"ECONNREFUSED":r(!0);break;default:n.warn("WS Error:",o);break}},l=o=>{o.code===1e3||o.code===1005?n.log("WS closed!"):r(!0)},r=(o=!1)=>{if(o){n.log("WS reconnecting.."),setTimeout(r,1e3);return}if(e){try{e.close()}catch{}e=void 0}const c=`${u().public.content.wsUrl}ws`;n.log(`WS connect to ${c}`),e=new WebSocket(c),e.onopen=s,e.onmessage=t,e.onerror=a,e.onclose=l};return r(),{connect:r}}export{g as useContentWebSocket}; diff --git a/docs/nuxt/welcome.02c4460f.js b/docs/nuxt/welcome.02c4460f.js new file mode 100644 index 0000000..32a0e05 --- /dev/null +++ b/docs/nuxt/welcome.02c4460f.js @@ -0,0 +1 @@ +import{k as i,z as s,o as l,e as n,f as t,t as a,V as r,ah as d,ai as c}from"./entry.a1162545.js";import"./ContentNavigation.3663b4c1.js";import"./navigation.c88a11e6.js";import"./ProseCode.vue_used_vue_type_style_index_1_lang.module.230a312a.js";import"./BioSkills.vue_used_vue_type_style_index_0_lang.module.516c18c9.js";import"./UiCard.vue_used_vue_type_style_index_0_lang.module.a0027dfd.js";import"./ContactInformation.vue_used_vue_type_style_index_0_lang.module.80c3b839.js";import"./LayoutThemeToggle.vue_used_vue_type_style_index_0_lang.module.5f1b7ee4.js";import"./LayoutHeader.vue_used_vue_type_style_index_0_lang.module.57d4f89f.js";import"./LayoutMainMenuToggle.vue_used_vue_type_style_index_0_lang.module.fbcd3219.js";import"./ContentList.aa5fabfc.js";import"./ContentSlot.017eac9c.js";import"./DocumentDrivenEmpty.901ae14d.js";import"./DocumentDrivenNotFound.ac941741.js";import"./Markdown.ca979d4c.js";const o=e=>(d("data-v-25102a06"),e=e(),c(),e),h={class:"font-sans antialiased bg-white dark:bg-black text-black dark:text-white min-h-screen place-content-center flex flex-col items-center justify-center p-8 text-sm sm:text-base"},p={class:"grid grid-cols-3 gap-4 md:gap-8 max-w-5xl w-full z-20"},C={class:"flex justify-between items-end col-span-3"},f=r('',1),g=["href","textContent"],u=o(()=>t("div",{class:"spotlight-wrapper"},[t("div",{class:"fixed z-10 left-0 right-0 spotlight"})],-1)),v=r('

Get Started

Remove this welcome page by replacing <NuxtWelcome /> in app.vue with your own code.

',1),w={href:"https://v3.nuxtjs.org",target:"_blank",rel:"noopener",class:"gradient-border cursor-pointer col-span-3 sm:col-span-1 p-4 flex flex-col"},m=r('

Documentation

',2),x=["textContent"],b={href:"https://github.com/nuxt/framework",target:"_blank",rel:"noopener",class:"cursor-pointer gradient-border col-span-3 sm:col-span-1 p-4 flex flex-col"},_=o(()=>t("svg",{width:"40",height:"40",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg"},[t("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M20 3.33333C10.795 3.33333 3.33337 10.8067 3.33337 20.0283C3.33337 27.4033 8.10837 33.6617 14.7317 35.8683C15.565 36.0217 15.8684 35.5067 15.8684 35.0633C15.8684 34.6683 15.855 33.6167 15.8467 32.225C11.21 33.2333 10.2317 29.9867 10.2317 29.9867C9.47504 28.0567 8.38171 27.5433 8.38171 27.5433C6.86837 26.51 8.49671 26.53 8.49671 26.53C10.1684 26.6467 11.0484 28.25 11.0484 28.25C12.535 30.8 14.95 30.0633 15.8984 29.6367C16.0517 28.5583 16.4817 27.8233 16.9584 27.4067C13.2584 26.985 9.36671 25.5517 9.36671 19.155C9.36671 17.3333 10.0167 15.8417 11.0817 14.675C10.91 14.2533 10.3384 12.555 11.245 10.2583C11.245 10.2583 12.645 9.80833 15.8284 11.9683C17.188 11.5975 18.5908 11.4087 20 11.4067C21.4167 11.4133 22.8417 11.5983 24.1734 11.9683C27.355 9.80833 28.7517 10.2567 28.7517 10.2567C29.6617 12.555 29.0884 14.2533 28.9184 14.675C29.985 15.8417 30.6317 17.3333 30.6317 19.155C30.6317 25.5683 26.7334 26.98 23.0217 27.3933C23.62 27.9083 24.1517 28.9267 24.1517 30.485C24.1517 32.715 24.1317 34.5167 24.1317 35.0633C24.1317 35.51 24.4317 36.03 25.2784 35.8667C28.5972 34.7535 31.4823 32.6255 33.5258 29.7834C35.5694 26.9413 36.6681 23.5289 36.6667 20.0283C36.6667 10.8067 29.2034 3.33333 20 3.33333Z",fill:"currentColor"})],-1)),k=o(()=>t("h2",{class:"font-semibold text-xl mt-4"},"GitHub",-1)),y=["textContent"],S={href:"https://twitter.com/nuxt_js",target:"_blank",rel:"noopener",class:"cursor-pointer gradient-border col-span-3 sm:col-span-1 p-4 flex flex-col"},M=o(()=>t("svg",{width:"40",height:"40",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg"},[t("path",{d:"M13.8167 33.7557C26.395 33.7557 33.275 23.334 33.275 14.2973C33.275 14.0007 33.275 13.7057 33.255 13.414C34.5937 12.4449 35.7489 11.245 36.6667 9.87066C35.4185 10.424 34.0943 10.7869 32.7384 10.9473C34.1661 10.0924 35.2346 8.74791 35.745 7.164C34.4029 7.96048 32.9345 8.52188 31.4034 8.824C30.3724 7.72694 29.0084 7.00039 27.5228 6.75684C26.0371 6.51329 24.5126 6.76633 23.1852 7.47678C21.8579 8.18723 20.8018 9.31545 20.1805 10.6868C19.5592 12.0581 19.4073 13.596 19.7484 15.0623C17.0294 14.9261 14.3694 14.2195 11.9411 12.9886C9.51285 11.7577 7.37059 10.0299 5.65337 7.91733C4.7789 9.42267 4.51102 11.2047 4.90427 12.9006C5.29751 14.5965 6.32232 16.0788 7.77004 17.0457C6.68214 17.0142 5.61776 16.7215 4.66671 16.1923V16.279C4.66736 17.8578 5.21403 19.3878 6.21404 20.6096C7.21404 21.8313 8.60582 22.6696 10.1534 22.9823C9.14639 23.2569 8.08986 23.2968 7.06504 23.099C7.50198 24.4581 8.35284 25.6467 9.49859 26.4984C10.6443 27.35 12.0277 27.8223 13.455 27.849C12.0369 28.9633 10.413 29.7871 8.67625 30.2732C6.93948 30.7594 5.12391 30.8984 3.33337 30.6823C6.46105 32.6896 10.1004 33.7542 13.8167 33.749",fill:"currentColor"})],-1)),V=o(()=>t("h2",{class:"font-semibold text-xl mt-4"},"Twitter",-1)),j=["textContent"],z={__name:"welcome",props:{appName:{type:String,default:"Nuxt"},version:{type:String,default:""},title:{type:String,default:"Welcome to Nuxt 3!"},readDocs:{type:String,default:"We highly recommend you take a look at the Nuxt documentation, whether you are new or have previous experience with the framework."},followTwitter:{type:String,default:"Follow the Nuxt Twitter account to get latest news about releases, new modules, tutorials and tips."},starGitHub:{type:String,default:"Nuxt is open source and the code is available on GitHub, feel free to star it, participate in discussions or dive into the source."}},setup(e){return s({title:`${e.title}`,script:[],style:[{children:'*,:before,:after{-webkit-box-sizing:border-box;box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}*{--tw-ring-inset:var(--tw-empty, );--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(14, 165, 233, .5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000}:root{-moz-tab-size:4;-o-tab-size:4;tab-size:4}a{color:inherit;text-decoration:inherit}body{margin:0;font-family:inherit;line-height:inherit}html{-webkit-text-size-adjust:100%;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";line-height:1.5}h1,p,h2{margin:0}h1,h2{font-size:inherit;font-weight:inherit}svg{display:block;vertical-align:middle}'}]}),(Z,H)=>(l(),n("div",h,[t("div",p,[t("div",C,[f,t("a",{href:`https://github.com/nuxt/framework/releases/tag/${e.version}`,target:"_blank",rel:"noopener",class:"flex justify-end pb-1 sm:pb-2",textContent:a(e.version)},null,8,g),u]),v,t("a",w,[m,t("p",{class:"mt-2",textContent:a(e.readDocs)},null,8,x)]),t("a",b,[_,k,t("p",{class:"mt-2",textContent:a(e.starGitHub)},null,8,y)]),t("a",S,[M,V,t("p",{class:"mt-2",textContent:a(e.followTwitter)},null,8,j)])])]))}},J=i(z,[["__scopeId","data-v-25102a06"]]);export{J as default}; diff --git a/docs/obsidian/self-hosted-obsidian-sync-with-couchdb/_payload.js b/docs/obsidian/self-hosted-obsidian-sync-with-couchdb/_payload.js index 1b62a58..6289aab 100644 --- a/docs/obsidian/self-hosted-obsidian-sync-with-couchdb/_payload.js +++ b/docs/obsidian/self-hosted-obsidian-sync-with-couchdb/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:O,_path:P}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-nAvv1RNs1x":{_path:P,_dir:"obsidian",_draft:D,_partial:D,_locale:"en",_empty:D,title:O,description:m,excerpt:{type:Q,children:[{type:a,tag:R,props:{},children:[{type:a,tag:h,props:{},children:[{type:a,tag:w,props:{href:S,rel:[x]},children:[{type:b,value:T}]}]},{type:a,tag:h,props:{},children:[{type:a,tag:w,props:{href:U,rel:[x]},children:[{type:b,value:V}]}]}]},{type:a,tag:y,props:{id:E},children:[{type:b,value:F}]},{type:a,tag:p,props:{},children:[{type:b,value:W},{type:a,tag:g,props:{},children:[{type:b,value:X}]},{type:b,value:Y}]},{type:a,tag:i,props:{code:G,language:Z},children:[{type:a,tag:q,props:{},children:[{type:a,tag:i,props:{__ignoreMap:m},children:[{type:b,value:G}]}]}]},{type:a,tag:p,props:{},children:[{type:b,value:_},{type:a,tag:g,props:{},children:[{type:b,value:$}]},{type:b,value:j}]},{type:a,tag:i,props:{code:H,language:aa},children:[{type:a,tag:q,props:{},children:[{type:a,tag:i,props:{__ignoreMap:m},children:[{type:b,value:H}]}]}]},{type:a,tag:p,props:{},children:[{type:b,value:ab},{type:a,tag:g,props:{},children:[{type:b,value:ac}]},{type:b,value:j}]},{type:a,tag:i,props:{code:I,language:ad},children:[{type:a,tag:q,props:{},children:[{type:a,tag:i,props:{__ignoreMap:m},children:[{type:b,value:I}]}]}]},{type:a,tag:y,props:{id:J},children:[{type:b,value:K}]},{type:a,tag:ae,props:{},children:[{type:a,tag:h,props:{},children:[{type:b,value:af},{type:a,tag:g,props:{},children:[{type:b,value:ag}]},{type:b,value:ah}]},{type:a,tag:h,props:{},children:[{type:b,value:ai},{type:a,tag:g,props:{},children:[{type:b,value:aj}]}]},{type:a,tag:h,props:{},children:[{type:b,value:ak}]},{type:a,tag:h,props:{},children:[{type:b,value:al},{type:a,tag:g,props:{},children:[{type:b,value:am}]},{type:b,value:an},{type:a,tag:g,props:{},children:[{type:b,value:ao}]}]}]}]},body:{type:Q,children:[{type:a,tag:R,props:{},children:[{type:a,tag:h,props:{},children:[{type:a,tag:w,props:{href:S,rel:[x]},children:[{type:b,value:T}]}]},{type:a,tag:h,props:{},children:[{type:a,tag:w,props:{href:U,rel:[x]},children:[{type:b,value:V}]}]}]},{type:a,tag:y,props:{id:E},children:[{type:b,value:F}]},{type:a,tag:p,props:{},children:[{type:b,value:W},{type:a,tag:g,props:{},children:[{type:b,value:X}]},{type:b,value:Y}]},{type:a,tag:i,props:{code:G,language:Z},children:[{type:a,tag:q,props:{},children:[{type:a,tag:i,props:{__ignoreMap:m},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:k},children:[{type:b,value:"version"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:z}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:"'3'"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:k},children:[{type:b,value:"services"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"couchserver"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:n}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"container_name"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:z}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:"obsidian__database"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:n}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"image"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:z}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:"couchdb"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:n}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"restart"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:z}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:"always"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:n}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"ports"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:"\"5984:5984\""}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:n}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"environment"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:"COUCHDB_USER=user"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:"COUCHDB_PASSWORD=somepassword"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:n}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"volumes"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:".\u002Fcouchdb\u002Fdbdata:\u002Fopt\u002Fcouchdb\u002Fdata"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:".\u002Fcouchdb\u002Flocal.ini:\u002Fopt\u002Fcouchdb\u002Fetc\u002Flocal.ini"}]}]}]}]}]},{type:a,tag:p,props:{},children:[{type:b,value:_},{type:a,tag:g,props:{},children:[{type:b,value:$}]},{type:b,value:j}]},{type:a,tag:i,props:{code:H,language:aa},children:[{type:a,tag:q,props:{},children:[{type:a,tag:i,props:{__ignoreMap:m},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{},children:[{type:b,value:"[couchdb]\nsingle_node=true\nmax_document_size=50000000\nmax_http_request_size=4294967296\n\n[chttpd]\nrequire_valid_user = true\n\n[chttpd_auth]\nrequire_valid_user = true\nauthentication_redirect = \u002F_utils\u002Fsession.html\n\n[httpd]\nWWW-Authenticate = Basic realm=\"couchdb\"\nenable_cors = true\n\n[cors]\norigins = app:\u002F\u002Fobsidian.md,capacitor:\u002F\u002Flocalhost,http:\u002F\u002Flocalhost\ncredentials = true\nheaders = accept, authorization, content-type, origin, referer\nmethods = GET, PUT, POST, HEAD, DELETE\nmax_age = 3600"}]}]}]}]}]},{type:a,tag:p,props:{},children:[{type:b,value:ab},{type:a,tag:g,props:{},children:[{type:b,value:ac}]},{type:b,value:j}]},{type:a,tag:i,props:{code:I,language:ad},children:[{type:a,tag:q,props:{},children:[{type:a,tag:i,props:{__ignoreMap:m},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:ap},children:[{type:b,value:aq}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:ar}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:A}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"80;"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:A}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"[::]:80;"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:as}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:at}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:n}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"return"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:au}]},{type:a,tag:c,props:{class:"ct-fac75e"},children:[{type:b,value:"301"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" https:\u002F\u002F"}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:u},children:[{type:b,value:av}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:u},children:[{type:b,value:"request_uri"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:B}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:aw}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:ap},children:[{type:b,value:aq}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:ar}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:A}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"443 ssl http2;"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:A}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"[::]:443 ssl http2;"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:" ssl_certificate "}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"\u002Fetc\u002Fletsencrypt\u002Flive\u002Fyourhost.com\u002Ffullchain.pem; "}]},{type:a,tag:c,props:{class:ax},children:[{type:b,value:ay}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:" ssl_certificate_key "}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"\u002Fetc\u002Fletsencrypt\u002Flive\u002Fyourhost.com\u002Fprivkey.pem; "}]},{type:a,tag:c,props:{class:ax},children:[{type:b,value:ay}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:" ssl_trusted_certificate "}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"\u002Fetc\u002Fletsencrypt\u002Flive\u002Fyourhost.com\u002Fchain.pem;"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:as}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:at}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:" client_max_body_size "}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"200M;"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:M},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:"ct-db94fc"},children:[{type:b,value:"location"}]},{type:a,tag:c,props:{class:M},children:[{type:b,value:au}]},{type:a,tag:c,props:{class:"ct-6e93f6"},children:[{type:b,value:"\u002F "}]},{type:a,tag:c,props:{class:M},children:[{type:b,value:"{"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:" proxy_redirect "}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"off;"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:N}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"Host "}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:u},children:[{type:b,value:av}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:B}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:N}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"X-Real-IP "}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:u},children:[{type:b,value:"remote_addr"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:B}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:N}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"X-Forwarded-For "}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:u},children:[{type:b,value:"proxy_add_x_forwarded_for"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:B}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:" proxy_pass "}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"http:\u002F\u002F127.0.0.1:5984;"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" }"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:aw}]}]}]}]}]},{type:a,tag:y,props:{id:J},children:[{type:b,value:K}]},{type:a,tag:ae,props:{},children:[{type:a,tag:h,props:{},children:[{type:b,value:af},{type:a,tag:g,props:{},children:[{type:b,value:ag}]},{type:b,value:ah}]},{type:a,tag:h,props:{},children:[{type:b,value:ai},{type:a,tag:g,props:{},children:[{type:b,value:aj}]}]},{type:a,tag:h,props:{},children:[{type:b,value:ak}]},{type:a,tag:h,props:{},children:[{type:b,value:al},{type:a,tag:g,props:{},children:[{type:b,value:am}]},{type:b,value:an},{type:a,tag:g,props:{},children:[{type:b,value:ao}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-6e93f6{color:#FFA657}.ct-db94fc{color:#FF7B72}.ct-967ad5{color:#C9D1D9}.ct-126005{color:#8B949E}.ct-7a53cc{color:#C9D1D9}.ct-a1f629{color:#C9D1D9}.ct-fac75e{color:#79C0FF}.ct-9798e6{color:#FF7B72}.ct-5ea5bb{color:#FF7B72}.ct-865540{color:#A5D6FF}.ct-507697{color:#C9D1D9}.ct-9b338a{color:#7EE787}.light .ct-9b338a{color:#268BD2}.light .ct-507697{color:#657B83}.light .ct-865540{color:#2AA198}.light .ct-5ea5bb{color:#073642}.light .ct-9798e6{color:#859900}.light .ct-fac75e{color:#D33682}.light .ct-a1f629{color:#859900}.light .ct-7a53cc{color:#268BD2}.light .ct-126005{color:#93A1A1}.light .ct-967ad5{color:#657B83}.light .ct-db94fc{color:#073642}.light .ct-6e93f6{color:#657B83}"}]}],toc:{title:m,searchDepth:C,depth:C,links:[{id:E,depth:C,text:F},{id:J,depth:C,text:K}]}},_type:"markdown",_id:"content:Obsidian:Self-hosted Obsidian sync with CouchDB.md",_source:"content",_file:"Obsidian\u002FSelf-hosted Obsidian sync with CouchDB.md",_extension:"md"}},prerenderedAt:1711020227981}}("element","text","span","ct-507697","line","ct-9798e6","code-inline","li","code",":","ct-9b338a","ct-865540",""," "," ","p","pre"," - ","ct-a1f629","$","ct-7a53cc"," ","a","nofollow","h2",": "," listen ",";",2,false,"setting-up-environment","Setting up environment","version: '3'\nservices:\n couchserver:\n container_name: obsidian__database\n image: couchdb\n restart: always\n ports:\n - \"5984:5984\"\n environment:\n - COUCHDB_USER=user\n - COUCHDB_PASSWORD=somepassword\n volumes:\n - .\u002Fcouchdb\u002Fdbdata:\u002Fopt\u002Fcouchdb\u002Fdata\n - .\u002Fcouchdb\u002Flocal.ini:\u002Fopt\u002Fcouchdb\u002Fetc\u002Flocal.ini\n","[couchdb]\nsingle_node=true\nmax_document_size=50000000\nmax_http_request_size=4294967296\n\n[chttpd]\nrequire_valid_user = true\n\n[chttpd_auth]\nrequire_valid_user = true\nauthentication_redirect = \u002F_utils\u002Fsession.html\n\n[httpd]\nWWW-Authenticate = Basic realm=\"couchdb\"\nenable_cors = true\n\n[cors]\norigins = app:\u002F\u002Fobsidian.md,capacitor:\u002F\u002Flocalhost,http:\u002F\u002Flocalhost\ncredentials = true\nheaders = accept, authorization, content-type, origin, referer\nmethods = GET, PUT, POST, HEAD, DELETE\nmax_age = 3600\n","server {\n listen 80;\n listen [::]:80;\n server_name couchdb.yourhost.com;\n return 301 https:\u002F\u002F$host$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n\n ssl_certificate \u002Fetc\u002Fletsencrypt\u002Flive\u002Fyourhost.com\u002Ffullchain.pem; # managed by Certbot\n ssl_certificate_key \u002Fetc\u002Fletsencrypt\u002Flive\u002Fyourhost.com\u002Fprivkey.pem; # managed by Certbot\n ssl_trusted_certificate \u002Fetc\u002Fletsencrypt\u002Flive\u002Fyourhost.com\u002Fchain.pem;\n\n server_name couchdb.yourhost.com;\n client_max_body_size 200M;\n\n location \u002F {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n\n proxy_pass http:\u002F\u002F127.0.0.1:5984;\n }\n}\n","setting-up-obsidian","Setting up Obsidian"," ","ct-967ad5"," proxy_set_header ","Self Hosted Obsidian Sync With CouchDB","\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb","root","ul","https:\u002F\u002Fgithub.com\u002Fvrtmrz\u002Fobsidian-livesync","Main documentation","https:\u002F\u002Fgithub.com\u002Fvrtmrz\u002Fobsidian-livesync\u002Fblob\u002Fmain\u002Fdocs\u002Fsetup_own_server.md","Setting up couchdb","First, you should create ","docker-compose.yml"," with the following contents:","yaml","Then create initial config at ",".\u002Fcouchdb\u002Flocal.ini","ini","Then, in order to have sync on mobile devices, we will need a reverse proxy with nginx at ","\u002Fetc\u002Fnginx\u002Fsites-enabled\u002Fobsidian-couchdb","nginx","ol","Install ","Self-hosted LiveSync"," plugin","Change host to ","https:\u002F\u002Fyourhost.com","Specify username and password","Press ","test",", then ","fetch database","ct-5ea5bb","server"," {"," server_name ","couchdb.yourhost.com;"," ","host","}","ct-126005","# managed by Certbot")) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:O,_path:P}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-nAvv1RNs1x":{_path:P,_dir:"obsidian",_draft:D,_partial:D,_locale:"en",_empty:D,title:O,description:m,excerpt:{type:Q,children:[{type:a,tag:R,props:{},children:[{type:a,tag:h,props:{},children:[{type:a,tag:w,props:{href:S,rel:[x]},children:[{type:b,value:T}]}]},{type:a,tag:h,props:{},children:[{type:a,tag:w,props:{href:U,rel:[x]},children:[{type:b,value:V}]}]}]},{type:a,tag:y,props:{id:E},children:[{type:b,value:F}]},{type:a,tag:p,props:{},children:[{type:b,value:W},{type:a,tag:g,props:{},children:[{type:b,value:X}]},{type:b,value:Y}]},{type:a,tag:i,props:{code:G,language:Z},children:[{type:a,tag:q,props:{},children:[{type:a,tag:i,props:{__ignoreMap:m},children:[{type:b,value:G}]}]}]},{type:a,tag:p,props:{},children:[{type:b,value:_},{type:a,tag:g,props:{},children:[{type:b,value:$}]},{type:b,value:j}]},{type:a,tag:i,props:{code:H,language:aa},children:[{type:a,tag:q,props:{},children:[{type:a,tag:i,props:{__ignoreMap:m},children:[{type:b,value:H}]}]}]},{type:a,tag:p,props:{},children:[{type:b,value:ab},{type:a,tag:g,props:{},children:[{type:b,value:ac}]},{type:b,value:j}]},{type:a,tag:i,props:{code:I,language:ad},children:[{type:a,tag:q,props:{},children:[{type:a,tag:i,props:{__ignoreMap:m},children:[{type:b,value:I}]}]}]},{type:a,tag:y,props:{id:J},children:[{type:b,value:K}]},{type:a,tag:ae,props:{},children:[{type:a,tag:h,props:{},children:[{type:b,value:af},{type:a,tag:g,props:{},children:[{type:b,value:ag}]},{type:b,value:ah}]},{type:a,tag:h,props:{},children:[{type:b,value:ai},{type:a,tag:g,props:{},children:[{type:b,value:aj}]}]},{type:a,tag:h,props:{},children:[{type:b,value:ak}]},{type:a,tag:h,props:{},children:[{type:b,value:al},{type:a,tag:g,props:{},children:[{type:b,value:am}]},{type:b,value:an},{type:a,tag:g,props:{},children:[{type:b,value:ao}]}]}]}]},body:{type:Q,children:[{type:a,tag:R,props:{},children:[{type:a,tag:h,props:{},children:[{type:a,tag:w,props:{href:S,rel:[x]},children:[{type:b,value:T}]}]},{type:a,tag:h,props:{},children:[{type:a,tag:w,props:{href:U,rel:[x]},children:[{type:b,value:V}]}]}]},{type:a,tag:y,props:{id:E},children:[{type:b,value:F}]},{type:a,tag:p,props:{},children:[{type:b,value:W},{type:a,tag:g,props:{},children:[{type:b,value:X}]},{type:b,value:Y}]},{type:a,tag:i,props:{code:G,language:Z},children:[{type:a,tag:q,props:{},children:[{type:a,tag:i,props:{__ignoreMap:m},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:k},children:[{type:b,value:"version"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:z}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:"'3'"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:k},children:[{type:b,value:"services"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"couchserver"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:n}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"container_name"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:z}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:"obsidian__database"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:n}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"image"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:z}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:"couchdb"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:n}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"restart"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:z}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:"always"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:n}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"ports"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:"\"5984:5984\""}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:n}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"environment"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:"COUCHDB_USER=user"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:"COUCHDB_PASSWORD=somepassword"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:n}]},{type:a,tag:c,props:{class:k},children:[{type:b,value:"volumes"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:j}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:".\u002Fcouchdb\u002Fdbdata:\u002Fopt\u002Fcouchdb\u002Fdata"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]},{type:a,tag:c,props:{class:l},children:[{type:b,value:".\u002Fcouchdb\u002Flocal.ini:\u002Fopt\u002Fcouchdb\u002Fetc\u002Flocal.ini"}]}]}]}]}]},{type:a,tag:p,props:{},children:[{type:b,value:_},{type:a,tag:g,props:{},children:[{type:b,value:$}]},{type:b,value:j}]},{type:a,tag:i,props:{code:H,language:aa},children:[{type:a,tag:q,props:{},children:[{type:a,tag:i,props:{__ignoreMap:m},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{},children:[{type:b,value:"[couchdb]\nsingle_node=true\nmax_document_size=50000000\nmax_http_request_size=4294967296\n\n[chttpd]\nrequire_valid_user = true\n\n[chttpd_auth]\nrequire_valid_user = true\nauthentication_redirect = \u002F_utils\u002Fsession.html\n\n[httpd]\nWWW-Authenticate = Basic realm=\"couchdb\"\nenable_cors = true\n\n[cors]\norigins = app:\u002F\u002Fobsidian.md,capacitor:\u002F\u002Flocalhost,http:\u002F\u002Flocalhost\ncredentials = true\nheaders = accept, authorization, content-type, origin, referer\nmethods = GET, PUT, POST, HEAD, DELETE\nmax_age = 3600"}]}]}]}]}]},{type:a,tag:p,props:{},children:[{type:b,value:ab},{type:a,tag:g,props:{},children:[{type:b,value:ac}]},{type:b,value:j}]},{type:a,tag:i,props:{code:I,language:ad},children:[{type:a,tag:q,props:{},children:[{type:a,tag:i,props:{__ignoreMap:m},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:ap},children:[{type:b,value:aq}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:ar}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:A}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"80;"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:A}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"[::]:80;"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:as}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:at}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:n}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:"return"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:au}]},{type:a,tag:c,props:{class:"ct-fd005d"},children:[{type:b,value:"301"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:" https:\u002F\u002F"}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:u},children:[{type:b,value:av}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:u},children:[{type:b,value:"request_uri"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:B}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:aw}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:ap},children:[{type:b,value:aq}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:ar}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:A}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"443 ssl http2;"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:A}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"[::]:443 ssl http2;"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:" ssl_certificate "}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"\u002Fetc\u002Fletsencrypt\u002Flive\u002Fyourhost.com\u002Ffullchain.pem; "}]},{type:a,tag:c,props:{class:ax},children:[{type:b,value:ay}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:" ssl_certificate_key "}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"\u002Fetc\u002Fletsencrypt\u002Flive\u002Fyourhost.com\u002Fprivkey.pem; "}]},{type:a,tag:c,props:{class:ax},children:[{type:b,value:ay}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:" ssl_trusted_certificate "}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"\u002Fetc\u002Fletsencrypt\u002Flive\u002Fyourhost.com\u002Fchain.pem;"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:as}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:at}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:o}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:" client_max_body_size "}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"200M;"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:M},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:"ct-955371"},children:[{type:b,value:"location"}]},{type:a,tag:c,props:{class:M},children:[{type:b,value:au}]},{type:a,tag:c,props:{class:"ct-15522e"},children:[{type:b,value:"\u002F "}]},{type:a,tag:c,props:{class:M},children:[{type:b,value:"{"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:" proxy_redirect "}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"off;"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:N}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"Host "}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:u},children:[{type:b,value:av}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:B}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:N}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"X-Real-IP "}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:u},children:[{type:b,value:"remote_addr"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:B}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:N}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"X-Forwarded-For "}]},{type:a,tag:c,props:{class:s},children:[{type:b,value:t}]},{type:a,tag:c,props:{class:u},children:[{type:b,value:"proxy_add_x_forwarded_for"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:B}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:v}]},{type:a,tag:c,props:{class:f},children:[{type:b,value:" proxy_pass "}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"http:\u002F\u002F127.0.0.1:5984;"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:" }"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:aw}]}]}]}]}]},{type:a,tag:y,props:{id:J},children:[{type:b,value:K}]},{type:a,tag:ae,props:{},children:[{type:a,tag:h,props:{},children:[{type:b,value:af},{type:a,tag:g,props:{},children:[{type:b,value:ag}]},{type:b,value:ah}]},{type:a,tag:h,props:{},children:[{type:b,value:ai},{type:a,tag:g,props:{},children:[{type:b,value:aj}]}]},{type:a,tag:h,props:{},children:[{type:b,value:ak}]},{type:a,tag:h,props:{},children:[{type:b,value:al},{type:a,tag:g,props:{},children:[{type:b,value:am}]},{type:b,value:an},{type:a,tag:g,props:{},children:[{type:b,value:ao}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-15522e{color:#FFA657}.ct-955371{color:#FF7B72}.ct-bda083{color:#C9D1D9}.ct-828f3e{color:#8B949E}.ct-efa454{color:#C9D1D9}.ct-6b7a71{color:#C9D1D9}.ct-fd005d{color:#79C0FF}.ct-0d7550{color:#FF7B72}.ct-18900e{color:#FF7B72}.ct-53f02b{color:#A5D6FF}.ct-27e645{color:#C9D1D9}.ct-d64517{color:#7EE787}.light .ct-d64517{color:#268BD2}.light .ct-27e645{color:#657B83}.light .ct-53f02b{color:#2AA198}.light .ct-18900e{color:#073642}.light .ct-0d7550{color:#859900}.light .ct-fd005d{color:#D33682}.light .ct-6b7a71{color:#859900}.light .ct-efa454{color:#268BD2}.light .ct-828f3e{color:#93A1A1}.light .ct-bda083{color:#657B83}.light .ct-955371{color:#073642}.light .ct-15522e{color:#657B83}"}]}],toc:{title:m,searchDepth:C,depth:C,links:[{id:E,depth:C,text:F},{id:J,depth:C,text:K}]}},_type:"markdown",_id:"content:Obsidian:Self-hosted Obsidian sync with CouchDB.md",_source:"content",_file:"Obsidian\u002FSelf-hosted Obsidian sync with CouchDB.md",_extension:"md"}},prerenderedAt:1711020862499}}("element","text","span","ct-27e645","line","ct-0d7550","code-inline","li","code",":","ct-d64517","ct-53f02b",""," "," ","p","pre"," - ","ct-6b7a71","$","ct-efa454"," ","a","nofollow","h2",": "," listen ",";",2,false,"setting-up-environment","Setting up environment","version: '3'\nservices:\n couchserver:\n container_name: obsidian__database\n image: couchdb\n restart: always\n ports:\n - \"5984:5984\"\n environment:\n - COUCHDB_USER=user\n - COUCHDB_PASSWORD=somepassword\n volumes:\n - .\u002Fcouchdb\u002Fdbdata:\u002Fopt\u002Fcouchdb\u002Fdata\n - .\u002Fcouchdb\u002Flocal.ini:\u002Fopt\u002Fcouchdb\u002Fetc\u002Flocal.ini\n","[couchdb]\nsingle_node=true\nmax_document_size=50000000\nmax_http_request_size=4294967296\n\n[chttpd]\nrequire_valid_user = true\n\n[chttpd_auth]\nrequire_valid_user = true\nauthentication_redirect = \u002F_utils\u002Fsession.html\n\n[httpd]\nWWW-Authenticate = Basic realm=\"couchdb\"\nenable_cors = true\n\n[cors]\norigins = app:\u002F\u002Fobsidian.md,capacitor:\u002F\u002Flocalhost,http:\u002F\u002Flocalhost\ncredentials = true\nheaders = accept, authorization, content-type, origin, referer\nmethods = GET, PUT, POST, HEAD, DELETE\nmax_age = 3600\n","server {\n listen 80;\n listen [::]:80;\n server_name couchdb.yourhost.com;\n return 301 https:\u002F\u002F$host$request_uri;\n}\n\nserver {\n listen 443 ssl http2;\n listen [::]:443 ssl http2;\n\n ssl_certificate \u002Fetc\u002Fletsencrypt\u002Flive\u002Fyourhost.com\u002Ffullchain.pem; # managed by Certbot\n ssl_certificate_key \u002Fetc\u002Fletsencrypt\u002Flive\u002Fyourhost.com\u002Fprivkey.pem; # managed by Certbot\n ssl_trusted_certificate \u002Fetc\u002Fletsencrypt\u002Flive\u002Fyourhost.com\u002Fchain.pem;\n\n server_name couchdb.yourhost.com;\n client_max_body_size 200M;\n\n location \u002F {\n proxy_redirect off;\n proxy_set_header Host $host;\n proxy_set_header X-Real-IP $remote_addr;\n proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n\n proxy_pass http:\u002F\u002F127.0.0.1:5984;\n }\n}\n","setting-up-obsidian","Setting up Obsidian"," ","ct-bda083"," proxy_set_header ","Self Hosted Obsidian Sync With CouchDB","\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb","root","ul","https:\u002F\u002Fgithub.com\u002Fvrtmrz\u002Fobsidian-livesync","Main documentation","https:\u002F\u002Fgithub.com\u002Fvrtmrz\u002Fobsidian-livesync\u002Fblob\u002Fmain\u002Fdocs\u002Fsetup_own_server.md","Setting up couchdb","First, you should create ","docker-compose.yml"," with the following contents:","yaml","Then create initial config at ",".\u002Fcouchdb\u002Flocal.ini","ini","Then, in order to have sync on mobile devices, we will need a reverse proxy with nginx at ","\u002Fetc\u002Fnginx\u002Fsites-enabled\u002Fobsidian-couchdb","nginx","ol","Install ","Self-hosted LiveSync"," plugin","Change host to ","https:\u002F\u002Fyourhost.com","Specify username and password","Press ","test",", then ","fetch database","ct-18900e","server"," {"," server_name ","couchdb.yourhost.com;"," ","host","}","ct-828f3e","# managed by Certbot")) \ No newline at end of file diff --git a/docs/obsidian/self-hosted-obsidian-sync-with-couchdb/index.html b/docs/obsidian/self-hosted-obsidian-sync-with-couchdb/index.html index 6094c35..9b572dc 100644 --- a/docs/obsidian/self-hosted-obsidian-sync-with-couchdb/index.html +++ b/docs/obsidian/self-hosted-obsidian-sync-with-couchdb/index.html @@ -1,8 +1,8 @@ -Self Hosted Obsidian Sync With CouchDB • Obsidian Garden -

Self Hosted Obsidian Sync With CouchDB

Setting up environment

First, you should create docker-compose.yml with the following contents:

version: '3'services:  couchserver:    container_name: obsidian__database    image: couchdb    restart: always    ports:      - "5984:5984"    environment:      - COUCHDB_USER=user      - COUCHDB_PASSWORD=somepassword    volumes:      - ./couchdb/dbdata:/opt/couchdb/data      - ./couchdb/local.ini:/opt/couchdb/etc/local.ini

Then create initial config at ./couchdb/local.ini:

[couchdb]
+

Self Hosted Obsidian Sync With CouchDB

Setting up environment

First, you should create docker-compose.yml with the following contents:

version: '3'services:  couchserver:    container_name: obsidian__database    image: couchdb    restart: always    ports:      - "5984:5984"    environment:      - COUCHDB_USER=user      - COUCHDB_PASSWORD=somepassword    volumes:      - ./couchdb/dbdata:/opt/couchdb/data      - ./couchdb/local.ini:/opt/couchdb/etc/local.ini

Then create initial config at ./couchdb/local.ini:

[couchdb]
 single_node=true
 max_document_size=50000000
 max_http_request_size=4294967296
@@ -23,5 +23,5 @@ origins = app://obsidian.md,capacitor://localhost,http://localhost
 credentials = true
 headers = accept, authorization, content-type, origin, referer
 methods = GET, PUT, POST, HEAD, DELETE
-max_age = 3600

Then, in order to have sync on mobile devices, we will need a reverse proxy with nginx at /etc/nginx/sites-enabled/obsidian-couchdb:

server {    listen 80;    listen [::]:80;    server_name couchdb.yourhost.com;    return 301 https://$host$request_uri;}server {        listen 443 ssl http2;        listen [::]:443 ssl http2;        ssl_certificate /etc/letsencrypt/live/yourhost.com/fullchain.pem; # managed by Certbot        ssl_certificate_key /etc/letsencrypt/live/yourhost.com/privkey.pem; # managed by Certbot        ssl_trusted_certificate /etc/letsencrypt/live/yourhost.com/chain.pem;        server_name couchdb.yourhost.com;        client_max_body_size 200M;        location / {                proxy_redirect off;                proxy_set_header Host $host;                proxy_set_header X-Real-IP $remote_addr;                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;                proxy_pass http://127.0.0.1:5984;        }}

Setting up Obsidian

  1. Install Self-hosted LiveSync plugin
  2. Change host to https://yourhost.com
  3. Specify username and password
  4. Press test, then fetch database
btw, have a nice day
(2018 - 2024) muerwre
+max_age = 3600

Then, in order to have sync on mobile devices, we will need a reverse proxy with nginx at /etc/nginx/sites-enabled/obsidian-couchdb:

server {    listen 80;    listen [::]:80;    server_name couchdb.yourhost.com;    return 301 https://$host$request_uri;}server {        listen 443 ssl http2;        listen [::]:443 ssl http2;        ssl_certificate /etc/letsencrypt/live/yourhost.com/fullchain.pem; # managed by Certbot        ssl_certificate_key /etc/letsencrypt/live/yourhost.com/privkey.pem; # managed by Certbot        ssl_trusted_certificate /etc/letsencrypt/live/yourhost.com/chain.pem;        server_name couchdb.yourhost.com;        client_max_body_size 200M;        location / {                proxy_redirect off;                proxy_set_header Host $host;                proxy_set_header X-Real-IP $remote_addr;                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;                proxy_pass http://127.0.0.1:5984;        }}

Setting up Obsidian

  1. Install Self-hosted LiveSync plugin
  2. Change host to https://yourhost.com
  3. Specify username and password
  4. Press test, then fetch database
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/sql/mysql-and-mariadb-setup/_payload.js b/docs/sql/mysql-and-mariadb-setup/_payload.js index 0729274..79b6aa6 100644 --- a/docs/sql/mysql-and-mariadb-setup/_payload.js +++ b/docs/sql/mysql-and-mariadb-setup/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:A,_path:B},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-H09FJYhNy5":{_path:B,_dir:"sql",_draft:o,_partial:o,_locale:"en",_empty:o,title:A,description:e,excerpt:{type:C,children:[{type:a,tag:k,props:{id:p},children:[{type:b,value:q}]},{type:a,tag:c,props:{code:r,language:D},children:[{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{__ignoreMap:e},children:[{type:b,value:r}]}]}]},{type:a,tag:k,props:{id:s},children:[{type:b,value:t}]},{type:a,tag:E,props:{},children:[{type:b,value:F},{type:a,tag:g,props:{},children:[{type:b,value:G}]},{type:b,value:H},{type:a,tag:g,props:{},children:[{type:b,value:I}]},{type:b,value:J}]},{type:a,tag:c,props:{code:u,language:K},children:[{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{__ignoreMap:e},children:[{type:b,value:u}]}]}]},{type:a,tag:k,props:{id:v},children:[{type:b,value:w}]},{type:a,tag:l,props:{},children:[{type:a,tag:m,props:{},children:[{type:b,value:L},{type:a,tag:g,props:{},children:[{type:b,value:M}]},{type:b,value:N},{type:a,tag:g,props:{},children:[{type:b,value:O}]},{type:b,value:P},{type:a,tag:g,props:{},children:[{type:b,value:Q}]},{type:b,value:R}]}]},{type:a,tag:c,props:{code:x,language:n},children:[{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{__ignoreMap:e},children:[{type:b,value:x}]}]}]},{type:a,tag:l,props:{start:i},children:[{type:a,tag:m,props:{},children:[{type:b,value:S}]}]},{type:a,tag:c,props:{code:y,language:n},children:[{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{__ignoreMap:e},children:[{type:b,value:y}]}]}]},{type:a,tag:l,props:{start:T},children:[{type:a,tag:m,props:{},children:[{type:b,value:U}]}]},{type:a,tag:c,props:{code:z,language:n},children:[{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{__ignoreMap:e},children:[{type:b,value:z}]}]}]}]},body:{type:C,children:[{type:a,tag:k,props:{id:p},children:[{type:b,value:q}]},{type:a,tag:c,props:{code:r,language:D},children:[{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{__ignoreMap:e},children:[{type:a,tag:d,props:{class:h},children:[{type:a,tag:d,props:{class:j},children:[{type:b,value:"sudo apt update"}]}]},{type:a,tag:d,props:{class:h},children:[{type:a,tag:d,props:{class:j},children:[{type:b,value:"sudo apt install mariadb-server"}]}]},{type:a,tag:d,props:{class:h},children:[{type:a,tag:d,props:{class:j},children:[{type:b,value:"sudo mysql_secure_installation"}]}]}]}]}]},{type:a,tag:k,props:{id:s},children:[{type:b,value:t}]},{type:a,tag:E,props:{},children:[{type:b,value:F},{type:a,tag:g,props:{},children:[{type:b,value:G}]},{type:b,value:H},{type:a,tag:g,props:{},children:[{type:b,value:I}]},{type:b,value:J}]},{type:a,tag:c,props:{code:u,language:K},children:[{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{__ignoreMap:e},children:[{type:a,tag:d,props:{class:h},children:[{type:a,tag:d,props:{class:j},children:[{type:b,value:V}]}]},{type:a,tag:d,props:{class:h},children:[{type:a,tag:d,props:{class:j},children:[{type:b,value:"bind-"}]},{type:a,tag:d,props:{class:"ct-a46354"},children:[{type:b,value:"address"}]},{type:a,tag:d,props:{class:j},children:[{type:b,value:" = 0.0.0.0"}]}]},{type:a,tag:d,props:{class:h},children:[{type:a,tag:d,props:{class:j},children:[{type:b,value:V}]}]}]}]}]},{type:a,tag:k,props:{id:v},children:[{type:b,value:w}]},{type:a,tag:l,props:{},children:[{type:a,tag:m,props:{},children:[{type:b,value:L},{type:a,tag:g,props:{},children:[{type:b,value:M}]},{type:b,value:N},{type:a,tag:g,props:{},children:[{type:b,value:O}]},{type:b,value:P},{type:a,tag:g,props:{},children:[{type:b,value:Q}]},{type:b,value:R}]}]},{type:a,tag:c,props:{code:x,language:n},children:[{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{__ignoreMap:e},children:[{type:a,tag:d,props:{class:h},children:[{type:a,tag:d,props:{},children:[{type:b,value:"CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password';"}]}]}]}]}]},{type:a,tag:l,props:{start:i},children:[{type:a,tag:m,props:{},children:[{type:b,value:S}]}]},{type:a,tag:c,props:{code:y,language:n},children:[{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{__ignoreMap:e},children:[{type:a,tag:d,props:{class:h},children:[{type:a,tag:d,props:{},children:[{type:b,value:"GRANT ALL PRIVILEGES ON * . * TO 'newuser'@'localhost';"}]}]}]}]}]},{type:a,tag:l,props:{start:T},children:[{type:a,tag:m,props:{},children:[{type:b,value:U}]}]},{type:a,tag:c,props:{code:z,language:n},children:[{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{__ignoreMap:e},children:[{type:a,tag:d,props:{class:h},children:[{type:a,tag:d,props:{},children:[{type:b,value:"FLUSH PRIVILEGES;"}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-a46354{color:#FF7B72}.ct-cf1a8e{color:#C9D1D9}.light .ct-cf1a8e{color:#657B83}.light .ct-a46354{color:#859900}"}]}],toc:{title:e,searchDepth:i,depth:i,links:[{id:p,depth:i,text:q},{id:s,depth:i,text:t},{id:v,depth:i,text:w}]}},_type:"markdown",_id:"content:SQL:MySQL and MariaDB setup.md",_source:"content",_file:"SQL\u002FMySQL and MariaDB setup.md",_extension:"md"}},prerenderedAt:1711020228008}}("element","text","code","span","","pre","code-inline","line",2,"ct-cf1a8e","h2","ol","li","mysql",false,"install-mariadb-on-ubuntu-2004-lts","Install MariaDB on Ubuntu 20.04 LTS","sudo apt update\nsudo apt install mariadb-server\nsudo mysql_secure_installation\n","access-database-from-outside","Access Database from outside","...\nbind-address = 0.0.0.0\n...\n","create-administrative-user","Create Administrative User","CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password';\n","GRANT ALL PRIVILEGES ON * . * TO 'newuser'@'localhost';\n","FLUSH PRIVILEGES;\n","MySQL And MariaDB Setup","\u002Fsql\u002Fmysql-and-mariadb-setup","root","bash","p","Open ","\u002Fetc\u002Fmysql\u002Fmariadb.conf.d\u002F50-server.cnf"," and change the ","bind-address"," to:","nginx","Create a new user ","newuser"," for the host ","localhost"," with a new ","password",":","Grant all permissions to the new user",3,"Update permissions","...")) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:A,_path:B},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-H09FJYhNy5":{_path:B,_dir:"sql",_draft:o,_partial:o,_locale:"en",_empty:o,title:A,description:e,excerpt:{type:C,children:[{type:a,tag:k,props:{id:p},children:[{type:b,value:q}]},{type:a,tag:c,props:{code:r,language:D},children:[{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{__ignoreMap:e},children:[{type:b,value:r}]}]}]},{type:a,tag:k,props:{id:s},children:[{type:b,value:t}]},{type:a,tag:E,props:{},children:[{type:b,value:F},{type:a,tag:g,props:{},children:[{type:b,value:G}]},{type:b,value:H},{type:a,tag:g,props:{},children:[{type:b,value:I}]},{type:b,value:J}]},{type:a,tag:c,props:{code:u,language:K},children:[{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{__ignoreMap:e},children:[{type:b,value:u}]}]}]},{type:a,tag:k,props:{id:v},children:[{type:b,value:w}]},{type:a,tag:l,props:{},children:[{type:a,tag:m,props:{},children:[{type:b,value:L},{type:a,tag:g,props:{},children:[{type:b,value:M}]},{type:b,value:N},{type:a,tag:g,props:{},children:[{type:b,value:O}]},{type:b,value:P},{type:a,tag:g,props:{},children:[{type:b,value:Q}]},{type:b,value:R}]}]},{type:a,tag:c,props:{code:x,language:n},children:[{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{__ignoreMap:e},children:[{type:b,value:x}]}]}]},{type:a,tag:l,props:{start:i},children:[{type:a,tag:m,props:{},children:[{type:b,value:S}]}]},{type:a,tag:c,props:{code:y,language:n},children:[{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{__ignoreMap:e},children:[{type:b,value:y}]}]}]},{type:a,tag:l,props:{start:T},children:[{type:a,tag:m,props:{},children:[{type:b,value:U}]}]},{type:a,tag:c,props:{code:z,language:n},children:[{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{__ignoreMap:e},children:[{type:b,value:z}]}]}]}]},body:{type:C,children:[{type:a,tag:k,props:{id:p},children:[{type:b,value:q}]},{type:a,tag:c,props:{code:r,language:D},children:[{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{__ignoreMap:e},children:[{type:a,tag:d,props:{class:h},children:[{type:a,tag:d,props:{class:j},children:[{type:b,value:"sudo apt update"}]}]},{type:a,tag:d,props:{class:h},children:[{type:a,tag:d,props:{class:j},children:[{type:b,value:"sudo apt install mariadb-server"}]}]},{type:a,tag:d,props:{class:h},children:[{type:a,tag:d,props:{class:j},children:[{type:b,value:"sudo mysql_secure_installation"}]}]}]}]}]},{type:a,tag:k,props:{id:s},children:[{type:b,value:t}]},{type:a,tag:E,props:{},children:[{type:b,value:F},{type:a,tag:g,props:{},children:[{type:b,value:G}]},{type:b,value:H},{type:a,tag:g,props:{},children:[{type:b,value:I}]},{type:b,value:J}]},{type:a,tag:c,props:{code:u,language:K},children:[{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{__ignoreMap:e},children:[{type:a,tag:d,props:{class:h},children:[{type:a,tag:d,props:{class:j},children:[{type:b,value:V}]}]},{type:a,tag:d,props:{class:h},children:[{type:a,tag:d,props:{class:j},children:[{type:b,value:"bind-"}]},{type:a,tag:d,props:{class:"ct-409982"},children:[{type:b,value:"address"}]},{type:a,tag:d,props:{class:j},children:[{type:b,value:" = 0.0.0.0"}]}]},{type:a,tag:d,props:{class:h},children:[{type:a,tag:d,props:{class:j},children:[{type:b,value:V}]}]}]}]}]},{type:a,tag:k,props:{id:v},children:[{type:b,value:w}]},{type:a,tag:l,props:{},children:[{type:a,tag:m,props:{},children:[{type:b,value:L},{type:a,tag:g,props:{},children:[{type:b,value:M}]},{type:b,value:N},{type:a,tag:g,props:{},children:[{type:b,value:O}]},{type:b,value:P},{type:a,tag:g,props:{},children:[{type:b,value:Q}]},{type:b,value:R}]}]},{type:a,tag:c,props:{code:x,language:n},children:[{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{__ignoreMap:e},children:[{type:a,tag:d,props:{class:h},children:[{type:a,tag:d,props:{},children:[{type:b,value:"CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password';"}]}]}]}]}]},{type:a,tag:l,props:{start:i},children:[{type:a,tag:m,props:{},children:[{type:b,value:S}]}]},{type:a,tag:c,props:{code:y,language:n},children:[{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{__ignoreMap:e},children:[{type:a,tag:d,props:{class:h},children:[{type:a,tag:d,props:{},children:[{type:b,value:"GRANT ALL PRIVILEGES ON * . * TO 'newuser'@'localhost';"}]}]}]}]}]},{type:a,tag:l,props:{start:T},children:[{type:a,tag:m,props:{},children:[{type:b,value:U}]}]},{type:a,tag:c,props:{code:z,language:n},children:[{type:a,tag:f,props:{},children:[{type:a,tag:c,props:{__ignoreMap:e},children:[{type:a,tag:d,props:{class:h},children:[{type:a,tag:d,props:{},children:[{type:b,value:"FLUSH PRIVILEGES;"}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-409982{color:#FF7B72}.ct-775f4b{color:#C9D1D9}.light .ct-775f4b{color:#657B83}.light .ct-409982{color:#859900}"}]}],toc:{title:e,searchDepth:i,depth:i,links:[{id:p,depth:i,text:q},{id:s,depth:i,text:t},{id:v,depth:i,text:w}]}},_type:"markdown",_id:"content:SQL:MySQL and MariaDB setup.md",_source:"content",_file:"SQL\u002FMySQL and MariaDB setup.md",_extension:"md"}},prerenderedAt:1711020862539}}("element","text","code","span","","pre","code-inline","line",2,"ct-775f4b","h2","ol","li","mysql",false,"install-mariadb-on-ubuntu-2004-lts","Install MariaDB on Ubuntu 20.04 LTS","sudo apt update\nsudo apt install mariadb-server\nsudo mysql_secure_installation\n","access-database-from-outside","Access Database from outside","...\nbind-address = 0.0.0.0\n...\n","create-administrative-user","Create Administrative User","CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password';\n","GRANT ALL PRIVILEGES ON * . * TO 'newuser'@'localhost';\n","FLUSH PRIVILEGES;\n","MySQL And MariaDB Setup","\u002Fsql\u002Fmysql-and-mariadb-setup","root","bash","p","Open ","\u002Fetc\u002Fmysql\u002Fmariadb.conf.d\u002F50-server.cnf"," and change the ","bind-address"," to:","nginx","Create a new user ","newuser"," for the host ","localhost"," with a new ","password",":","Grant all permissions to the new user",3,"Update permissions","...")) \ No newline at end of file diff --git a/docs/sql/mysql-and-mariadb-setup/index.html b/docs/sql/mysql-and-mariadb-setup/index.html index 4b9282f..f6d1dd5 100644 --- a/docs/sql/mysql-and-mariadb-setup/index.html +++ b/docs/sql/mysql-and-mariadb-setup/index.html @@ -1,6 +1,6 @@ -MySQL And MariaDB Setup • Obsidian Garden -

MySQL And MariaDB Setup

Install MariaDB on Ubuntu 20.04 LTS

sudo apt updatesudo apt install mariadb-serversudo mysql_secure_installation

Access Database from outside

Open /etc/mysql/mariadb.conf.d/50-server.cnf and change the bind-address to:

...bind-address = 0.0.0.0...

Create Administrative User

  1. Create a new user newuser for the host localhost with a new password:
CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password';
  1. Grant all permissions to the new user
GRANT ALL PRIVILEGES ON * . * TO 'newuser'@'localhost';
  1. Update permissions
FLUSH PRIVILEGES;
btw, have a nice day
(2018 - 2024) muerwre
+

MySQL And MariaDB Setup

Install MariaDB on Ubuntu 20.04 LTS

sudo apt updatesudo apt install mariadb-serversudo mysql_secure_installation

Access Database from outside

Open /etc/mysql/mariadb.conf.d/50-server.cnf and change the bind-address to:

...bind-address = 0.0.0.0...

Create Administrative User

  1. Create a new user newuser for the host localhost with a new password:
CREATE USER 'newuser'@'localhost' IDENTIFIED BY 'password';
  1. Grant all permissions to the new user
GRANT ALL PRIVILEGES ON * . * TO 'newuser'@'localhost';
  1. Update permissions
FLUSH PRIVILEGES;
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/sql/postgress-setup/_payload.js b/docs/sql/postgress-setup/_payload.js index 3bbfc93..a6ed7f7 100644 --- a/docs/sql/postgress-setup/_payload.js +++ b/docs/sql/postgress-setup/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:N,_path:O}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-OeCNLqMRmJ":{_path:O,_dir:m,_draft:r,_partial:r,_locale:"en",_empty:r,title:N,description:f,excerpt:{type:P,children:[{type:a,tag:k,props:{id:s},children:[{type:b,value:t}]},{type:a,tag:d,props:{code:u,language:l},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:b,value:u}]}]}]},{type:a,tag:k,props:{id:v},children:[{type:b,value:w}]},{type:a,tag:g,props:{},children:[{type:b,value:Q}]},{type:a,tag:d,props:{code:x,language:l},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:b,value:x}]}]}]},{type:a,tag:k,props:{id:y},children:[{type:b,value:z}]},{type:a,tag:g,props:{},children:[{type:b,value:R},{type:a,tag:e,props:{},children:[{type:b,value:o}]},{type:b,value:S},{type:a,tag:e,props:{},children:[{type:b,value:T}]},{type:b,value:U},{type:a,tag:e,props:{},children:[{type:b,value:V}]},{type:b,value:W},{type:a,tag:e,props:{},children:[{type:b,value:o}]},{type:b,value:X},{type:a,tag:e,props:{},children:[{type:b,value:q}]},{type:b,value:p}]},{type:a,tag:Y,props:{id:A},children:[{type:b,value:B}]},{type:a,tag:g,props:{},children:[{type:b,value:Z},{type:a,tag:e,props:{},children:[{type:b,value:o}]},{type:b,value:_},{type:a,tag:e,props:{},children:[{type:b,value:q}]},{type:b,value:$},{type:a,tag:e,props:{},children:[{type:b,value:aa}]},{type:b,value:p}]},{type:a,tag:d,props:{code:C,language:ab},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:b,value:C}]}]}]},{type:a,tag:g,props:{},children:[{type:b,value:ac},{type:a,tag:e,props:{},children:[{type:b,value:ad}]},{type:b,value:p}]},{type:a,tag:d,props:{code:D},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:b,value:D}]}]}]},{type:a,tag:g,props:{},children:[{type:b,value:ae}]},{type:a,tag:d,props:{code:E,language:l},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:b,value:E}]}]}]},{type:a,tag:g,props:{},children:[{type:b,value:af}]},{type:a,tag:d,props:{code:F,language:l},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:b,value:F}]}]}]},{type:a,tag:k,props:{id:G},children:[{type:b,value:H}]},{type:a,tag:g,props:{},children:[{type:b,value:ag}]},{type:a,tag:d,props:{code:I,language:m},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:b,value:I}]}]}]},{type:a,tag:k,props:{id:J},children:[{type:b,value:K}]},{type:a,tag:g,props:{},children:[{type:b,value:ah},{type:a,tag:e,props:{},children:[{type:b,value:ai}]},{type:b,value:aj}]},{type:a,tag:d,props:{code:L,language:m},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:b,value:L}]}]}]},{type:a,tag:g,props:{},children:[{type:b,value:ak},{type:a,tag:e,props:{},children:[{type:b,value:al}]},{type:b,value:am}]},{type:a,tag:g,props:{},children:[{type:b,value:an}]},{type:a,tag:d,props:{code:M,language:m},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:b,value:M}]}]}]}]},body:{type:P,children:[{type:a,tag:k,props:{id:s},children:[{type:b,value:t}]},{type:a,tag:d,props:{code:u,language:l},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:"sudo apt update"}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:"sudo apt install -y postgresql postgresql-contrib postgresql-client"}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:"sudo systemctl status postgresql.service"}]}]}]}]}]},{type:a,tag:k,props:{id:v},children:[{type:b,value:w}]},{type:a,tag:g,props:{},children:[{type:b,value:Q}]},{type:a,tag:d,props:{code:x,language:l},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:"sudo -u postgres psql"}]}]},{type:a,tag:c,props:{class:h},children:[]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:"psql (12.12 (Ubuntu 12.12-0ubuntu0.20.04.1))"}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:"Type "}]},{type:a,tag:c,props:{class:"ct-807f38"},children:[{type:b,value:"\"help\""}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:"ct-3a57b7"},children:[{type:b,value:"for"}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:" help."}]}]},{type:a,tag:c,props:{class:h},children:[]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:"postgres="}]},{type:a,tag:c,props:{class:"ct-ba601c"},children:[{type:b,value:"#"}]}]}]}]}]},{type:a,tag:k,props:{id:y},children:[{type:b,value:z}]},{type:a,tag:g,props:{},children:[{type:b,value:R},{type:a,tag:e,props:{},children:[{type:b,value:o}]},{type:b,value:S},{type:a,tag:e,props:{},children:[{type:b,value:T}]},{type:b,value:U},{type:a,tag:e,props:{},children:[{type:b,value:V}]},{type:b,value:W},{type:a,tag:e,props:{},children:[{type:b,value:o}]},{type:b,value:X},{type:a,tag:e,props:{},children:[{type:b,value:q}]},{type:b,value:p}]},{type:a,tag:Y,props:{id:A},children:[{type:b,value:B}]},{type:a,tag:g,props:{},children:[{type:b,value:Z},{type:a,tag:e,props:{},children:[{type:b,value:o}]},{type:b,value:_},{type:a,tag:e,props:{},children:[{type:b,value:q}]},{type:b,value:$},{type:a,tag:e,props:{},children:[{type:b,value:aa}]},{type:b,value:p}]},{type:a,tag:d,props:{code:C,language:ab},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:"sudo vi \u002Fetc\u002Fpostgresql\u002F12\u002Fmain\u002Fpg_hba.conf"}]}]},{type:a,tag:c,props:{class:h},children:[]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:ao}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:"ct-3ccee5"},children:[{type:b,value:"local"}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:" all postgres peer"}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:ao}]}]}]}]}]},{type:a,tag:g,props:{},children:[{type:b,value:ac},{type:a,tag:e,props:{},children:[{type:b,value:ad}]},{type:b,value:p}]},{type:a,tag:d,props:{code:D},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{},children:[{type:b,value:"local all postgres md5"}]}]}]}]}]},{type:a,tag:g,props:{},children:[{type:b,value:ae}]},{type:a,tag:d,props:{code:E,language:l},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:"sudo systemctl restart postgresql"}]}]}]}]}]},{type:a,tag:g,props:{},children:[{type:b,value:af}]},{type:a,tag:d,props:{code:F,language:l},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:"psql -U postgres -d postgres -h databasehostname"}]}]}]}]}]},{type:a,tag:k,props:{id:G},children:[{type:b,value:H}]},{type:a,tag:g,props:{},children:[{type:b,value:ag}]},{type:a,tag:d,props:{code:I,language:m},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{},children:[{type:b,value:"create user myuser with encrypted password 'Supersecret';\nCREATE ROLE\n\npostgres=# \\du\n List of roles\n Role name | Attributes | Member of\n-----------+------------------------------------------------------------+-----------\n myuser | | {}\n postgres | Superuser, Create role, Create DB, Replication, Bypass RLS | {}"}]}]}]}]}]},{type:a,tag:k,props:{id:J},children:[{type:b,value:K}]},{type:a,tag:g,props:{},children:[{type:b,value:ah},{type:a,tag:e,props:{},children:[{type:b,value:ai}]},{type:b,value:aj}]},{type:a,tag:d,props:{code:L,language:m},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{},children:[{type:b,value:"CREATE DATABASE dbname OWNER myuser;\nCREATE DATABASE\n\npostgres=# \\l\n List of databases\n Name | Owner | Encoding | Collate | Ctype | Access privileges\n-----------+----------+----------+-------------+-------------+-----------------------\n dbname | myuser | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n postgres | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n template0 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c\u002Fpostgres +\n | | | | | postgres=CTc\u002Fpostgres\n template1 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c\u002Fpostgres +\n | | | | | postgres=CTc\u002Fpostgres"}]}]}]}]}]},{type:a,tag:g,props:{},children:[{type:b,value:ak},{type:a,tag:e,props:{},children:[{type:b,value:al}]},{type:b,value:am}]},{type:a,tag:g,props:{},children:[{type:b,value:an}]},{type:a,tag:d,props:{code:M,language:m},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{},children:[{type:b,value:"postgres=# alter database dbname owner to myuser;\nALTER DATABASE"}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-3ccee5{color:#FF7B72}.ct-ba601c{color:#8B949E}.ct-3a57b7{color:#FF7B72}.ct-807f38{color:#A5D6FF}.ct-662fdc{color:#C9D1D9}.light .ct-662fdc{color:#657B83}.light .ct-807f38{color:#2AA198}.light .ct-3a57b7{color:#859900}.light .ct-ba601c{color:#93A1A1}.light .ct-3ccee5{color:#073642}"}]}],toc:{title:f,searchDepth:n,depth:n,links:[{id:s,depth:n,text:t},{id:v,depth:n,text:w},{id:y,depth:n,text:z,children:[{id:A,depth:3,text:B}]},{id:G,depth:n,text:H},{id:J,depth:n,text:K}]}},_type:"markdown",_id:"content:SQL:Postgress setup.md",_source:"content",_file:"SQL\u002FPostgress setup.md",_extension:"md"}},prerenderedAt:1711020228030}}("element","text","span","code","code-inline","","p","line","pre","ct-662fdc","h2","bash","sql",2,"postgres",".","pg_hba.conf",false,"install-postgresql-12-on-ubuntu-2004-lts","Install PostgreSQL 12 on Ubuntu 20.04 LTS","sudo apt update\nsudo apt install -y postgresql postgresql-contrib postgresql-client\nsudo systemctl status postgresql.service\n","initial-database-connection","Initial database connection","sudo -u postgres psql\n\npsql (12.12 (Ubuntu 12.12-0ubuntu0.20.04.1))\nType \"help\" for help.\n\npostgres=#\n","set-password-for-postgres-database-user","Set password for postgres database user","update-pg_hbaconf-to-allow-postgres-user-connections-with-password","Update pg_hba.conf to allow postgres user connections with password","sudo vi \u002Fetc\u002Fpostgresql\u002F12\u002Fmain\u002Fpg_hba.conf\n\n...\nlocal all postgres peer\n...\n","local all postgres md5\n","sudo systemctl restart postgresql\n","psql -U postgres -d postgres -h databasehostname\n","creation-of-additional-database-users","Creation of additional database users","create user myuser with encrypted password 'Supersecret';\nCREATE ROLE\n\npostgres=# \\du\n List of roles\n Role name | Attributes | Member of\n-----------+------------------------------------------------------------+-----------\n myuser | | {}\n postgres | Superuser, Create role, Create DB, Replication, Bypass RLS | {}\n","creation-of-additional-databases","Creation of additional databases","CREATE DATABASE dbname OWNER myuser;\nCREATE DATABASE\n\npostgres=# \\l\n List of databases\n Name | Owner | Encoding | Collate | Ctype | Access privileges\n-----------+----------+----------+-------------+-------------+-----------------------\n dbname | myuser | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n postgres | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n template0 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c\u002Fpostgres +\n | | | | | postgres=CTc\u002Fpostgres\n template1 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c\u002Fpostgres +\n | | | | | postgres=CTc\u002Fpostgres\n","postgres=# alter database dbname owner to myuser;\nALTER DATABASE\n","Postgress Setup","\u002Fsql\u002Fpostgress-setup","root","A local connection (from the database server) can be done by the following command:","The password for the "," database user can be set the the quick command ","\\password","\nor by ","alter user postgres password 'Supersecret'",". A connection using the "," user\nis still not possible from the \"outside\" hence to the default settings in the ","h3","In order to allow connections of the "," database user not using OS user\nauthentication, you have to update the "," which can be found under\n","\u002Fetc\u002Fpostgresql\u002F12\u002Fmain\u002Fpg_hba.conf","shell","Change the last section of the above line to ","md5","A restart is required in order to apply the new configuration:","Now a connection from outside the database host is possible e.g.","A database user can be created by the following command:","One can create new Postgres databases within an instance. Therefore you can use the ","psql","\ncommand to login (see above).","You can leave the ","OWNER"," section of the command, when doing so, the current user will become\nowner of the newly created database.","To change the owner of an existing database later, you can use the following command:","...")) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:N,_path:O}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-OeCNLqMRmJ":{_path:O,_dir:m,_draft:r,_partial:r,_locale:"en",_empty:r,title:N,description:f,excerpt:{type:P,children:[{type:a,tag:k,props:{id:s},children:[{type:b,value:t}]},{type:a,tag:d,props:{code:u,language:l},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:b,value:u}]}]}]},{type:a,tag:k,props:{id:v},children:[{type:b,value:w}]},{type:a,tag:g,props:{},children:[{type:b,value:Q}]},{type:a,tag:d,props:{code:x,language:l},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:b,value:x}]}]}]},{type:a,tag:k,props:{id:y},children:[{type:b,value:z}]},{type:a,tag:g,props:{},children:[{type:b,value:R},{type:a,tag:e,props:{},children:[{type:b,value:o}]},{type:b,value:S},{type:a,tag:e,props:{},children:[{type:b,value:T}]},{type:b,value:U},{type:a,tag:e,props:{},children:[{type:b,value:V}]},{type:b,value:W},{type:a,tag:e,props:{},children:[{type:b,value:o}]},{type:b,value:X},{type:a,tag:e,props:{},children:[{type:b,value:q}]},{type:b,value:p}]},{type:a,tag:Y,props:{id:A},children:[{type:b,value:B}]},{type:a,tag:g,props:{},children:[{type:b,value:Z},{type:a,tag:e,props:{},children:[{type:b,value:o}]},{type:b,value:_},{type:a,tag:e,props:{},children:[{type:b,value:q}]},{type:b,value:$},{type:a,tag:e,props:{},children:[{type:b,value:aa}]},{type:b,value:p}]},{type:a,tag:d,props:{code:C,language:ab},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:b,value:C}]}]}]},{type:a,tag:g,props:{},children:[{type:b,value:ac},{type:a,tag:e,props:{},children:[{type:b,value:ad}]},{type:b,value:p}]},{type:a,tag:d,props:{code:D},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:b,value:D}]}]}]},{type:a,tag:g,props:{},children:[{type:b,value:ae}]},{type:a,tag:d,props:{code:E,language:l},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:b,value:E}]}]}]},{type:a,tag:g,props:{},children:[{type:b,value:af}]},{type:a,tag:d,props:{code:F,language:l},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:b,value:F}]}]}]},{type:a,tag:k,props:{id:G},children:[{type:b,value:H}]},{type:a,tag:g,props:{},children:[{type:b,value:ag}]},{type:a,tag:d,props:{code:I,language:m},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:b,value:I}]}]}]},{type:a,tag:k,props:{id:J},children:[{type:b,value:K}]},{type:a,tag:g,props:{},children:[{type:b,value:ah},{type:a,tag:e,props:{},children:[{type:b,value:ai}]},{type:b,value:aj}]},{type:a,tag:d,props:{code:L,language:m},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:b,value:L}]}]}]},{type:a,tag:g,props:{},children:[{type:b,value:ak},{type:a,tag:e,props:{},children:[{type:b,value:al}]},{type:b,value:am}]},{type:a,tag:g,props:{},children:[{type:b,value:an}]},{type:a,tag:d,props:{code:M,language:m},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:b,value:M}]}]}]}]},body:{type:P,children:[{type:a,tag:k,props:{id:s},children:[{type:b,value:t}]},{type:a,tag:d,props:{code:u,language:l},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:"sudo apt update"}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:"sudo apt install -y postgresql postgresql-contrib postgresql-client"}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:"sudo systemctl status postgresql.service"}]}]}]}]}]},{type:a,tag:k,props:{id:v},children:[{type:b,value:w}]},{type:a,tag:g,props:{},children:[{type:b,value:Q}]},{type:a,tag:d,props:{code:x,language:l},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:"sudo -u postgres psql"}]}]},{type:a,tag:c,props:{class:h},children:[]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:"psql (12.12 (Ubuntu 12.12-0ubuntu0.20.04.1))"}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:"Type "}]},{type:a,tag:c,props:{class:"ct-2ca8ba"},children:[{type:b,value:"\"help\""}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:" "}]},{type:a,tag:c,props:{class:"ct-11c2dc"},children:[{type:b,value:"for"}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:" help."}]}]},{type:a,tag:c,props:{class:h},children:[]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:"postgres="}]},{type:a,tag:c,props:{class:"ct-b954cf"},children:[{type:b,value:"#"}]}]}]}]}]},{type:a,tag:k,props:{id:y},children:[{type:b,value:z}]},{type:a,tag:g,props:{},children:[{type:b,value:R},{type:a,tag:e,props:{},children:[{type:b,value:o}]},{type:b,value:S},{type:a,tag:e,props:{},children:[{type:b,value:T}]},{type:b,value:U},{type:a,tag:e,props:{},children:[{type:b,value:V}]},{type:b,value:W},{type:a,tag:e,props:{},children:[{type:b,value:o}]},{type:b,value:X},{type:a,tag:e,props:{},children:[{type:b,value:q}]},{type:b,value:p}]},{type:a,tag:Y,props:{id:A},children:[{type:b,value:B}]},{type:a,tag:g,props:{},children:[{type:b,value:Z},{type:a,tag:e,props:{},children:[{type:b,value:o}]},{type:b,value:_},{type:a,tag:e,props:{},children:[{type:b,value:q}]},{type:b,value:$},{type:a,tag:e,props:{},children:[{type:b,value:aa}]},{type:b,value:p}]},{type:a,tag:d,props:{code:C,language:ab},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:"sudo vi \u002Fetc\u002Fpostgresql\u002F12\u002Fmain\u002Fpg_hba.conf"}]}]},{type:a,tag:c,props:{class:h},children:[]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:ao}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:"ct-ecfcaa"},children:[{type:b,value:"local"}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:" all postgres peer"}]}]},{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:ao}]}]}]}]}]},{type:a,tag:g,props:{},children:[{type:b,value:ac},{type:a,tag:e,props:{},children:[{type:b,value:ad}]},{type:b,value:p}]},{type:a,tag:d,props:{code:D},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{},children:[{type:b,value:"local all postgres md5"}]}]}]}]}]},{type:a,tag:g,props:{},children:[{type:b,value:ae}]},{type:a,tag:d,props:{code:E,language:l},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:"sudo systemctl restart postgresql"}]}]}]}]}]},{type:a,tag:g,props:{},children:[{type:b,value:af}]},{type:a,tag:d,props:{code:F,language:l},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:"psql -U postgres -d postgres -h databasehostname"}]}]}]}]}]},{type:a,tag:k,props:{id:G},children:[{type:b,value:H}]},{type:a,tag:g,props:{},children:[{type:b,value:ag}]},{type:a,tag:d,props:{code:I,language:m},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{},children:[{type:b,value:"create user myuser with encrypted password 'Supersecret';\nCREATE ROLE\n\npostgres=# \\du\n List of roles\n Role name | Attributes | Member of\n-----------+------------------------------------------------------------+-----------\n myuser | | {}\n postgres | Superuser, Create role, Create DB, Replication, Bypass RLS | {}"}]}]}]}]}]},{type:a,tag:k,props:{id:J},children:[{type:b,value:K}]},{type:a,tag:g,props:{},children:[{type:b,value:ah},{type:a,tag:e,props:{},children:[{type:b,value:ai}]},{type:b,value:aj}]},{type:a,tag:d,props:{code:L,language:m},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{},children:[{type:b,value:"CREATE DATABASE dbname OWNER myuser;\nCREATE DATABASE\n\npostgres=# \\l\n List of databases\n Name | Owner | Encoding | Collate | Ctype | Access privileges\n-----------+----------+----------+-------------+-------------+-----------------------\n dbname | myuser | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n postgres | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n template0 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c\u002Fpostgres +\n | | | | | postgres=CTc\u002Fpostgres\n template1 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c\u002Fpostgres +\n | | | | | postgres=CTc\u002Fpostgres"}]}]}]}]}]},{type:a,tag:g,props:{},children:[{type:b,value:ak},{type:a,tag:e,props:{},children:[{type:b,value:al}]},{type:b,value:am}]},{type:a,tag:g,props:{},children:[{type:b,value:an}]},{type:a,tag:d,props:{code:M,language:m},children:[{type:a,tag:i,props:{},children:[{type:a,tag:d,props:{__ignoreMap:f},children:[{type:a,tag:c,props:{class:h},children:[{type:a,tag:c,props:{},children:[{type:b,value:"postgres=# alter database dbname owner to myuser;\nALTER DATABASE"}]}]}]}]}]},{type:a,tag:"style",children:[{type:b,value:".ct-ecfcaa{color:#FF7B72}.ct-b954cf{color:#8B949E}.ct-11c2dc{color:#FF7B72}.ct-2ca8ba{color:#A5D6FF}.ct-230b36{color:#C9D1D9}.light .ct-230b36{color:#657B83}.light .ct-2ca8ba{color:#2AA198}.light .ct-11c2dc{color:#859900}.light .ct-b954cf{color:#93A1A1}.light .ct-ecfcaa{color:#073642}"}]}],toc:{title:f,searchDepth:n,depth:n,links:[{id:s,depth:n,text:t},{id:v,depth:n,text:w},{id:y,depth:n,text:z,children:[{id:A,depth:3,text:B}]},{id:G,depth:n,text:H},{id:J,depth:n,text:K}]}},_type:"markdown",_id:"content:SQL:Postgress setup.md",_source:"content",_file:"SQL\u002FPostgress setup.md",_extension:"md"}},prerenderedAt:1711020862565}}("element","text","span","code","code-inline","","p","line","pre","ct-230b36","h2","bash","sql",2,"postgres",".","pg_hba.conf",false,"install-postgresql-12-on-ubuntu-2004-lts","Install PostgreSQL 12 on Ubuntu 20.04 LTS","sudo apt update\nsudo apt install -y postgresql postgresql-contrib postgresql-client\nsudo systemctl status postgresql.service\n","initial-database-connection","Initial database connection","sudo -u postgres psql\n\npsql (12.12 (Ubuntu 12.12-0ubuntu0.20.04.1))\nType \"help\" for help.\n\npostgres=#\n","set-password-for-postgres-database-user","Set password for postgres database user","update-pg_hbaconf-to-allow-postgres-user-connections-with-password","Update pg_hba.conf to allow postgres user connections with password","sudo vi \u002Fetc\u002Fpostgresql\u002F12\u002Fmain\u002Fpg_hba.conf\n\n...\nlocal all postgres peer\n...\n","local all postgres md5\n","sudo systemctl restart postgresql\n","psql -U postgres -d postgres -h databasehostname\n","creation-of-additional-database-users","Creation of additional database users","create user myuser with encrypted password 'Supersecret';\nCREATE ROLE\n\npostgres=# \\du\n List of roles\n Role name | Attributes | Member of\n-----------+------------------------------------------------------------+-----------\n myuser | | {}\n postgres | Superuser, Create role, Create DB, Replication, Bypass RLS | {}\n","creation-of-additional-databases","Creation of additional databases","CREATE DATABASE dbname OWNER myuser;\nCREATE DATABASE\n\npostgres=# \\l\n List of databases\n Name | Owner | Encoding | Collate | Ctype | Access privileges\n-----------+----------+----------+-------------+-------------+-----------------------\n dbname | myuser | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n postgres | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 |\n template0 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c\u002Fpostgres +\n | | | | | postgres=CTc\u002Fpostgres\n template1 | postgres | UTF8 | en_US.UTF-8 | en_US.UTF-8 | =c\u002Fpostgres +\n | | | | | postgres=CTc\u002Fpostgres\n","postgres=# alter database dbname owner to myuser;\nALTER DATABASE\n","Postgress Setup","\u002Fsql\u002Fpostgress-setup","root","A local connection (from the database server) can be done by the following command:","The password for the "," database user can be set the the quick command ","\\password","\nor by ","alter user postgres password 'Supersecret'",". A connection using the "," user\nis still not possible from the \"outside\" hence to the default settings in the ","h3","In order to allow connections of the "," database user not using OS user\nauthentication, you have to update the "," which can be found under\n","\u002Fetc\u002Fpostgresql\u002F12\u002Fmain\u002Fpg_hba.conf","shell","Change the last section of the above line to ","md5","A restart is required in order to apply the new configuration:","Now a connection from outside the database host is possible e.g.","A database user can be created by the following command:","One can create new Postgres databases within an instance. Therefore you can use the ","psql","\ncommand to login (see above).","You can leave the ","OWNER"," section of the command, when doing so, the current user will become\nowner of the newly created database.","To change the owner of an existing database later, you can use the following command:","...")) \ No newline at end of file diff --git a/docs/sql/postgress-setup/index.html b/docs/sql/postgress-setup/index.html index 7a8d101..1b2b709 100644 --- a/docs/sql/postgress-setup/index.html +++ b/docs/sql/postgress-setup/index.html @@ -1,12 +1,12 @@ -Postgress Setup • Obsidian Garden -

Postgress Setup

Install PostgreSQL 12 on Ubuntu 20.04 LTS

sudo apt updatesudo apt install -y postgresql postgresql-contrib postgresql-clientsudo systemctl status postgresql.service

Initial database connection

A local connection (from the database server) can be done by the following command:

sudo -u postgres psqlpsql (12.12 (Ubuntu 12.12-0ubuntu0.20.04.1))Type "help" for help.postgres=#

Set password for postgres database user

The password for the postgres database user can be set the the quick command \password +

Postgress Setup

Install PostgreSQL 12 on Ubuntu 20.04 LTS

sudo apt updatesudo apt install -y postgresql postgresql-contrib postgresql-clientsudo systemctl status postgresql.service

Initial database connection

A local connection (from the database server) can be done by the following command:

sudo -u postgres psqlpsql (12.12 (Ubuntu 12.12-0ubuntu0.20.04.1))Type "help" for help.postgres=#

Set password for postgres database user

The password for the postgres database user can be set the the quick command \password or by alter user postgres password 'Supersecret'. A connection using the postgres user is still not possible from the "outside" hence to the default settings in the pg_hba.conf.

Update pg_hba.conf to allow postgres user connections with password

In order to allow connections of the postgres database user not using OS user authentication, you have to update the pg_hba.conf which can be found under -/etc/postgresql/12/main/pg_hba.conf.

sudo vi /etc/postgresql/12/main/pg_hba.conf...local   all             postgres                                peer...

Change the last section of the above line to md5.

local   all             postgres                                md5

A restart is required in order to apply the new configuration:

sudo systemctl restart postgresql

Now a connection from outside the database host is possible e.g.

psql -U postgres -d postgres -h databasehostname

Creation of additional database users

A database user can be created by the following command:

create user myuser with encrypted password 'Supersecret';
+/etc/postgresql/12/main/pg_hba.conf.

sudo vi /etc/postgresql/12/main/pg_hba.conf...local   all             postgres                                peer...

Change the last section of the above line to md5.

local   all             postgres                                md5

A restart is required in order to apply the new configuration:

sudo systemctl restart postgresql

Now a connection from outside the database host is possible e.g.

psql -U postgres -d postgres -h databasehostname

Creation of additional database users

A database user can be created by the following command:

create user myuser with encrypted password 'Supersecret';
 CREATE ROLE
 
 postgres=# \du
@@ -29,5 +29,5 @@ postgres=# \l
  template1 | postgres | UTF8     | en_US.UTF-8 | en_US.UTF-8 | =c/postgres          +
            |          |          |             |             | postgres=CTc/postgres

You can leave the OWNER section of the command, when doing so, the current user will become owner of the newly created database.

To change the owner of an existing database later, you can use the following command:

postgres=# alter database dbname owner to myuser;
-ALTER DATABASE
btw, have a nice day
(2018 - 2024) muerwre
+ALTER DATABASE
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/typescript/add-global-variable-to-window/_payload.js b/docs/typescript/add-global-variable-to-window/_payload.js index 94d1bcf..5c7a51b 100644 --- a/docs/typescript/add-global-variable-to-window/_payload.js +++ b/docs/typescript/add-global-variable-to-window/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC,aD,aE,aF,aG,aH,aI,aJ){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:N,_path:O},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-Of3zHqmk1n":{_path:O,_dir:k,_draft:z,_partial:z,_locale:"en",_empty:z,title:N,description:"Sometimes you want to add global variable to your window. That thing's called global module augmentation.",excerpt:{type:P,children:[{type:a,tag:i,props:{},children:[{type:b,value:Q},{type:a,tag:f,props:{},children:[{type:b,value:s}]},{type:b,value:R},{type:a,tag:n,props:{href:S,rel:[t]},children:[{type:b,value:T}]},{type:b,value:A}]},{type:a,tag:i,props:{},children:[{type:b,value:U},{type:a,tag:f,props:{},children:[{type:b,value:V}]},{type:b,value:W},{type:a,tag:f,props:{},children:[{type:b,value:s}]},{type:b,value:X},{type:a,tag:f,props:{},children:[{type:b,value:Y}]},{type:b,value:Z}]},{type:a,tag:g,props:{code:B,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:b,value:B}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:_},{type:a,tag:f,props:{},children:[{type:b,value:$}]},{type:b,value:aa},{type:a,tag:f,props:{},children:[{type:b,value:ab}]},{type:b,value:ac},{type:a,tag:n,props:{href:ad},children:[{type:b,value:ae}]},{type:b,value:af}]},{type:a,tag:ag,props:{id:C},children:[{type:b,value:D}]},{type:a,tag:i,props:{},children:[{type:b,value:ah},{type:a,tag:f,props:{},children:[{type:b,value:p}]},{type:b,value:ai}]},{type:a,tag:g,props:{code:E,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:b,value:E}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:aj},{type:a,tag:f,props:{},children:[{type:b,value:ak}]},{type:b,value:al},{type:a,tag:n,props:{href:am,rel:[t]},children:[{type:b,value:an}]},{type:b,value:u}]},{type:a,tag:g,props:{code:F,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:b,value:F}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:ao},{type:a,tag:f,props:{},children:[{type:b,value:ap}]},{type:b,value:aq},{type:a,tag:f,props:{},children:[{type:b,value:ar}]},{type:b,value:as}]},{type:a,tag:g,props:{code:G,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:b,value:G}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:at},{type:a,tag:n,props:{href:au},children:[{type:b,value:av}]},{type:b,value:aw}]}]},body:{type:P,children:[{type:a,tag:i,props:{},children:[{type:b,value:Q},{type:a,tag:f,props:{},children:[{type:b,value:s}]},{type:b,value:R},{type:a,tag:n,props:{href:S,rel:[t]},children:[{type:b,value:T}]},{type:b,value:A}]},{type:a,tag:i,props:{},children:[{type:b,value:U},{type:a,tag:f,props:{},children:[{type:b,value:V}]},{type:b,value:W},{type:a,tag:f,props:{},children:[{type:b,value:s}]},{type:b,value:X},{type:a,tag:f,props:{},children:[{type:b,value:Y}]},{type:b,value:Z}]},{type:a,tag:g,props:{code:B,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:m},children:[{type:b,value:ax}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:v},children:[{type:b,value:"global"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:H}]},{type:a,tag:c,props:{class:m},children:[{type:b,value:ay}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:I},children:[{type:b,value:"Window"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:az}]},{type:a,tag:c,props:{class:w},children:[{type:b,value:J}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:u}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:aA}]},{type:a,tag:c,props:{class:m},children:[{type:b,value:aB}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:aC},children:[{type:b,value:aD}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:aE}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:K}]}]}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:_},{type:a,tag:f,props:{},children:[{type:b,value:$}]},{type:b,value:aa},{type:a,tag:f,props:{},children:[{type:b,value:ab}]},{type:b,value:ac},{type:a,tag:n,props:{href:ad},children:[{type:b,value:ae}]},{type:b,value:af}]},{type:a,tag:ag,props:{id:C},children:[{type:b,value:D}]},{type:a,tag:i,props:{},children:[{type:b,value:ah},{type:a,tag:f,props:{},children:[{type:b,value:p}]},{type:b,value:ai}]},{type:a,tag:g,props:{code:E,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:x},children:[{type:b,value:"\u002F\u002F Sample.ts"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:"export"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:m},children:[{type:b,value:"class"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:I},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:H}]},{type:a,tag:c,props:{class:x},children:[{type:b,value:"\u002F\u002F nothing :-)"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:K}]}]}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:aj},{type:a,tag:f,props:{},children:[{type:b,value:ak}]},{type:b,value:al},{type:a,tag:n,props:{href:am,rel:[t]},children:[{type:b,value:an}]},{type:b,value:u}]},{type:a,tag:g,props:{code:F,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:x},children:[{type:b,value:"\u002F\u002F fancyThings.ts"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:aF}]},{type:a,tag:c,props:{class:v},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:aG}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:aH}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:y},children:[{type:b,value:aI}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:m},children:[{type:b,value:ax}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:m},children:[{type:b,value:"module"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:y},children:[{type:b,value:aI}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:H}]},{type:a,tag:c,props:{class:m},children:[{type:b,value:ay}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:I},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:az}]},{type:a,tag:c,props:{class:w},children:[{type:b,value:J}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:u}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:aA}]},{type:a,tag:c,props:{class:m},children:[{type:b,value:aB}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:aC},children:[{type:b,value:aD}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:aE}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:K}]}]}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:ao},{type:a,tag:f,props:{},children:[{type:b,value:ap}]},{type:b,value:aq},{type:a,tag:f,props:{},children:[{type:b,value:ar}]},{type:b,value:as}]},{type:a,tag:g,props:{code:G,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:aF}]},{type:a,tag:c,props:{class:v},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:aG}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:aH}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:y},children:[{type:b,value:"\".\u002Fsample\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:y},children:[{type:b,value:"\".\u002FfancyThings\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:m},children:[{type:b,value:"const"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:"ct-7aa6b6"},children:[{type:b,value:aJ}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"="}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"new"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:w},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"();"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:v},children:[{type:b,value:aJ}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:A}]},{type:a,tag:c,props:{class:w},children:[{type:b,value:J}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"(); "}]},{type:a,tag:c,props:{class:x},children:[{type:b,value:"\u002F\u002F ok"}]}]}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:at},{type:a,tag:n,props:{href:au},children:[{type:b,value:av}]},{type:b,value:aw}]},{type:a,tag:"style",children:[{type:b,value:".ct-7aa6b6{color:#79C0FF}.ct-145926{color:#A5D6FF}.ct-144069{color:#8B949E}.ct-6b4cda{color:#79C0FF}.ct-861939{color:#FF7B72}.ct-c31fd1{color:#D2A8FF}.ct-909727{color:#FFA657}.ct-fc5904{color:#C9D1D9}.ct-e36519{color:#C9D1D9}.ct-42c3a1{color:#FF7B72}.light .ct-42c3a1{color:#073642}.light .ct-e36519{color:#657B83}.light .ct-fc5904{color:#268BD2}.light .ct-909727{color:#268BD2}.light .ct-c31fd1{color:#268BD2}.light .ct-861939{color:#859900}.light .ct-6b4cda{color:#859900}.light .ct-144069{color:#93A1A1}.light .ct-145926{color:#2AA198}.light .ct-7aa6b6{color:#268BD2}"}]}],toc:{title:l,searchDepth:M,depth:M,links:[{id:C,depth:M,text:D}]}},_type:"markdown",_id:"content:Typescript:Add global variable to window.md",_source:"content",_file:"Typescript\u002FAdd global variable to window.md",_extension:"md"}},prerenderedAt:1711020228054}}("element","text","span","ct-e36519","line","code-inline","code"," ","p","ct-861939","typescript","","ct-42c3a1","a","pre","Sample"," {",";","window","nofollow",":","ct-fc5904","ct-c31fd1","ct-144069","ct-145926",false,".","declare global {\n interface Window {\n doFancyThings: () =\u003E void;\n }\n}\n","augmenting-existing-interface","Augmenting existing interface","\u002F\u002F Sample.ts\n\nexport class Sample {\n \u002F\u002F nothing :-)\n}\n","\u002F\u002F fancyThings.ts\nimport { Sample } from \".\u002FSample\";\n\ndeclare module \".\u002FSample\" {\n interface Sample {\n doFancyThings: () =\u003E void;\n }\n}\n","import { Sample } from \".\u002Fsample\";\nimport \".\u002FfancyThings\";\n\nconst sample = new Sample();\nsample.doFancyThings(); \u002F\u002F ok\n"," ","ct-909727","doFancyThings","}","import",2,"Add Global Variable To Window","\u002Ftypescript\u002Fadd-global-variable-to-window","root","Sometimes you want to add global variable to your ",". That thing's called ","https:\u002F\u002Fwww.typescriptlang.org\u002Fdocs\u002Fhandbook\u002Fdeclaration-merging.html#global-augmentation","global module augmentation","Say you need to call ","window.doFancyThings()",". For that you should augment global "," interface in ","*.d.ts"," file:","This is useful for declaring global ","window.ethereum"," (or ","window.web3",") in ","\u002Fblockchain\u002FCommon%20typescript%20examples","blockchain"," projects with typescript, which use wallet browser extensions.","h2","For example, you have class "," without any functionality:","Then you want extend it with ","doFancyThings()"," method. That can be achieved with said ","https:\u002F\u002Fwww.typescriptlang.org\u002Fdocs\u002Fhandbook\u002Fdeclaration-merging.html#module-augmentation","module augmentation","Now you can call ","sample.doFancyThings()"," by importing both ",".ts"," files:","This example is useful for ",".\u002FFrontend\u002FVue\u002FAdding%20global%20properties%20to%20component","adding global properties to component"," in vue.js.","declare","interface"," "," () ","=\u003E","ct-6b4cda","void"," }"," { "," } ","from","\".\u002FSample\"","sample")) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av,aw,ax,ay,az,aA,aB,aC,aD,aE,aF,aG,aH,aI,aJ){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:N,_path:O},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-Of3zHqmk1n":{_path:O,_dir:k,_draft:z,_partial:z,_locale:"en",_empty:z,title:N,description:"Sometimes you want to add global variable to your window. That thing's called global module augmentation.",excerpt:{type:P,children:[{type:a,tag:i,props:{},children:[{type:b,value:Q},{type:a,tag:f,props:{},children:[{type:b,value:s}]},{type:b,value:R},{type:a,tag:n,props:{href:S,rel:[t]},children:[{type:b,value:T}]},{type:b,value:A}]},{type:a,tag:i,props:{},children:[{type:b,value:U},{type:a,tag:f,props:{},children:[{type:b,value:V}]},{type:b,value:W},{type:a,tag:f,props:{},children:[{type:b,value:s}]},{type:b,value:X},{type:a,tag:f,props:{},children:[{type:b,value:Y}]},{type:b,value:Z}]},{type:a,tag:g,props:{code:B,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:b,value:B}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:_},{type:a,tag:f,props:{},children:[{type:b,value:$}]},{type:b,value:aa},{type:a,tag:f,props:{},children:[{type:b,value:ab}]},{type:b,value:ac},{type:a,tag:n,props:{href:ad},children:[{type:b,value:ae}]},{type:b,value:af}]},{type:a,tag:ag,props:{id:C},children:[{type:b,value:D}]},{type:a,tag:i,props:{},children:[{type:b,value:ah},{type:a,tag:f,props:{},children:[{type:b,value:p}]},{type:b,value:ai}]},{type:a,tag:g,props:{code:E,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:b,value:E}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:aj},{type:a,tag:f,props:{},children:[{type:b,value:ak}]},{type:b,value:al},{type:a,tag:n,props:{href:am,rel:[t]},children:[{type:b,value:an}]},{type:b,value:u}]},{type:a,tag:g,props:{code:F,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:b,value:F}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:ao},{type:a,tag:f,props:{},children:[{type:b,value:ap}]},{type:b,value:aq},{type:a,tag:f,props:{},children:[{type:b,value:ar}]},{type:b,value:as}]},{type:a,tag:g,props:{code:G,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:b,value:G}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:at},{type:a,tag:n,props:{href:au},children:[{type:b,value:av}]},{type:b,value:aw}]}]},body:{type:P,children:[{type:a,tag:i,props:{},children:[{type:b,value:Q},{type:a,tag:f,props:{},children:[{type:b,value:s}]},{type:b,value:R},{type:a,tag:n,props:{href:S,rel:[t]},children:[{type:b,value:T}]},{type:b,value:A}]},{type:a,tag:i,props:{},children:[{type:b,value:U},{type:a,tag:f,props:{},children:[{type:b,value:V}]},{type:b,value:W},{type:a,tag:f,props:{},children:[{type:b,value:s}]},{type:b,value:X},{type:a,tag:f,props:{},children:[{type:b,value:Y}]},{type:b,value:Z}]},{type:a,tag:g,props:{code:B,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:m},children:[{type:b,value:ax}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:v},children:[{type:b,value:"global"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:H}]},{type:a,tag:c,props:{class:m},children:[{type:b,value:ay}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:I},children:[{type:b,value:"Window"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:az}]},{type:a,tag:c,props:{class:w},children:[{type:b,value:J}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:u}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:aA}]},{type:a,tag:c,props:{class:m},children:[{type:b,value:aB}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:aC},children:[{type:b,value:aD}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:aE}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:K}]}]}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:_},{type:a,tag:f,props:{},children:[{type:b,value:$}]},{type:b,value:aa},{type:a,tag:f,props:{},children:[{type:b,value:ab}]},{type:b,value:ac},{type:a,tag:n,props:{href:ad},children:[{type:b,value:ae}]},{type:b,value:af}]},{type:a,tag:ag,props:{id:C},children:[{type:b,value:D}]},{type:a,tag:i,props:{},children:[{type:b,value:ah},{type:a,tag:f,props:{},children:[{type:b,value:p}]},{type:b,value:ai}]},{type:a,tag:g,props:{code:E,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:x},children:[{type:b,value:"\u002F\u002F Sample.ts"}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:"export"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:m},children:[{type:b,value:"class"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:I},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:H}]},{type:a,tag:c,props:{class:x},children:[{type:b,value:"\u002F\u002F nothing :-)"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:K}]}]}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:aj},{type:a,tag:f,props:{},children:[{type:b,value:ak}]},{type:b,value:al},{type:a,tag:n,props:{href:am,rel:[t]},children:[{type:b,value:an}]},{type:b,value:u}]},{type:a,tag:g,props:{code:F,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:x},children:[{type:b,value:"\u002F\u002F fancyThings.ts"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:aF}]},{type:a,tag:c,props:{class:v},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:aG}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:aH}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:y},children:[{type:b,value:aI}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:m},children:[{type:b,value:ax}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:m},children:[{type:b,value:"module"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:y},children:[{type:b,value:aI}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:H}]},{type:a,tag:c,props:{class:m},children:[{type:b,value:ay}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:I},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:q}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:az}]},{type:a,tag:c,props:{class:w},children:[{type:b,value:J}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:u}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:aA}]},{type:a,tag:c,props:{class:m},children:[{type:b,value:aB}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:aC},children:[{type:b,value:aD}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:aE}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:d},children:[{type:b,value:K}]}]}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:ao},{type:a,tag:f,props:{},children:[{type:b,value:ap}]},{type:b,value:aq},{type:a,tag:f,props:{},children:[{type:b,value:ar}]},{type:b,value:as}]},{type:a,tag:g,props:{code:G,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:g,props:{__ignoreMap:l},children:[{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:aF}]},{type:a,tag:c,props:{class:v},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:aG}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:aH}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:y},children:[{type:b,value:"\".\u002Fsample\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:j},children:[{type:b,value:L}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:y},children:[{type:b,value:"\".\u002FfancyThings\""}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:r}]}]},{type:a,tag:c,props:{class:e},children:[]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:m},children:[{type:b,value:"const"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:"ct-2c62ce"},children:[{type:b,value:aJ}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"="}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:j},children:[{type:b,value:"new"}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:h}]},{type:a,tag:c,props:{class:w},children:[{type:b,value:p}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"();"}]}]},{type:a,tag:c,props:{class:e},children:[{type:a,tag:c,props:{class:v},children:[{type:b,value:aJ}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:A}]},{type:a,tag:c,props:{class:w},children:[{type:b,value:J}]},{type:a,tag:c,props:{class:d},children:[{type:b,value:"(); "}]},{type:a,tag:c,props:{class:x},children:[{type:b,value:"\u002F\u002F ok"}]}]}]}]}]},{type:a,tag:i,props:{},children:[{type:b,value:at},{type:a,tag:n,props:{href:au},children:[{type:b,value:av}]},{type:b,value:aw}]},{type:a,tag:"style",children:[{type:b,value:".ct-2c62ce{color:#79C0FF}.ct-174796{color:#A5D6FF}.ct-24091c{color:#8B949E}.ct-56b99e{color:#79C0FF}.ct-06c8c8{color:#FF7B72}.ct-1694ff{color:#D2A8FF}.ct-480aec{color:#FFA657}.ct-967933{color:#C9D1D9}.ct-b07aa9{color:#C9D1D9}.ct-ddb5db{color:#FF7B72}.light .ct-ddb5db{color:#073642}.light .ct-b07aa9{color:#657B83}.light .ct-967933{color:#268BD2}.light .ct-480aec{color:#268BD2}.light .ct-1694ff{color:#268BD2}.light .ct-06c8c8{color:#859900}.light .ct-56b99e{color:#859900}.light .ct-24091c{color:#93A1A1}.light .ct-174796{color:#2AA198}.light .ct-2c62ce{color:#268BD2}"}]}],toc:{title:l,searchDepth:M,depth:M,links:[{id:C,depth:M,text:D}]}},_type:"markdown",_id:"content:Typescript:Add global variable to window.md",_source:"content",_file:"Typescript\u002FAdd global variable to window.md",_extension:"md"}},prerenderedAt:1711020862604}}("element","text","span","ct-b07aa9","line","code-inline","code"," ","p","ct-06c8c8","typescript","","ct-ddb5db","a","pre","Sample"," {",";","window","nofollow",":","ct-967933","ct-1694ff","ct-24091c","ct-174796",false,".","declare global {\n interface Window {\n doFancyThings: () =\u003E void;\n }\n}\n","augmenting-existing-interface","Augmenting existing interface","\u002F\u002F Sample.ts\n\nexport class Sample {\n \u002F\u002F nothing :-)\n}\n","\u002F\u002F fancyThings.ts\nimport { Sample } from \".\u002FSample\";\n\ndeclare module \".\u002FSample\" {\n interface Sample {\n doFancyThings: () =\u003E void;\n }\n}\n","import { Sample } from \".\u002Fsample\";\nimport \".\u002FfancyThings\";\n\nconst sample = new Sample();\nsample.doFancyThings(); \u002F\u002F ok\n"," ","ct-480aec","doFancyThings","}","import",2,"Add Global Variable To Window","\u002Ftypescript\u002Fadd-global-variable-to-window","root","Sometimes you want to add global variable to your ",". That thing's called ","https:\u002F\u002Fwww.typescriptlang.org\u002Fdocs\u002Fhandbook\u002Fdeclaration-merging.html#global-augmentation","global module augmentation","Say you need to call ","window.doFancyThings()",". For that you should augment global "," interface in ","*.d.ts"," file:","This is useful for declaring global ","window.ethereum"," (or ","window.web3",") in ","\u002Fblockchain\u002FCommon%20typescript%20examples","blockchain"," projects with typescript, which use wallet browser extensions.","h2","For example, you have class "," without any functionality:","Then you want extend it with ","doFancyThings()"," method. That can be achieved with said ","https:\u002F\u002Fwww.typescriptlang.org\u002Fdocs\u002Fhandbook\u002Fdeclaration-merging.html#module-augmentation","module augmentation","Now you can call ","sample.doFancyThings()"," by importing both ",".ts"," files:","This example is useful for ",".\u002FFrontend\u002FVue\u002FAdding%20global%20properties%20to%20component","adding global properties to component"," in vue.js.","declare","interface"," "," () ","=\u003E","ct-56b99e","void"," }"," { "," } ","from","\".\u002FSample\"","sample")) \ No newline at end of file diff --git a/docs/typescript/add-global-variable-to-window/index.html b/docs/typescript/add-global-variable-to-window/index.html index 7863e7b..703620e 100644 --- a/docs/typescript/add-global-variable-to-window/index.html +++ b/docs/typescript/add-global-variable-to-window/index.html @@ -1,6 +1,6 @@ -Add Global Variable To Window • Obsidian Garden -

Add Global Variable To Window

Sometimes you want to add global variable to your window. That thing's called global module augmentation.

Say you need to call window.doFancyThings(). For that you should augment global window interface in *.d.ts file:

declare global {  interface Window {    doFancyThings: () => void;  }}

This is useful for declaring global window.ethereum (or window.web3) in blockchain projects with typescript, which use wallet browser extensions.

Augmenting existing interface

For example, you have class Sample without any functionality:

// Sample.tsexport class Sample {  // nothing :-)}

Then you want extend it with doFancyThings() method. That can be achieved with said module augmentation:

// fancyThings.tsimport { Sample } from "./Sample";declare module "./Sample" {  interface Sample {    doFancyThings: () => void;  }}

Now you can call sample.doFancyThings() by importing both .ts files:

import { Sample } from "./sample";import "./fancyThings";const sample = new Sample();sample.doFancyThings(); // ok

This example is useful for adding global properties to component in vue.js.

btw, have a nice day
(2018 - 2024) muerwre
+

Add Global Variable To Window

Sometimes you want to add global variable to your window. That thing's called global module augmentation.

Say you need to call window.doFancyThings(). For that you should augment global window interface in *.d.ts file:

declare global {  interface Window {    doFancyThings: () => void;  }}

This is useful for declaring global window.ethereum (or window.web3) in blockchain projects with typescript, which use wallet browser extensions.

Augmenting existing interface

For example, you have class Sample without any functionality:

// Sample.tsexport class Sample {  // nothing :-)}

Then you want extend it with doFancyThings() method. That can be achieved with said module augmentation:

// fancyThings.tsimport { Sample } from "./Sample";declare module "./Sample" {  interface Sample {    doFancyThings: () => void;  }}

Now you can call sample.doFancyThings() by importing both .ts files:

import { Sample } from "./sample";import "./fancyThings";const sample = new Sample();sample.doFancyThings(); // ok

This example is useful for adding global properties to component in vue.js.

btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/typescript/flatten-object-with-periods/_payload.js b/docs/typescript/flatten-object-with-periods/_payload.js index 5aaa2c0..361a1a1 100644 --- a/docs/typescript/flatten-object-with-periods/_payload.js +++ b/docs/typescript/flatten-object-with-periods/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:X,_path:Y},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-3yyO3sZiNO":{_path:Y,_dir:z,_draft:I,_partial:I,_locale:J,_empty:I,title:X,description:K,excerpt:{type:Z,children:[{type:a,tag:u,props:{},children:[{type:c,value:K}]},{type:a,tag:u,props:{},children:[{type:c,value:_},{type:a,tag:$,props:{href:aa,rel:[ab]},children:[{type:c,value:ac}]},{type:c,value:ad}]},{type:a,tag:m,props:{code:L,language:z},children:[{type:a,tag:E,props:{},children:[{type:a,tag:m,props:{__ignoreMap:A},children:[{type:c,value:L}]}]}]},{type:a,tag:u,props:{},children:[{type:c,value:ae}]},{type:a,tag:m,props:{code:M,language:z},children:[{type:a,tag:E,props:{},children:[{type:a,tag:m,props:{__ignoreMap:A},children:[{type:c,value:M}]}]}]}]},body:{type:Z,children:[{type:a,tag:u,props:{},children:[{type:c,value:K}]},{type:a,tag:u,props:{},children:[{type:c,value:_},{type:a,tag:$,props:{href:aa,rel:[ab]},children:[{type:c,value:ac}]},{type:c,value:ad}]},{type:a,tag:m,props:{code:L,language:z},children:[{type:a,tag:E,props:{},children:[{type:a,tag:m,props:{__ignoreMap:A},children:[{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:"import"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:B},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"from"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'.\u002Fen.json'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"typeof"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:B},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ag}]}]},{type:a,tag:b,props:{class:h},children:[]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:ah},children:[{type:c,value:"const"}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:"ct-8d3565"},children:[{type:c,value:ai}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:P},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:" ("}]},{type:a,tag:b,props:{class:aj},children:[{type:c,value:ak}]},{type:a,tag:b,props:{class:P},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:al},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:aj},children:[{type:c,value:am}]},{type:a,tag:b,props:{class:P},children:[{type:c,value:"?:"}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:al},children:[{type:c,value:"TranslateOptions"}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:") "}]},{type:a,tag:b,props:{class:ah},children:[{type:c,value:"=\u003E"}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:B},children:[{type:c,value:"I18nLib"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"."}]},{type:a,tag:b,props:{class:"ct-b292a0"},children:[{type:c,value:ai}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"("}]},{type:a,tag:b,props:{class:B},children:[{type:c,value:ak}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:B},children:[{type:c,value:am}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:");"}]}]}]}]}]},{type:a,tag:u,props:{},children:[{type:c,value:ae}]},{type:a,tag:m,props:{code:M,language:z},children:[{type:a,tag:E,props:{},children:[{type:a,tag:m,props:{__ignoreMap:A},children:[{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:F},children:[{type:c,value:"\u002F\u002F This one based on answer from StackOverflow:"}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:F},children:[{type:c,value:"\u002F\u002F https:\u002F\u002Fstackoverflow.com\u002Fquestions\u002F58434389\u002Ftypescript-deep-keyof-of-a-nested-object"}]}]},{type:a,tag:b,props:{class:h},children:[]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:"export"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:an}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ao}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"] "}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:D}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:"\u002F\u002F plural object"}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:V}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"object"}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" { ["}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"in"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"-?:"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"], "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"]\u003E\u003E }["}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]}]},{type:a,tag:b,props:{class:h},children:[]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:F},children:[{type:c,value:"\u002F\u002F Fix it for you plural form"}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"Record"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'one'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'few'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'many'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ag}]}]},{type:a,tag:b,props:{class:h},children:[]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ao}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:S}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:S}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"`${"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"}${''"}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'.'}${"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"}`"}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:D}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]}]},{type:a,tag:b,props:{class:h},children:[]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:au}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"1"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"2"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"3"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"4"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:an}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"..."}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"Array"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:au}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"\u003E];"}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-19a7d8{color:#A5D6FF}.ct-028e32{color:#79C0FF}.ct-6d81df{color:#79C0FF}.ct-76590f{color:#8B949E}.ct-b292a0{color:#D2A8FF}.ct-6436bb{color:#FFA657}.ct-c09440{color:#FFA657}.ct-1cdaff{color:#FF7B72}.ct-8d3565{color:#D2A8FF}.ct-5ae709{color:#C9D1D9}.ct-3ba106{color:#FF7B72}.ct-635bfc{color:#FFA657}.ct-0fd30f{color:#FF7B72}.ct-59d1cb{color:#A5D6FF}.ct-c2e7a7{color:#C9D1D9}.ct-347f56{color:#C9D1D9}.ct-64ac72{color:#FF7B72}.light .ct-64ac72{color:#859900}.light .ct-347f56{color:#657B83}.light .ct-c2e7a7{color:#268BD2}.light .ct-59d1cb{color:#2AA198}.light .ct-0fd30f{color:#073642}.light .ct-635bfc{color:#268BD2}.light .ct-3ba106{color:#073642}.light .ct-5ae709{color:#657B83}.light .ct-8d3565{color:#268BD2}.light .ct-1cdaff{color:#859900}.light .ct-c09440{color:#657B83}.light .ct-6436bb{color:#268BD2}.light .ct-b292a0{color:#268BD2}.light .ct-76590f{color:#93A1A1}.light .ct-6d81df{color:#859900}.light .ct-028e32{color:#D33682}.light .ct-19a7d8{color:#657B83}"}]}],toc:{title:A,searchDepth:av,depth:av,links:[]}},_type:"markdown",_id:"content:Typescript:Flatten object with periods.md",_source:"content",_file:"Typescript\u002FFlatten object with periods.md",_extension:"md"}},prerenderedAt:1711020228087}}("element","span","text","ct-347f56"," ","ct-64ac72","ct-635bfc","line",", ","ct-0fd30f","ct-6d81df","ct-59d1cb","code","ct-028e32"," ","=","\u003C","ct-5ae709",":","extends","p","T","?","K","ct-19a7d8","typescript","","ct-c2e7a7","type","never","pre","ct-76590f","|","P",false,"en","This helper generates Typescript types for i18n dictionary json\nfiles by flattening it with period delimiter. Supports plural forms.","import en from '.\u002Fen.json';\ntype TranslationPath = Flatten\u003Ctypeof en\u003E;\n\nconst t = (key: TranslationPath, options?: TranslateOptions) =\u003E\n I18nLib.t(key, options);\n","\u002F\u002F This one based on answer from StackOverflow:\n\u002F\u002F https:\u002F\u002Fstackoverflow.com\u002Fquestions\u002F58434389\u002Ftypescript-deep-keyof-of-a-nested-object\n\nexport type Flatten\u003CT, D extends number = 5\u003E = [D] extends [never]\n ? never\n : T extends PluralForm \u002F\u002F plural object\n ? ''\n : T extends object\n ? { [K in keyof T]-?: Join\u003CK, Flatten\u003CT[K], Prev[D]\u003E\u003E }[keyof T]\n : '';\n\n\u002F\u002F Fix it for you plural form\ntype PluralForm = Record\u003C'one' | 'few' | 'many', string\u003E;\n\ntype Join\u003CK, P\u003E = K extends string | number\n ? P extends string | number\n ? `${K}${'' extends P ? '' : '.'}${P}`\n : never\n : never;\n\ntype Prev = [never, 0, 1, 2, 3, 4, 5, ...Array\u003C0\u003E];\n",";","Flatten","ct-1cdaff"," ","D","number"," [","]","''","string","Flatten Object With Periods","\u002Ftypescript\u002Fflatten-object-with-periods","root","Used for typing ","a","https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002Fi18n-js","nofollow","i18n.js"," dictionaries;","Flatten type defined here:","TranslationPath","\u003E;","ct-3ba106","t","ct-c09440","key","ct-6436bb","options","5","\u003E ","PluralForm","keyof","Join","[","Prev","0",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa,ab,ac,ad,ae,af,ag,ah,ai,aj,ak,al,am,an,ao,ap,aq,ar,as,at,au,av){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:X,_path:Y},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-3yyO3sZiNO":{_path:Y,_dir:z,_draft:I,_partial:I,_locale:J,_empty:I,title:X,description:K,excerpt:{type:Z,children:[{type:a,tag:u,props:{},children:[{type:c,value:K}]},{type:a,tag:u,props:{},children:[{type:c,value:_},{type:a,tag:$,props:{href:aa,rel:[ab]},children:[{type:c,value:ac}]},{type:c,value:ad}]},{type:a,tag:m,props:{code:L,language:z},children:[{type:a,tag:E,props:{},children:[{type:a,tag:m,props:{__ignoreMap:A},children:[{type:c,value:L}]}]}]},{type:a,tag:u,props:{},children:[{type:c,value:ae}]},{type:a,tag:m,props:{code:M,language:z},children:[{type:a,tag:E,props:{},children:[{type:a,tag:m,props:{__ignoreMap:A},children:[{type:c,value:M}]}]}]}]},body:{type:Z,children:[{type:a,tag:u,props:{},children:[{type:c,value:K}]},{type:a,tag:u,props:{},children:[{type:c,value:_},{type:a,tag:$,props:{href:aa,rel:[ab]},children:[{type:c,value:ac}]},{type:c,value:ad}]},{type:a,tag:m,props:{code:L,language:z},children:[{type:a,tag:E,props:{},children:[{type:a,tag:m,props:{__ignoreMap:A},children:[{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:"import"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:B},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"from"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'.\u002Fen.json'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"typeof"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:B},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ag}]}]},{type:a,tag:b,props:{class:h},children:[]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:ah},children:[{type:c,value:"const"}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:"ct-30dc91"},children:[{type:c,value:ai}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:P},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:" ("}]},{type:a,tag:b,props:{class:aj},children:[{type:c,value:ak}]},{type:a,tag:b,props:{class:P},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:al},children:[{type:c,value:af}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:aj},children:[{type:c,value:am}]},{type:a,tag:b,props:{class:P},children:[{type:c,value:"?:"}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:al},children:[{type:c,value:"TranslateOptions"}]},{type:a,tag:b,props:{class:r},children:[{type:c,value:") "}]},{type:a,tag:b,props:{class:ah},children:[{type:c,value:"=\u003E"}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:B},children:[{type:c,value:"I18nLib"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"."}]},{type:a,tag:b,props:{class:"ct-394af7"},children:[{type:c,value:ai}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"("}]},{type:a,tag:b,props:{class:B},children:[{type:c,value:ak}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:B},children:[{type:c,value:am}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:");"}]}]}]}]}]},{type:a,tag:u,props:{},children:[{type:c,value:ae}]},{type:a,tag:m,props:{code:M,language:z},children:[{type:a,tag:E,props:{},children:[{type:a,tag:m,props:{__ignoreMap:A},children:[{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:F},children:[{type:c,value:"\u002F\u002F This one based on answer from StackOverflow:"}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:F},children:[{type:c,value:"\u002F\u002F https:\u002F\u002Fstackoverflow.com\u002Fquestions\u002F58434389\u002Ftypescript-deep-keyof-of-a-nested-object"}]}]},{type:a,tag:b,props:{class:h},children:[]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:f},children:[{type:c,value:"export"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:S}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:an}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ao}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"] "}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:D}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:"\u002F\u002F plural object"}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:V}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:"object"}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:" { ["}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"in"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"-?:"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:O}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"], "}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:as}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:R}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"]\u003E\u003E }["}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:aq}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:v}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:U}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]}]},{type:a,tag:b,props:{class:h},children:[]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:F},children:[{type:c,value:"\u002F\u002F Fix it for you plural form"}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ap}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"Record"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'one'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'few'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'many'"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ag}]}]},{type:a,tag:b,props:{class:h},children:[]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:ar}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:ao}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:S}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:W}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:S}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"`${"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"}${''"}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:t}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:V}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:y},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"'.'}${"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]},{type:a,tag:b,props:{class:l},children:[{type:c,value:"}`"}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:Q}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:D}]}]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:o}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:s}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:N}]}]},{type:a,tag:b,props:{class:h},children:[]},{type:a,tag:b,props:{class:h},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:C}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:at}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:p}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:T}]},{type:a,tag:b,props:{class:k},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:au}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"1"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"2"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"3"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:"4"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:an}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:f},children:[{type:c,value:"..."}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:"Array"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:q}]},{type:a,tag:b,props:{class:n},children:[{type:c,value:au}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:"\u003E];"}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-c0bc31{color:#A5D6FF}.ct-059763{color:#79C0FF}.ct-5be865{color:#79C0FF}.ct-bc4f67{color:#8B949E}.ct-394af7{color:#D2A8FF}.ct-4d74f9{color:#FFA657}.ct-ca3455{color:#FFA657}.ct-4540c4{color:#FF7B72}.ct-30dc91{color:#D2A8FF}.ct-36fa95{color:#C9D1D9}.ct-e2c7eb{color:#FF7B72}.ct-098f84{color:#FFA657}.ct-1cf06c{color:#FF7B72}.ct-6d390b{color:#A5D6FF}.ct-441a98{color:#C9D1D9}.ct-bb5dba{color:#C9D1D9}.ct-cf7037{color:#FF7B72}.light .ct-cf7037{color:#859900}.light .ct-bb5dba{color:#657B83}.light .ct-441a98{color:#268BD2}.light .ct-6d390b{color:#2AA198}.light .ct-1cf06c{color:#073642}.light .ct-098f84{color:#268BD2}.light .ct-e2c7eb{color:#073642}.light .ct-36fa95{color:#657B83}.light .ct-30dc91{color:#268BD2}.light .ct-4540c4{color:#859900}.light .ct-ca3455{color:#657B83}.light .ct-4d74f9{color:#268BD2}.light .ct-394af7{color:#268BD2}.light .ct-bc4f67{color:#93A1A1}.light .ct-5be865{color:#859900}.light .ct-059763{color:#D33682}.light .ct-c0bc31{color:#657B83}"}]}],toc:{title:A,searchDepth:av,depth:av,links:[]}},_type:"markdown",_id:"content:Typescript:Flatten object with periods.md",_source:"content",_file:"Typescript\u002FFlatten object with periods.md",_extension:"md"}},prerenderedAt:1711020862642}}("element","span","text","ct-bb5dba"," ","ct-cf7037","ct-098f84","line",", ","ct-1cf06c","ct-5be865","ct-6d390b","code","ct-059763"," ","=","\u003C","ct-36fa95",":","extends","p","T","?","K","ct-c0bc31","typescript","","ct-441a98","type","never","pre","ct-bc4f67","|","P",false,"en","This helper generates Typescript types for i18n dictionary json\nfiles by flattening it with period delimiter. Supports plural forms.","import en from '.\u002Fen.json';\ntype TranslationPath = Flatten\u003Ctypeof en\u003E;\n\nconst t = (key: TranslationPath, options?: TranslateOptions) =\u003E\n I18nLib.t(key, options);\n","\u002F\u002F This one based on answer from StackOverflow:\n\u002F\u002F https:\u002F\u002Fstackoverflow.com\u002Fquestions\u002F58434389\u002Ftypescript-deep-keyof-of-a-nested-object\n\nexport type Flatten\u003CT, D extends number = 5\u003E = [D] extends [never]\n ? never\n : T extends PluralForm \u002F\u002F plural object\n ? ''\n : T extends object\n ? { [K in keyof T]-?: Join\u003CK, Flatten\u003CT[K], Prev[D]\u003E\u003E }[keyof T]\n : '';\n\n\u002F\u002F Fix it for you plural form\ntype PluralForm = Record\u003C'one' | 'few' | 'many', string\u003E;\n\ntype Join\u003CK, P\u003E = K extends string | number\n ? P extends string | number\n ? `${K}${'' extends P ? '' : '.'}${P}`\n : never\n : never;\n\ntype Prev = [never, 0, 1, 2, 3, 4, 5, ...Array\u003C0\u003E];\n",";","Flatten","ct-4540c4"," ","D","number"," [","]","''","string","Flatten Object With Periods","\u002Ftypescript\u002Fflatten-object-with-periods","root","Used for typing ","a","https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002Fi18n-js","nofollow","i18n.js"," dictionaries;","Flatten type defined here:","TranslationPath","\u003E;","ct-e2c7eb","t","ct-ca3455","key","ct-4d74f9","options","5","\u003E ","PluralForm","keyof","Join","[","Prev","0",2)) \ No newline at end of file diff --git a/docs/typescript/flatten-object-with-periods/index.html b/docs/typescript/flatten-object-with-periods/index.html index 5b830ee..815ae3c 100644 --- a/docs/typescript/flatten-object-with-periods/index.html +++ b/docs/typescript/flatten-object-with-periods/index.html @@ -1,8 +1,8 @@ Flatten Object With Periods • Obsidian Garden

Flatten Object With Periods

This helper generates Typescript types for i18n dictionary json -files by flattening it with period delimiter. Supports plural forms.

Used for typing i18n.js dictionaries;

import en from './en.json';type TranslationPath = Flatten<typeof en>;const t = (key: TranslationPath, options?: TranslateOptions) =>    I18nLib.t(key, options);

Flatten type defined here:

// This one based on answer from StackOverflow:// https://stackoverflow.com/questions/58434389/typescript-deep-keyof-of-a-nested-objectexport type Flatten<T, D extends number = 5> = [D] extends [never]  ? never  : T extends PluralForm // plural object  ? ''  : T extends object  ? { [K in keyof T]-?: Join<K, Flatten<T[K], Prev[D]>> }[keyof T]  : '';// Fix it for you plural formtype PluralForm = Record<'one' | 'few' | 'many', string>;type Join<K, P> = K extends string | number  ? P extends string | number    ? `${K}${'' extends P ? '' : '.'}${P}`    : never  : never;type Prev = [never, 0, 1, 2, 3, 4, 5, ...Array<0>];
btw, have a nice day
(2018 - 2024) muerwre
+files by flattening it with period delimiter. Supports plural forms.

Used for typing i18n.js dictionaries;

import en from './en.json';type TranslationPath = Flatten<typeof en>;const t = (key: TranslationPath, options?: TranslateOptions) =>    I18nLib.t(key, options);

Flatten type defined here:

// This one based on answer from StackOverflow:// https://stackoverflow.com/questions/58434389/typescript-deep-keyof-of-a-nested-objectexport type Flatten<T, D extends number = 5> = [D] extends [never]  ? never  : T extends PluralForm // plural object  ? ''  : T extends object  ? { [K in keyof T]-?: Join<K, Flatten<T[K], Prev[D]>> }[keyof T]  : '';// Fix it for you plural formtype PluralForm = Record<'one' | 'few' | 'many', string>;type Join<K, P> = K extends string | number  ? P extends string | number    ? `${K}${'' extends P ? '' : '.'}${P}`    : never  : never;type Prev = [never, 0, 1, 2, 3, 4, 5, ...Array<0>];
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file diff --git a/docs/typescript/frontend/vue/adding-global-properties-to-component/_payload.js b/docs/typescript/frontend/vue/adding-global-properties-to-component/_payload.js index a11d372..0eee2ca 100644 --- a/docs/typescript/frontend/vue/adding-global-properties-to-component/_payload.js +++ b/docs/typescript/frontend/vue/adding-global-properties-to-component/_payload.js @@ -1 +1 @@ -export default {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-6fvmNhB5QD":null},prerenderedAt:1711020228287} \ No newline at end of file +export default {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:"Type Guards",_path:"\u002Ftypescript\u002Ftype-guards"}]}],"content-query-6fvmNhB5QD":null},prerenderedAt:1711020863027} \ No newline at end of file diff --git a/docs/typescript/frontend/vue/adding-global-properties-to-component/index.html b/docs/typescript/frontend/vue/adding-global-properties-to-component/index.html index 31e7767..01c8f82 100644 --- a/docs/typescript/frontend/vue/adding-global-properties-to-component/index.html +++ b/docs/typescript/frontend/vue/adding-global-properties-to-component/index.html @@ -1,6 +1,6 @@ -Obsidian Garden - + \ No newline at end of file diff --git a/docs/typescript/type-guards/_payload.js b/docs/typescript/type-guards/_payload.js index a1c8346..0ab5515 100644 --- a/docs/typescript/type-guards/_payload.js +++ b/docs/typescript/type-guards/_payload.js @@ -1 +1 @@ -export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:z,_path:A}]}],"content-query-BxgTjDzHE9":{_path:A,_dir:k,_draft:r,_partial:r,_locale:"en",_empty:r,title:z,description:s,excerpt:{type:B,children:[{type:a,tag:n,props:{},children:[{type:c,value:s}]},{type:a,tag:h,props:{code:t,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:c,value:t}]}]}]},{type:a,tag:n,props:{},children:[{type:c,value:C}]},{type:a,tag:h,props:{code:u,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:c,value:u}]}]}]}]},body:{type:B,children:[{type:a,tag:n,props:{},children:[{type:c,value:s}]},{type:a,tag:h,props:{code:t,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:"ct-71cb22"},children:[{type:c,value:"function"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:"ct-f7117e"},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"|"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:"Bird"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:")"}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"is"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"return"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"as"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:"ct-c38f96"},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:")."}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"!=="}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:"ct-bdc00b"},children:[{type:c,value:"undefined"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:";"}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]}]}]}]}]},{type:a,tag:n,props:{},children:[{type:c,value:C}]},{type:a,tag:h,props:{code:u,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:"ct-94eca3"},children:[{type:c,value:"const"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:"ct-825d9d"},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"="}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:"getSmallPet"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:"if"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:")) {"}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"} "}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"else"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:"fly"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-168a18{color:#D2A8FF}.ct-825d9d{color:#79C0FF}.ct-94eca3{color:#FF7B72}.ct-bdc00b{color:#79C0FF}.ct-c38f96{color:#FFA657}.ct-c6422e{color:#C9D1D9}.ct-2ee476{color:#FF7B72}.ct-b77be2{color:#C9D1D9}.ct-ec387d{color:#FFA657}.ct-1b4c73{color:#FF7B72}.ct-193554{color:#FFA657}.ct-f7117e{color:#D2A8FF}.ct-d53be9{color:#C9D1D9}.ct-71cb22{color:#FF7B72}.light .ct-71cb22{color:#073642}.light .ct-d53be9{color:#657B83}.light .ct-f7117e{color:#268BD2}.light .ct-193554{color:#657B83}.light .ct-1b4c73{color:#859900}.light .ct-ec387d{color:#268BD2}.light .ct-b77be2{color:#657B83}.light .ct-2ee476{color:#859900}.light .ct-c6422e{color:#268BD2}.light .ct-c38f96{color:#268BD2}.light .ct-bdc00b{color:#B58900}.light .ct-94eca3{color:#073642}.light .ct-825d9d{color:#268BD2}.light .ct-168a18{color:#268BD2}"}]}],toc:{title:l,searchDepth:M,depth:M,links:[]}},_type:"markdown",_id:"content:Typescript:Type guards.md",_source:"content",_file:"Typescript\u002FType guards.md",_extension:"md"}},prerenderedAt:1711020228120}}("element","span","text","ct-b77be2"," ","line","ct-d53be9","code","pet","ct-2ee476","typescript","","ct-c6422e","p","pre","ct-1b4c73","ct-168a18",false,"Useful for type checking at compile and run time:","function isFish(pet: Fish | Bird): pet is Fish {\n return (pet as Fish).swim !== undefined;\n}\n","const pet = getSmallPet();\n \nif (isFish(pet)) {\n pet.swim();\n} else {\n pet.fly();\n}\n","ct-ec387d","Fish"," ","();","Type Guards","\u002Ftypescript\u002Ftype-guards","root","Usage:","isFish","(","ct-193554",":"," {"," (","swim","}",".",2)) \ No newline at end of file +export default (function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M){return {data:{navigation:[{title:"Blockchain",_path:"\u002Fblockchain",children:[{title:"Common Typescript Examples",_path:"\u002Fblockchain\u002Fcommon-typescript-examples"},{title:"Smart Contracts",_path:"\u002Fblockchain\u002Fsmart-contracts"}]},{title:"Css",_path:"\u002Fcss",children:[{title:"Automatic Grid Like Masonry With Pure CSS",_path:"\u002Fcss\u002Fautomatic-grid-like-masonry-with-pure-css"},{title:"Sass Nth Child Iterate Mixin",_path:"\u002Fcss\u002Fsass-nth-child-iterate-mixin"},{title:"Test If Browser Supports CSS Rules",_path:"\u002Fcss\u002Ftest-if-browser-supports-css-rules"}]},{title:"Docker",_path:"\u002Fdocker",children:[{title:"Building Static Pages With Docker",_path:"\u002Fdocker\u002Fbuilding-static-pages-with-docker"},{title:"Common Things With Docker Mailserver",_path:"\u002Fdocker\u002Fcommon-things-with-docker-mailserver"},{title:"Drone Ci",_path:"\u002Fdocker\u002Fdrone-ci"},{title:"Github Pages With Drone Ci",_path:"\u002Fdocker\u002Fgithub-pages-with-drone-ci"},{title:"Private Docker Registry",_path:"\u002Fdocker\u002Fprivate-docker-registry"},{title:"Refresh Containers On Pull",_path:"\u002Fdocker\u002Frefresh-containers-on-pull"},{title:"Seed Dump Inside Docker",_path:"\u002Fdocker\u002Fseed-dump-inside-docker"},{title:"Wait For Mysql",_path:"\u002Fdocker\u002Fwait-for-mysql"},{title:"Wait For Redis",_path:"\u002Fdocker\u002Fwait-for-redis"}]},{title:"Frontend",_path:"\u002Ffrontend",children:[{title:"React Native",_path:"\u002Ffrontend\u002Freact-native",children:[{title:"OAuth2 Login",_path:"\u002Ffrontend\u002Freact-native\u002Foauth2-login"},{title:"Preserve FlatList Scroll Position In React Native",_path:"\u002Ffrontend\u002Freact-native\u002Fpreserve-flatlist-scroll-position-in-react-native"},{title:"Useful Comands",_path:"\u002Ffrontend\u002Freact-native\u002Fuseful-comands"}]},{title:"React",_path:"\u002Ffrontend\u002Freact",children:[{title:"Axios Refresh Token On React",_path:"\u002Ffrontend\u002Freact\u002Faxios-refresh-token-on-react"},{title:"Axios With AbortController",_path:"\u002Ffrontend\u002Freact\u002Faxios-with-abortcontroller"},{title:"Detect Hook Deps Changes With UseWhatsChanged",_path:"\u002Ffrontend\u002Freact\u002Fdetect-hook-deps-changes-with-usewhatschanged"}]},{title:"Vue",_path:"\u002Ffrontend\u002Fvue",children:[{title:"Adding Global Properties To Component",_path:"\u002Ffrontend\u002Fvue\u002Fadding-global-properties-to-component"},{title:"Make Nuxt Handle Obsidian Highlights",_path:"\u002Ffrontend\u002Fvue\u002Fmake-nuxt-handle-obsidian-highlights"}]},{title:"Webgl",_path:"\u002Ffrontend\u002Fwebgl",children:[{title:"Basics Of WebGL (Drawing A Cube)",_path:"\u002Ffrontend\u002Fwebgl\u002Fbasics-of-webgl-(drawing-a-cube)"},{title:"Fragment Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Ffragment-shaders"},{title:"Rendering Without Blocking In A Worker",_path:"\u002Ffrontend\u002Fwebgl\u002Frendering-without-blocking-in-a-worker"},{title:"Vertex Shaders",_path:"\u002Ffrontend\u002Fwebgl\u002Fvertex-shaders"}]}]},{title:"Git",_path:"\u002Fgit",children:[{title:"Force Git To Use HTTPS",_path:"\u002Fgit\u002Fforce-git-to-use-https"},{title:"Git Aliases And Useful Commands",_path:"\u002Fgit\u002Fgit-aliases-and-useful-commands"}]},{title:"Golang",_path:"\u002Fgolang",children:[{title:"I18n In Golang",_path:"\u002Fgolang\u002Fi18n-in-golang"}]},{title:"Graphql",_path:"\u002Fgraphql",children:[{title:"Apollo Client Pagination",_path:"\u002Fgraphql\u002Fapollo-client-pagination"},{title:"Refresh Token In Apollo Client",_path:"\u002Fgraphql\u002Frefresh-token-in-apollo-client"}]},{title:"Linux",_path:"\u002Flinux",children:[{title:"Certbot Well Known Auto Renew",_path:"\u002Flinux\u002Fcertbot-well-known-auto-renew"},{title:"Find Out Who Uses Swap",_path:"\u002Flinux\u002Ffind-out-who-uses-swap"},{title:"Fixing Lagging USB Headphones",_path:"\u002Flinux\u002Ffixing-lagging-usb-headphones"},{title:"Gitea For Git Hosting",_path:"\u002Flinux\u002Fgitea-for-git-hosting"},{title:"Google Photos Alternative With Photoprism",_path:"\u002Flinux\u002Fgoogle-photos-alternative-with-photoprism"},{title:"Linux On Asus Zenbook UM3402 YA",_path:"\u002Flinux\u002Flinux-on-asus-zenbook-um3402-ya"},{title:"Resume Or Start Screen Session",_path:"\u002Flinux\u002Fresume-or-start-screen-session"},{title:"Rsync File With SSH",_path:"\u002Flinux\u002Frsync-file-with-ssh"},{title:"Setting Up NGINX",_path:"\u002Flinux\u002Fsetting-up-nginx"},{title:"SSH",_path:"\u002Flinux\u002Fssh"}]},{title:"Obsidian",_path:"\u002Fobsidian",children:[{title:"Self Hosted Obsidian Sync With CouchDB",_path:"\u002Fobsidian\u002Fself-hosted-obsidian-sync-with-couchdb"}]},{title:"Sql",_path:"\u002Fsql",children:[{title:"MySQL And MariaDB Setup",_path:"\u002Fsql\u002Fmysql-and-mariadb-setup"},{title:"Postgress Setup",_path:"\u002Fsql\u002Fpostgress-setup"}]},{title:"Typescript",_path:"\u002Ftypescript",children:[{title:"Add Global Variable To Window",_path:"\u002Ftypescript\u002Fadd-global-variable-to-window"},{title:"Flatten Object With Periods",_path:"\u002Ftypescript\u002Fflatten-object-with-periods"},{title:z,_path:A}]}],"content-query-BxgTjDzHE9":{_path:A,_dir:k,_draft:r,_partial:r,_locale:"en",_empty:r,title:z,description:s,excerpt:{type:B,children:[{type:a,tag:n,props:{},children:[{type:c,value:s}]},{type:a,tag:h,props:{code:t,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:c,value:t}]}]}]},{type:a,tag:n,props:{},children:[{type:c,value:C}]},{type:a,tag:h,props:{code:u,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:c,value:u}]}]}]}]},body:{type:B,children:[{type:a,tag:n,props:{},children:[{type:c,value:s}]},{type:a,tag:h,props:{code:t,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:"ct-5996ab"},children:[{type:c,value:"function"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:"ct-85d161"},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"|"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:"Bird"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:")"}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:G}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:F},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:p},children:[{type:c,value:"is"}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:v},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:g},children:[{type:c,value:H}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"return"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"as"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:"ct-a9a5e4"},children:[{type:c,value:w}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:")."}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"!=="}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:"ct-6f9810"},children:[{type:c,value:"undefined"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:";"}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]}]}]}]}]},{type:a,tag:n,props:{},children:[{type:c,value:C}]},{type:a,tag:h,props:{code:u,language:k},children:[{type:a,tag:o,props:{},children:[{type:a,tag:h,props:{__ignoreMap:l},children:[{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:"ct-3ecc1d"},children:[{type:c,value:"const"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:"ct-38cc9e"},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"="}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:"getSmallPet"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:e}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:j},children:[{type:c,value:"if"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:I}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:D}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:E}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:")) {"}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:J}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:"} "}]},{type:a,tag:b,props:{class:j},children:[{type:c,value:"else"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:H}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:x}]},{type:a,tag:b,props:{class:m},children:[{type:c,value:i}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:L}]},{type:a,tag:b,props:{class:q},children:[{type:c,value:"fly"}]},{type:a,tag:b,props:{class:d},children:[{type:c,value:y}]}]},{type:a,tag:b,props:{class:f},children:[{type:a,tag:b,props:{class:d},children:[{type:c,value:K}]}]}]}]}]},{type:a,tag:"style",children:[{type:c,value:".ct-c6baa9{color:#D2A8FF}.ct-38cc9e{color:#79C0FF}.ct-3ecc1d{color:#FF7B72}.ct-6f9810{color:#79C0FF}.ct-a9a5e4{color:#FFA657}.ct-e53464{color:#C9D1D9}.ct-5abcba{color:#FF7B72}.ct-812250{color:#C9D1D9}.ct-90ecad{color:#FFA657}.ct-1b2855{color:#FF7B72}.ct-373e6c{color:#FFA657}.ct-85d161{color:#D2A8FF}.ct-18ca61{color:#C9D1D9}.ct-5996ab{color:#FF7B72}.light .ct-5996ab{color:#073642}.light .ct-18ca61{color:#657B83}.light .ct-85d161{color:#268BD2}.light .ct-373e6c{color:#657B83}.light .ct-1b2855{color:#859900}.light .ct-90ecad{color:#268BD2}.light .ct-812250{color:#657B83}.light .ct-5abcba{color:#859900}.light .ct-e53464{color:#268BD2}.light .ct-a9a5e4{color:#268BD2}.light .ct-6f9810{color:#B58900}.light .ct-3ecc1d{color:#073642}.light .ct-38cc9e{color:#268BD2}.light .ct-c6baa9{color:#268BD2}"}]}],toc:{title:l,searchDepth:M,depth:M,links:[]}},_type:"markdown",_id:"content:Typescript:Type guards.md",_source:"content",_file:"Typescript\u002FType guards.md",_extension:"md"}},prerenderedAt:1711020862691}}("element","span","text","ct-812250"," ","line","ct-18ca61","code","pet","ct-5abcba","typescript","","ct-e53464","p","pre","ct-1b2855","ct-c6baa9",false,"Useful for type checking at compile and run time:","function isFish(pet: Fish | Bird): pet is Fish {\n return (pet as Fish).swim !== undefined;\n}\n","const pet = getSmallPet();\n \nif (isFish(pet)) {\n pet.swim();\n} else {\n pet.fly();\n}\n","ct-90ecad","Fish"," ","();","Type Guards","\u002Ftypescript\u002Ftype-guards","root","Usage:","isFish","(","ct-373e6c",":"," {"," (","swim","}",".",2)) \ No newline at end of file diff --git a/docs/typescript/type-guards/index.html b/docs/typescript/type-guards/index.html index b0f5a71..7877d36 100644 --- a/docs/typescript/type-guards/index.html +++ b/docs/typescript/type-guards/index.html @@ -1,6 +1,6 @@ -Type Guards • Obsidian Garden -

Type Guards

Useful for type checking at compile and run time:

function isFish(pet: Fish | Bird): pet is Fish {  return (pet as Fish).swim !== undefined;}

Usage:

const pet = getSmallPet(); if (isFish(pet)) {  pet.swim();} else {  pet.fly();}
btw, have a nice day
(2018 - 2024) muerwre
+

Type Guards

Useful for type checking at compile and run time:

function isFish(pet: Fish | Bird): pet is Fish {  return (pet as Fish).swim !== undefined;}

Usage:

const pet = getSmallPet(); if (isFish(pet)) {  pet.swim();} else {  pet.fly();}
btw, have a nice day
(2018 - 2024) muerwre
\ No newline at end of file